We'll use the Divio app to give us access to the project's templates.

The project setup downloaded all files into a newly created folder in your workspace. Open the folder by hitting the icon:

For this tutorial, we’ll only be focusing on the following folders inside your project directory:

  • static 
  • templates 

Downloading the Theme Files

Our page looks a bit empty - just a basic menu and a message:

"This page has no content yet. Make sure you are in Edit mode (hit the Edit page button if required). Then switch to Structure mode."

Let’s change this by adding a theme.

We’ll be implementing the Clean Blog theme, which is an open-source Bootstrap 4 -based project for this tutorial.

Download the zipped archive of the theme. (Important: there might be newer versions available, this tutorial was tested with 5.0.3.)

Extract the ZIP file somewhere near your workspace, since we’ll be moving a few files around. Open the extracted folder into a separate window.

Move the extracted Clean Blog Theme to the left of your screen. On the right open the currently synced project. Notice that you’ll need to select the following from the extracted theme folder on the left:

  • css 
  • img
  • js 
  • vendor 

Copy all these into your project’s static  directory (on the right). Make sure to overwrite all files and folders when prompted to do so. 

Did this answer your question?