Take the 2-minute tour ×
Joomla Stack Exchange is a question and answer site for Joomla! administrators, users, developers and designers. It's 100% free, no registration required.

As an extension developer, I am still confused which Bootstrap version to be used in my upcoming extension.

  • In many discussion I found that Joomla 3.x will not utilize bootstrap-3.0.
  • Most of template providers uses bootstrap v3
  • Many extensions also using bootstrap v3

What to opt ?

share|improve this question

4 Answers 4

up vote 4 down vote accepted

Joomla 3.x ships with the files for Bootstrap 2, and due to backward compatibility this is not likely to change in Joomla 3.x series.

It's important to know that Bootstrap consists of two main areas:

  • The CSS files
  • The JavaScript framework

CSS

Joomla has those files included both as source LESS files and compiled CSS files. Joomla itself doesn't load any Bootstrap CSS files. That's up to the template to decide if it wants to use those files or ship with own CSS files.

In the backend, the active template usually is "Isis", which heavily uses the Bootstrap 2 files. Thus it makes sense to make use of Bootstrap 2 styling in your extension backend. Especially since there aren't many alternative administration templates anyway

In frontend however it's a completely different topic. You have no clue what template the user will use and on which framework that one will be based. Personally I settle on using Bootstrap 2 styling here as well for the sole reason that the core output uses those as well. Thus chances are high that a template will support those classes. Otherwise it provides an override for the output. If it uses overrides for core, your extension likely will need an override as well anyway.

You can of course add support for Bootstrap 3 as well, but that means to double your work. I would however never only provide Bootstrap 3 layouts without an option to load Bootstrap 2 ones.

JavaScript

Joomla has methods to load Bootstrap JavaScript code, like for tooltips or tabs. This code can and should be used by extensions. Just make sure to load them in your layouts so they are overridable by templates if needed.

share|improve this answer

As you've already pointed out, Joomla 3.x will not utilize Bootstrap 3.x, therefore should you decide to go along with using Bootstrap 3, then the user will be loading 2 versions of Bootstrap which may cause conflicts and will also reduce page load speeds.

What you could do is write a small script to detect which version of Bootstrap is powering the template and use that version to style your extension. I think either NoNumber or Akeeba provide the ability to choose bwteen which Bootstrap version you wish to use. I can't remember which but it might be worth having a look at how they do it.

But rather than using Bootstrap to style your extension, why not do some custom styling as another option? Not all template are based on Bootstrap.

Hope this gives you a little insight.

share|improve this answer
    
Problem is that we need to make extension so it does not conflict with template providers. If we do custom styling then customers will have issue while using different templates. –  Shyam May 9 at 17:26
    
You might be best off sticking to Bootstrap 2.x. Most template for Joomla are still based on this version as it comes pre-packed with Joomla. The problem sometimes is that you can't cater for every single person out there. For example, there are probably some template providers that use Foundation to power their templates, but I don't know any developers that support the Foundation classes –  Lodder May 9 at 17:30

In extensions you should always be looking to use Bootstrap 2 syntax in your extensions - especially in the backend. This is the officially supported version by Joomla core and therefore means you're always going to get your styling working as expected and you don't have to ship bootstrap with your template. Extensions which ship with Bootstrap 3 have to include this (note the pretty large Akeeba Strapper class that comes with Akeeba products for example).

Template providers that use Bootstrap 3 normally allow bootstrap 2 syntax by editing their less files to take both versions of bootstrap into account. Those who don't should expect to need to use template overrides anyhow.

The point of Joomla shipping with Bootstrap 2 and not moving to Bootstrap 3 is so there is a b/c cross-extension CSS/JS framework across the entire Joomla series.

share|improve this answer

If you need to use Bootstrap 3, in my opinion you should namespacing the entire Bootstrap 3 CSS (like Community Builder V2), e.g. joomla core function to edit menu's and module's in the frontend get broken, if you use BS3 for frontend.

Quote from Community Builder forum:

Original Link: http://www.joomlapolis.com/forum/6-news-and-publicity/224106-community-builder-20-b2-released?start=6

But will CB2.0 use Bootstrap 2 or 3?

Bootstrap 3.

And will CB always load the complete Bootstrap library, also if just the login-module on a site), because Bootstrap is loading also huge unnecessary stuff.

No, we don't use any of Twitter Bootstrap JS.

We only use its CSS at this time (we've other, better, jQuery plugins that provide the JS functionality). We also load Twitter Bootstrap with a namespace so it's impossible for it to conflict or alter styling outside of the namespace. Right now we do not load it all the time. We only load our template.css and fontawesome.css at all times when CBs template is loaded. Note CBs modules do not use CB styling. They are designed to match Joomla 1:1 so the modules fit in correctly with your site.

An another solution is to use a framework like Skeleton or Foundation, to avoid the above problem.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.