Adding Bootstrap JavaScript functionality

Our default theme currently uses Bootstrap 3.4 as a CSS framework, but does not include any JavaScript functionality.

Using our Custom HTML/Layout feature, you can customize the look and feel of the site, and also add other enhancements as needed. One example of a customization would be adding Bootstrap's JavaScript.

In the "Main Layout", under {{ footer_core_js }}, add the following:

<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js" integrity="sha384-aJ21OjlMXNL5UyIl/XNwTMqvzeRMZH2w8c5cRVpzpU8Y5bApTppSuUkhZXN0VxHd" crossorigin="anonymous"></script>

Adding Tooltips

One thing you can do with Bootstrap's JavaScript is to add tooltips to your site or articles, like this:

To to this, you will paste an additional snippet. Below the <script> tag mentioned above, also paste the following. 

<script>
  $(function() {
    $('[data-toggle="tooltip"]').tooltip()
  });
  $(document).on('turbolinks:load', function() {
    $('[data-toggle="tooltip"]').tooltip();
  });
</script>

Then, in an article where you want to add a tooltip, you'll need to switch into Code View and add HTML like the following example:

This is a test to show how <strong data-toggle="tooltip" title="This is a tooltip test">tooltips</strong> can work.

Get in touch if you have any other questions.