Introduction

Now that you control the website workflow and have customized some of it's sections, you may want to apply some changes at the template level, like the links and buttons colors, or using custom css for your custom html.

Step 1. Change the color

Navigate to Extensions -> Templates -> Styles. Click on the template installed on your site, in Template Style select your prefered style from the list. CloudHotelier templates are packaged with 35 style variations:

Step 2: Custom CSS

If you want to load your custom css to the site, proceed to add this file to the style you are using. For example, if you are using the red style, you should place your custom.min.css file in this path:

/templates/{your-template}/styles/{your-style}/css/custom.min.css
/templates/{your-template}/styles/{your-style}/css/custom.css

Don't forget to enable the Load custom.css option in the template settings as seen above. 

Step 3: Custom Favicon

If you change the template default favicon, the changes will be lost when updating the template. To use your own favicon, you only need to place these files in the style img folder:

/templates/{your-template}/styles/{your-style}/img/favicon.ico 
/templates/{your-template}/styles/{your-style}/img/apple-touch-icon.png

Next steps

In the following tutorial we are going to modify the navigation and start customizing the inner pages.