It's less that 24 hours that I've known Bootstrap and I've fallen in love into it!
As I've understood, Bootstrap is a collection of CSSs ready to use.
We should only give the class name according to Bootstrap and our website will have a modern and perfect look.
OK.
Now the problem is that Joomla builtin system doesn't use Bootstrap compatible classes.
Is there a fast way to change way to change Joomla builtin CSS system to be compatible with Bootstrap?
Hope it be understandable.
Maybe there is a plugin to convert Joomla CSS system to Bootstrap-familiar CSS. I couldn't find such exact plugin.
I know the feeling about Bootstrap. A lot of people would disagree, but I too really like it. However, even though Joomla 3.0 is based on Bootstrap, I wouldn't recommend using it, as it's the short release. Joomla 2.5 is still the long term recommended version to use, therefore I suggest you stick with that and find yourself a Boostrap template, such as Joomstrap, which is free. Please note that the template was based on Bootstrap 2.0.4, so you will need to download the latest version and replace the CSS and JS files.
You might also be interested in the Boostrap template based on Gantry for Joomla 2.5.
Having said to stick with Joomla 2.5 as it's the long term release, once Joomla 3.5 comes out, which will be the next long term release, I would upgrade to that. This too will also be based on Bootstrap.
If it's possible for you to upgrade your System, the new Joomla 3.0 comes with Bootstrap. Otherwise you only have to build an own Template where you use this Framework.
There is no problem with doing that.
You start with developing a custom template, then after that you just use overrides for your components etc.
You don't need a plugin.
Related
I have a website with Joomla 2.5 CMS and template (theme) made with Artisteer 4.1.
Responsive (mobile) mode is not working, but template.responsive.css file is there and seems to be ok and general template structure seems to be ok too (in comparison to other templates which have no problems with responsive mode).
Under problem with responsive mode I mean that changing web site resolution make no changes which should be in this case.
How to fix responsive mode problem?
Several things spring to mind:
Joomla 2.5 is very old and not supported any longer.
Since Joomla is old, it is very likely that the template that works with it does not proper support responsiveness.
Artisteer has never been known for it being responsive. Actually more that it does not work.
Solution is primarily to use another or more modern template (that you know is responsive). And better to first update to Joomla 3 (Joomla 4 is soon here).
If not, then you might have to make the template responsive your self - it only takes CSS skills and perhaps a Joomla module for a better module.
Most "regular" websites I've seen generally use Twitter Bootstrap, at least for the grid layout.
Most themes I've seen to WordPress does not use Bootstrap, they are often built with a custom grid layout.
Is Wordpress + bootstrap a bad solution? Or why do so few Wordpress themes use bootstrap?
I'd agree with most of the comments, but I'd argue that this is NOT an opinion based question. There's nothing empirically WRONG or BAD about using Bootstrap in WordPress themes. In fact, I do it every single work day. Sage theme is a popular starter theme that uses Bootstrap, and there's plenty others that do as well.
The technologies are perfectly compatible, it's ultimately just up to your design / development goals for the theme. If you desire finer control and don't want to do a bunch of style overrides for a very specific look-and-feel, then maybe Bootstrap isn't right for that particular project. However, there's nothing from the WordPress side of things that would make this a bad solution.
I have used Orchard for my project and installed Bootstrap 3.0.0 theme as it will quick and reliable for me to design whole site using Bootstrap 3.0.0. I have created one custom module using http://docs.orchardproject.net/Documentation/Creating-a-module-with-a-simple-text-editor
But at the end, I am not able to get access of my module. Let me know if anyone can help me.
There is a bootstrap 3 theme on the gallery. You can find it here: http://gallery.orchardproject.net/List/Themes/Orchard.Theme.Bootstrap
It's pretty straightforward to modify, it also will help you to build your own theme and understand how the things work.
I have to develop a plugin for Wordpress. Most of the styles are based on the Bootstrap CSS library. However, for some design decisions I have to redefine the default behaviour of bootstrap. What is the recommended way how Bootstrap features are to be redefined?
One example: I need a zebra striped table. The bootstrap class table-striped has already much of the features I need. However the stripes should be green not gray and the contrast should be a bit stronger. In addition some of the features of the Bootstrap class table must e changed – for example padding and font-size.
The clients who are installing my plugin may or may not update to new versions of Wordpress and Bootstrap. Some of the might be unable to change the Wordpress or Bootstrap installation which exists already on their web host. For this reason it is probably not a solution to modify Wordpress files or the Bootstrap original CSS. In addition: The solution must work with various browsers – not just browsers of the last generation.
I have looked in various forums and found a number of suggestions – including .less and recompiling a modified version of Bootstrap. However, many of these solutions look more like hacks or “work-arounds” rather than a “recommended software architecture” - a kind industrial standard. Other solutions work only with very new browsers.
To summarize my question: How should we integrate modifications like these outlined above into a Wordpress / Bootstrap environment?
If you're worried about Bootstrap updates you could always do some kind of "child theme" type of treatment: You can be using your main style.css to overwrite the bootstrap styles. Then your WordPress theme and Bootstrap styles can be independent.
What kind attempts there exist to make Plone 4 themes based on Twitter Bootstrap, preferably 2.0?
I have seen some discussion on mailing list and I'd hope to know what add-ons there already exists before inventing a new one.
http://pypi.python.org/pypi/plonetheme.bootstrap/1.0a1
and
https://github.com/kagesenshi/diazotheme.bootstrap
You don't need to use an add-on per se (though you can). Instead, consider downloading an example template from:
http://twitter.github.com/bootstrap/getting-started.html#examples
Then apply rules to it, as explained here:
http://docs.pythonpackages.com/en/latest/hosted-configs/plone-diazo.html
This approach places a heavier emphasis on HTML/CSS/JavaScript knowledge in general, and less on Plone-specific techniques.
Note that the new (4.3-hopefully) plone.app.theming will contain an example/template theme based on Bootstrap.
It's not intended to be perfect (it also needs to be easy to understand and chop up and reuse), but it shows the basics. See https://github.com/plone/plone.app.theming/tree/optilude-ace/src/plone/app/theming/template for the work in process.
Bootstrap is a starting point to create a webapp. It provides a lot of CSS with associated widget. Mix with Plone will add conflict (forms.css, ...) and not optimised results (weight of page).
Once Plone will have splited CMS UI in overlays it will be easier to build the CMS UI itself on bootstrap or use bootstrap to create a theme (I like their responsive solution).
At the moment you will have many bugs by using existing addons. I have already tried plonetheme.bootstrap and diazotheme.bootstrap.
So if you really want it, get all Plone's CSS in a trash, get bootstrap and start to see what happens ;)