Insert Custom CSS or JavaScript Files for Template

Insert Custom CSS or JavaScript Files for Template

Insert Custom CSS or JavaScript Files for Template

Work on your own theme, not a built-in one. Create a new theme or extend an existing one first — LimeSurvey updates can overwrite changes made directly to a built-in theme. See Creating a New Theme.

Just adding your own CSS or JavaScript? You usually do not need to touch config.xml at all — put your rules in the theme's custom.css and your code in custom.js. These are loaded for you.

Registering additional CSS or JavaScript files is what config.xml is for:

  • Upload your files to the theme's /css or /scripts folder
  • In your theme's config.xml, add the file paths to the <css> or <js> blocks

Example configuration:

<css>
	<filename>css/jquery-ui-custom.css</filename>
	<filename>css/bootstrap-slider.css</filename>
	<filename>css/awesome-bootstrap-checkbox/awesome-bootstrap-checkbox.css</filename>
	<filename>css/flat_and_modern.css</filename>
	<filename>css/template.css</filename>
	<filename>css/myCustomPlugin.css</filename>
</css>
<js>
	<filename>scripts/template.js</filename>
	<filename>scripts/bootstrap-slider.js</filename>
	<filename>scripts/myCustomPlugin.js</filename>
</js>

Not seeing your changes? Clear the LimeSurvey cache after uploading files or editing config.xml — cached assets are the usual reason a correct change appears to do nothing.

Related Articles