JavaScript

You can add JavaScript code by multiple ways in Decidim:

Webpacker

Decidim uses Webpack (via Webpacker) to compile assets, including javascript.

During the generation of a decidim app, the file app/packs/src/decidim/decidim_application.js is created and hooked to Decidim packs, so any javascript written there is compiled within Decidim assets. For example to create a new alert just add:

$(function(){
  alert('foobar');
});

More information in Rails Webpacker documentation.

If you want to replace a whole file existing in Decidim you can do it by creating a file in your application with the same name and the same path. I.e: to replace decidim-core/app/packs/src/decidim/editor/index.js you should create in your Rails app a file in app/packs/src/decidim/editor/index.js and it will have more priority over the Decidim file.

Head extra file

There is an special partial file for adding inline content in every public page. You just need to create a file called app/views/layouts/decidim/_head_extra.html.erb:

<script type="text/javascript">
$(function(){
  alert('foobar');
});
</script>

Custom HTML Header snippets

If you need changes on a multitenant installation, you can do so by enabling a configuration using your environment variables. Please do notice that this has security implications:

export DECIDIM_ENABLE_HTML_HEADER_SNIPPETS=true

Then you will have a new textarea field called "Header snippets" in Administration → Configuration → Appearance (URL /admin/organization/appearance/edit):

Notice that you can resize this textarea.