After download the template, you will get a zip file, extract it to get the themes
directory in it. In the themes directory, you will get a source
folder and a theme
folder.
Basic Usages
Now you have found the theme folder, which is the generated HTML template, you can simply edit the HTML and CSS files from the theme
folder. To preview the changes you make to the code, you can open the index.html file in your web browser.
Advanced Usage
You have found another folder in the themes directory called source
, Whice is the source files of this template. For advanced usage, you have some prerequisites to install. Then you can run it on your localhost. You can view the package.json file to see which scripts are included.
Install prerequisites (once on a fresh machine)
- Node Installation: Install node js
- Gulp Installation: Install gulp globally from your terminal
npm install --global gulp-cli
Or visit the original Gulp docs
Local setup
After successfully installing those dependencies, open the themes
folder with any IDE [VS Code recommended], and then open the internal terminal of IDM [vs code shortcut ctrl/cmd+`
]
- Install dependencies
npm install
- Run locally
npm run dev
After that, it will open up a preview of the template in your default browser, watch for changes to source files, and live reload the browser when changes are saved.
Production Build
After finishing all the customization, you can create a production build by running this command.
npm run build
Now you get a theme
folder that has all the changes you have made. you can use this folder as your main theme.