The layout in Contao consists of a theme, templates, and the site structure (website pages based on theme and templates). This theme is known as a front end theme and viewable by the public and the members/users of your Contao CMS.  Back end themes are applicable only to your users, and can be loaded directly in the back end interface.  Both theme types can be obtained from the Contao.org website, or through a third party website.  The following tutorial explains how to obtain and then apply themes via the Contao CMS back end.

Adding a Theme in Contao

Finding a back end theme or front end theme to use for Contao and then installing is actually a pretty simple process when using th Contao interface.  The first set of instructions reviews how to load a back end theme and activate it for a user.  The second set of instructions describe how to load a front end theme that makes up the appearance of the public website for you Contao CMS.

Adding a New Back End Theme using the Extension Catalog

1. Login to the Contao Back End Interface
2. Scroll all the way down until you find the SYSTEM section of the Back End Modules.  Click on EXTENSION CATALOG in this section.  You will something similar to the following:
   
   
   
   IMPORTANT - please make sure to read the description of the themes you are viewing. The themes you will see here are for the Back End only. Click on the drop-down menu labeled CATEGORIES, then select THEMES.  Once you have specified THEME in the menu, click on the arrows configured in a circular pattern to refresh the page.  Note that if you click on the drop-down menu for TYPE, then you can also specify that the you show only the FREE themes.  You will need to click on the refresh icon in the top right hand corner to show the list with the new criteria. 
   
   The back end themes available direct from Contao can be installed immediately through the back end interface.  The extension catalog lists several free back end themes, but many Contao front end themes require payment with pricing based on the Euro.  The installation instructions for loading a front end theme are directly below this section (Loading Front End Themes).
   
   
3. When you find the theme you like, simply click on icon in the top right hand corner of theme - when you hover over the icon it will display INSTALL.  When you click on that icon, you will see the following:
   
   
   Click on CONTINUE at the bottom of the screen in order to continue the installation.
4. When the installation completes you will see this screen:
   
   
   
   Clicking continue will take you to the extension manager screen where you can run updates. 
   
   
   
5. The last step in using a Back End theme is to simply go into the USER section of the Back End modules, navigate to BACK END THEME, then click on the drop-down menu to select your newly loaded theme. Here's what you'll see in the USER section:
   
   
   
   
   
6. Once you have selected the theme, click on a SAVE option at the bottom of the screen to save your selection.

Loading a Front End Theme

A front end theme changes the web site appearance that your members/users and the general public will see.  Loading the front end theme requires that you have the installation files for the theme.  As opposed to a back end theme, the theme files for the front end interface are often downloaded from a specific source. You can obtain front end themes from the Contao.org website here: Contao Open Source CMS Themes. If you wish to obtain front end themes from other sources on the internet, you can run a search with a search engine like Google and find many other websites selling or giving themes away for Contao.  When you finally get the Contao Theme file, the extension for the file is ".cto"  - make sure that you see this, because the file typically will not work otherwise.  If the file is compressed, make sure to read the author's installation instructions for the theme.  If any specific files need to be directly loaded, please see Adding a File to the Contao CMS for further information.  Here are the steps for loading a front end theme:

1. Login to the Contao Back End interface
2. Scroll down the Back End modules list until you see THEMES.  Click on THEMES and you'll see the following:
   
   
   This interface lists the front end themes that are loaded by default - which in this case is the Music Academy theme. 
   
   
   
3. Click on THEME IMPORT and then you'll see a screen requesting the .CTO file for the theme:
   
   
   
   Select your file with the BROWSE button, then click on THEME IMPORT when you have specified the file.
   
   
   
4. When the install is complete, you will see a final listing of the themes like this:
   
   
   
   Files for the theme are automatically imported into the website as per the Contao confirmation at the top of this screenshot.
   
   

As you can see the installation process for loading a theme is quick and simple.  You just need the files and the login access to the Contao back end to complete the installation for any compatible theme.  Remember that front end themes are for the public face of your website, but back end themes must loaded per user in order to be seen and used.