How to activate theme_bootstrap

You have a running TYPO3-installation and want to activate themes with Bootstrap? Here are the basic steps.

This tutorial assumes you have a running TYPO3 CMS-installation 7.6 and want to install themes with theme_bootstrap. If you use TYPO3 CMS 6.2, this will run perfect, but please be sure to fetch the corresponding versions of the extensions.

1. Step: Install and activate extensions

First of all you have to install the following extensions:

  • themes
  • themes_gridelements
  • gridelements
  • theme_bootstrap
  • dyncss
  • dyncss_less
  • css_styled_content - Alternatively (not additional) you can choose fluid_styled_content and then add the static-template: Themes (Experimental: Additional add this for fluid_styled_content). But please be aware that at the moment theme_bootstrap with fluid_styled_content is not working perfectly for all content-elements.

You can install them in the TYPO3-extensionmanager from TER:
or from github:

Please activate these extensions. Then go to the Module "Template" - "Edit the whole template record" 

2. Step: Choose a theme for Root-Page

Then go to the "Page"-Module, choose your Root-Page in the page-tree and edit the "page-properties". At the tab "Behaviour" choose "Use as a Root-page". After you have done this you will see a little themes-icon at your root-page in the page-tree.

Please go to the Themes-Module and choose a theme. In case you installed theme_bootstrap only, activate it now.

3. Step: Choose backend-layouts

Please go to "Page"-Module and choose your root-Page and page-properties again. In the tab "Appearance" you can choose one of the backend-layouts for your root-page and another one for the subpages. 

4. Step: Configuration

Please go to the "Themes"-Module again, choose your root-Page, select "Basic" and set your basic Configuration for colors, baseURL and so on. For further configuration you can choose "Advanced" and "Expert" so you will a lot of constants to choose.



Now you have a TYPO3-installation with bootstrap-layout. For any changes at the templates, additional constants or css/less-changes we recommend not to do any changes at the bootstrap-theme. Instead you should build a child-theme for these changes.