Twitter bootstrap, is a framework to quickly develop front end’s or website layouts. Why use it? It provides us with a couple of superb things like:
- Fully responsive.
- Basic (beautiful) style for almost all html elements.
So since http://v1.stekkers.be/ (local youth & environment movement) needed an update (I wanted to make it responsive and more sleek ^^), Twitter Bootstrap seemed to way to go.
For Joomla 2.5 their seemed to be 2 major already existing solutions.
- http://www.joostrap.com/ Expensive!
Unfortunately the second (free) option didn’t feel very finished (the templateDetails containing the module positions wasn’t complete, …) and had some bugs. So I thought, hell, why not, let’s try to do it myself!
After creating my github repo, I started making the jomla template.
Really, it was just very, very easy! Using some tutorials here and there I was able to very fast create a functioning template, that incuded the Twitter Bootstrap sources!
Issues I encountered?
Joomla template settings
I had a typo, in my settings, which made the whole thing break on installation. Even though it’s not very complicated, I thought sharing it with everyone might be a good idea. And by the way, these settings are saved in the database! No need for INI files anymore!
<field name="SiteTitle" type="text" default="Title" label="Template title" description="This title appears in the black menu on top." />
<field name="GoogleAnalyticsId" type="text" default="" label="Google Analytics Id" description="Add your google analytics id!" />
The complete templateDetails.xml file you can find on github.
I know it is amazing! I was able to change this:
Into a responsive site! Please have a look yourself and rescale the browser, or use your tablet or smartphone!
What I didn’t know then, is that Joomla was doing big efforts to put Twitter Bootstrap in his own core, which I just find awesome! However, it will probably take some time (like 5 months) before all the components and modules I use, will be upgraded for this version. So I am sure my effort (which learned me a lot about Joomla template development and Twitter Bootstrap) isn’t simply a waste.