How do I add a code snippet to my content?

Depending on the type of code and how broadly it should be applied to your site, there are several possible methods for adding and maintaining a code snippet in Cascade CMS. See the following article for guidelines and tips.

Determine where the code snippet should be applied

Before getting started, determine how broadly the snippet needs to be applied to your site, as this can help you determine the approach to use.

  • Site-wide:
    • Consider using a tag manager (see "Using a tag manager" below) to deploy your code site-wide.
    • Or apply the code at the Template(s) level so it's inherited by all pages using the Template(s).
  • A subsection of pages in the site:
    • Consider using a tag manager (see "Using a tag manager" below) to deploy the tag if the page's URL matches certain conditions.
    • Or apply the code at the Configuration(s) level so it's inherited by all pages using the Configuration(s).
    • Or use a Format to render the tag only if the current page matches certain conditions, such as having a specific string in its path.
  • A single page:
    • Apply the code at the individual page level.
    • Or embed it in the source code of a WYSIWYG editor on the page (if applicable) if it can go within the body of the page. Use caution with this setup, as the code won't be visible to users working on the visual side of the WYSIWYG editor and it could be unintentionally altered or removed.

Using a tag manager

If you're already using a tag manager such as Google Tag Manager   , or would like to, we'd recommend using this method to deploy code snippets first. Especially if they should apply to your entire site or a large number of pages.

Tag managers have the advantage of not requiring the site to be re-published to update the live site, since it's loaded automatically when a visitor loads a page. This also makes it easier to update and deploy your code snippet in the future.

Using the CMS

If you choose to maintain and deploy your code snippet with the CMS, before following the guidelines below, be sure to familiarize yourself with the implementation of other links and script tags in your site, as there may already be an appropriate place to add your code snippet.

For example, if you have a code snippet that should be added to the head of your page's markup, use More > Show Regions when previewing an example page to see if you already have an XML Block or Format assigned to a Template region within the head that your script could be added to.

Note - Code snippets, such as JavaScript script tags, often contain invalid XML in their content. To avoid XML validation errors in the CMS, wrap your snippet in a code section.
  • Choose a protect code section for code that may contain invalid XML.
  • Choose a passthrough code section if you only want to the snippet to render in the published page, for example, to avoid tracking activity within the CMS itself.
  1. Create an XML Block or Format to house your code snippet.
    • Consider a Format if you'd like to add conditional statements for when the code snippet should be rendered. For example, if you only want to output the code if the current page is in a specific directory.
    • Click Add Content and then choose Block > XML or Format.
    • Add your code snippet to the Block or Format, making sure to wrap it in an appropriate code section (see note above) if needed.
  2. Create a region in your Template(s).
    • Navigate to your Template and click Edit.
    • Create a new Region in the appropriate area of the markup by adding a System Region tag. Example: <system-region name="CHATBOT SCRIPT"/>
    • Submit your changes.
  3. Attach your Block or Format to the Template region.
    • Navigate to the appropriate Template, Configuration, or Page (see "Determine where the code snippet should be applied" above) and click Edit.
    • Locate the Regions listing. (For Templates and pages this is on the Configure tab.)
    • Assign the Block or Format to the region you created and Submit your changes.