Basic starter

It is a blank directory to make a copy of and start a new project with. It includes the required JS and CSS files from TheDocs as well as icon fonts, PHP files and some images.

This starter suites for simple websites which doesn't require any customization to TheDocs code and writing few additional CSS and JS codes. Simply make a copy and start your project, without npm and gulp tasks.


How to get started?

Follow the below steps to create a project directory with all the required plugins and tools installed.

Step 1

Make a copy of basic/ directory to your desire workspace.

Step 2

Configure your website by openning /assets/js/script.js and change the commented variables.

Step 3

Time for development. Now you're ready to create your HTML files and writing your custom CSS and JS codes.

- HTML
Since most of the websites have a global layout for whole of the application, you might want to start modifying index.html file and create a global layout for your website. Check available layout features such as navbar, header, cover, footer, etc. as well as all the blocks and UI Kit.

- CSS
Write your additional styles inside /assets/css/style.css. Make sure it's imported into your HTML files after page.min.css.

- JavaScript
Your additional JavaScript codes should be write inside /assets/js/script.js after the page.config() method. Make sure it's imported into your HTML files after page.min.js.


How to update to a new version?

Usually, you only need to update the following files and directories in assets/ folder for minor updates. If any extra changes were required, we'll write it in the changelog. For major releases (i.e. from 2.x to 3.x), you probably need to update your HTML code as well.

  • /css/page.min.css
  • /js/page.min.js
  • /fonts
  • /php

Sometimes, you might need to update some parts of the /assets/js/script.js in the configuration section if we state it in the changelog description. We do our best to reduce these changes.


How to add a 3rd-party plugin?

If the plugin has CDN and you're willing to use it, simply include the plugin into your HTML pages by adding css and js files of the plugin from CDN. If you want to host the plugin on your own server, put the plugin inside /assets/plugin and import it into your HTML pages.

To configure and initialize the plugin, write the required JS code inside /assets/js/script.js file with the help of the plugin's documentation.