Setting up the Bootstrap theme

If you have Moodle 2.2, 2.3, or 2.4, you can still get all the benefits of the Clean theme by downloading and installing the Bootstrap theme on which Clean is based.

Carry out the following steps in order to download and install the Bootstrap theme:

  1. First you will need to download the theme from the Moodle Plugins Directory page. Go to https://moodle.org/plugins/ and type Bootstrap in the search box, then click on the Search plugins button.
  2. This will bring back the result Themes: Bootstrap. It should look something like the following screenshot:
  3. Click the Bootstrap link, and then on the next page select the Download versions tab. Select the correct version for your Moodle and download it.
  4. This will download a ZIP file. Extract the contents of this ZIP file to your computer. It will contain a folder called bootstrap. This is your theme folder. Copy the bootstrap folder into your <moodle site>/theme folder.
  5. Next, open your browser and log in to your Moodle as a site administrator. Moodle will detect the new theme and will immediately open the Plugins check screen. Click on the Upgrade Moodle database now button.
  6. The theme will then be installed to Moodle and you will see a confirmation message. Click on the Continue button.
  7. The next screen that displays is the Bootstrap theme settings page. This contains a number of fields as follows:
    • Enable jquery: This field enables a third-party JavaScript library called jQuery, and this checkbox should be selected unless you have a known reason not to use it.
    • Enable Glyphicons: This checkbox should be selected if you want to use the theme's own icons instead of the Moodle standard icons. We recommend that you leave this checkbox unselected for now, but come back later and try selecting the checkbox and see which you prefer.
    • Logo URL: This field should contain the full URL of your own site logo if you want to display it.
    • Custom CSS: This field is used add custom CSS to make minor changes to the theme without amending the code files. We recommend leaving this to proficient developers, and just ignore this field.
    • Google analytics key: This field should contain your Google Analytics key if you wish to set up your site with Google Analytics.
  8. Click on Save changes at the bottom of the screen, and the theme setup is then complete.

The Bootstrap theme is now available on your Moodle site. The next task is to go into the Moodle Theme selector screen and set it up as the default site theme.

Carry out the following steps in order to set this up:

  1. On the ADMINISTRATION block, navigate to Site administration | Appearance | Themes | Theme selector.
  2. This will open up the Theme selector screen. There are four options listed under Device type that you can select: Default, Legacy, Mobile, and Tablet.
  3. Click on the Change theme button next to the Default device type. On the next screen you are presented with a long list of themes, each with a screenshot. Scroll down to theme called Bootstrap and click on the Use theme button.
  4. After clicking on the Use theme button, a confirmation screen is displayed. This will show the Bootstrap screenshot and some information about the theme. Click on Continue.
  5. After clicking on Continue you will be taken back to the Theme selector screen, which will now display the newly selected Bootstrap theme next to the Default device type.
上一章目录下一章