I just developed for a client an html and css template using Bootstrap latest version (3.X).
The client wants now to include the template in Joomla but this CMS works the 2.3 Bootstrap version so I'm having a lot of trouble cause of class missing etc.
Do you guys know a way to include Bootstrap 3 in Joomla without having conflicts etc ?
Thanks a lot for you answer ;)
Related
I'm trying to figure out whether it would pay off to use Bootstrap on my existing Wordpress site and while researching it, I came up with the idea that the template I'm using might actually already be using Bootstrap.
I can't see any signs of Bootstrap in my functions.php file or through the FTP, but the template is using classes like these: ".col-md-4", ".col-sm-4". Is that because it was created with Bootstrap or is it just a convention?
Sorry if this is complete nonsense.
That's a classic bootstrap class.
You shouldn't check the PHP files but the css ones or javascript.
It may be a sign.
You can check more bootstrap classes Like container, row, and ...
And for being sure you can check asset files like CSS and JS files, if you found bootstrap css and js files you may be sure of using bootstrap in your template.
You can open asset files it may wrote the bootstrap version in it even.
I'm set with the migration of several Wordpress themes that use Bootstrap 2.3.2. The choice is to use 3.3.7.
First off, I checked that there are no custom div IDs or classes used in the theme.
I then replaced the 2.3.2 CSS/JS Bootstrap files with the 3.3.7 equivalent files.
The layout was a mess as a result. Images are no longer responsive, and there is obvious viewport overflow in different devices.
I have already noticed that the Wordpress posts and pages use HTML elements with Bootstrap styling directly applied.
Does anyone here have experience with this kind of large scale task? What workflow did you apply to migrate Wordpres themes with Bootstrap from 2.3.2 to 3.3.7 quickly?**
I do not need to change the look and feel.
Have you looked at the migration document here? the migration document highlights all changes to classes and what you need to do. There are also online tools like this one and this tool which you can try.
I have a very specific question, related to the context: I'm re-building a WP plugin that have already 1000+ active install.
I was thinking using Twitter bootstrap to make good responsiveness of my views, and adding it like this :
add_action('wp_head','head_code');
function head_code(){
// compiled and minified CSS
$headcode = '<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">';
echo $headcode;
}
The problem this is totally interfering with the installed theme (changing the layout). I can't change anything in the theme nor the WP install, this is just a plugin that can be downloaded for the WP repository and have some backend and frontend views, I shouldn't change anything that is already existing on the website.
So I see only 2 ways :
1. I can "isolate" the bootstrap css only for my view's usage. If possible, how?
2. I have to use a more standard was of developing WP plugin and use other responsiveness best practice. What's your oppinion / feedback?
Bootstrap classes create conflicts with your actual theme, I found a gist of bootstrap 3 with a wrapper called .bootstrap-wrapper for avoiding conflicts.
You can also use this css prefix tool with the last version of bootstrap.
I downloaded a customized version of bootstrap 3 from the web (I changed the number of columns to 7), but my website uses zf2 which comes packaged with bootstrap 3. How can I have a page of my website use this customized version and have the rest of the site use the standard build?
Will I have to do something with LESS? I'm just unsure of how this would work or if it can work at all.
I tagged this with zf2 because that is my specific use case, but this is more a general boostrap, css question.
If you only want ONE page to use it, why not just output the customized Bootstrap CSS files on that one page, and the standard CSS files on everything else?
No, since both versions of bootstrap use the same class names, you can not use multiple instances of bootstrap on the same page.
Is it possible to implement 100% of bootstrap in joomla without any custom css?
There's this great article about building a theme with Twitter Bootstrap.
http://magazine.joomla.org/issues/issue-aug-2012/item/818-using-the-twitter-bootstrap-framework-to-build-a-responsive-joomla-template-from-scratch
If you are building a new site. Take a look at Joomla 3.0 as it comes with Bootstrap by default (as well as jQuery).
Sure, you can implement Bootstrap without adding any custom CSS< but why would you do that? Bootstrap is not a full blown template or layout. It is a framework used to facilitate creating a template or layout. Even on the Bootstrap examples page they specify that these should be a starting point, not the end product.
http://twitter.github.com/bootstrap/getting-started.html#examples
If you want to create a custom template, it would make sense to start with the started Bootstrap template, adapt it for Joomla, then add the custom CSS and images to make it look good.
It would be a good idea to also look at Joostrap (http://www.joostrap.com/). They have a very nice basic template that we base all of our custom work on.
I have built some templates for Joomla 3.0, Bootstrap in Joomla 3.0 doesn't support all Glyphicons that Twitter Bootstrap supports, so if you want to use the missing icons you will need to add your custom CSS.
If you build a responsive template for Joomla 2.5, there will be a lot of works to do, not only for CSS, default extensions in Joomla 2.5 are not responsive so you may need to override their default layouts.