Customization

Learn how to write your own custom styles without changing the theme's core files so that you can take advantage of future Updates.

SCSS Method - user.scss (highly recommended)

We highly recommended making edits and additions to the template CSS/SCSS is to use the provided user-variables.scss and user.scss files located in the template/assets/scss folder.

  • user-variables.scss will contain each variable you want to edit. Simply copy the variables you need to edit from the main _variables.scss and paste it into this file. It will automatically override the default values with the new ones.
  • _user.scss will contain CSS/SCSS you want to add or edit.

Compiling changes

In order to see the changes, running Gulp command is required. To learn more about Gulp go the gulp section.

CSS Method - custom.css

If you prefer to work with theme as a static source without Gulp and Sass, you will need to add custom CSS through a separate CSS file.

You just need to link custom.css at the end of <head> tag of each page and start adding CSS you want to add or edit. See example below:

<link rel="stylesheet" type="text/css" href="assets/css/custom.css" />

Note:When you update theme, make sure you have backup of your files and not to override the user's custom file, which may contain styles you have created already. We also recommended to checking how to Updates theme section.