Skip to content

External CSS and JS

Jump to bottom Edit New page
Utkarsh Verma edited this page Apr 22, 2018 · 8 revisions

You can freely and fully customize Dream Plus by using your own CSS and JS files externally. It's quite easy and convenient.

Usage

To use this feature, do the following:

  • Place your external CSS or JS within the static/css or static/js directory of your Hugo site folder respectively.

They shouldn't necessarily be in the js or css folders since their paths will be specified in the next step.

  • Specify where your external files are through the customCSS or customJS config variables(in config.toml). The paths should be provided relative to the static directory. For example:
customCSS = ["css/dracula.css"]
customJS = ["js/twemoji.min.js"]

That's it. After doing this, your externally provided files will be loaded within the <HEAD> tag. On a side note, the JS files will be loaded after jQuery and Semantic UI so their functions can be used in your external JS file.

Add a custom footer
Add a custom sidebar
Clone this wiki locally