Include customized css&js

Posted on | In |

I want to include my own custom css and js. I tried just simply put .css and .js in the same directory as html or build my own folder to store them, didn’t work.

Following is how it works.

Include js_1

  • Put .js under \theme\your theme\source\js\src\
  • Find _layout.swig under \theme\your theme\layout\
  • Include script in this file.
1
<script type="text/javascript" src="/js/src/yourfilename.js"></script>

Include js_2

Directly add js in html file.

Include css_1

Add another css file is same as js.

If want to change attribute of theme’s elements, just open Inspector of browser to get the name of your css selector~

Include css_2

This works for me.

Find yourfolder/theme/css/main.styl

1
2
3
//My Css
//----------------------------------
@import "_mycss/mycss";

Then find this folder and build a new folder name “_mycss”, whatever you like and new a styl file.

Add css style in that file and add classname in html.

That is it.