FAQ content

Look & Feel: Add custom JavaScript and CSS code to public pages

In this article

Admin users can add JavaScript and CSS code -- directly in the custom code boxes or by calling external CSS or JS files -- to customize the appearance of forms, surveys, quizzes, and tutorials.

Additionally, you can choose to enable custom JavaScript to be added at the individual form/survey/quiz/tutorial-level. (Custom CSS can always be added to an individual item.) 


  1. Go to Admin > System Settings.
  2. Click on the Custom JS/CSS tab.
    1. Add your CSS code to the Custom CSS Code box.
      • The contents of this field will be automatically added into a <style></style> tag, then the <style> tag will be added to the <head> section of every public-facing page.
    2. Alternatively, if you have any external CSS files that you want to have loaded into your site, you can add the URL for the files in the External CSS File field.
      • The URL of your CSS file (e.g. https://library.myuniv.edu/customcss/libwizard.css) will be automatically added to a <link href="" rel="stylesheet"> tag, then added to the <head> section of every public-facing page.
      • If including multiple files, enter one URL per line.
    3. ​Add your custom JavaScript code to the Custom JS Code box.
      • The contents of this field will be automatically added into a <script></script> tag, then the <script> tag will be added to the <body> section of every public-facing page.
    4. Alternatively, if you have any external JS files that you want to have loaded into your site, you can add the URL for the files in the External JS File field.
      • The URL of your CSS file (e.g. https://library.myuniv.edu/customcss/libwizard.css) will be automatically added to a <script src=""></script> tag, then the <script> tag will be added to the <body> section of every public-facing page.
      • If including multiple files, enter one URL per line.
  3. Click the Save button.
Adding custom JavaScript and CSS code