Plone and Twitter Bootstrap

Question

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.

Answer 1

http://pypi.python.org/pypi/plonetheme.bootstrap/1.0a1 and https://github.com/kagesenshi/diazotheme.bootstrap

Answer 2

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.

Answer 3

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.

Answer 4

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 ;)