Welcome to the OpenCities help centre. Search for what you're after, or browse the categories.
Can't find what you're looking for? Submit a support ticket and we'll be in touch.

Follow

Adding third-party scripts to OpenCities

avatar of Kira Hartley

Kira Hartley

Last updated

This task should be undertaken by users with the following roles: OC Developer.

A third-party script is an externally sourced script that can be directly embedded into your site. They can be embedded into your site header or footer and be applicable across every page of your site, or they can be embedded into specific pages through the WYSIWYG toolbar.

When you receive a script from a third-party platform, in the instructions, they will specify whether to add the script to the site header or footer of every page on your site. 

When they are intended to be added to every page on your site, the script is added to Device Variables.

The instructions will usually say: 

  • 'The script should be included in your page header before the closing <head> tag on every page of your site'
    • If this is the case, add the script to Device Variables > Custom Injection - Header or,
  • 'The script should be included in your page header before the </body> tag of your site.'
    • If this is the case, add the script to Device Variables > Custom Injection - Footer.

Please note that adding all your scripts to your header can affect your site's performance, as the header always loads first. If you can concerned about this then you can add scripts like Facebook Pixel and Google Tag Manager to your footer.

Some scripts we've seen frequently used are:

  • Google Tag Manager
  • Facebook Pixel
  • Monsido
  • Siteimprove

This article will discuss 2 examples of third-party scripts, Facebook Pixel and Google Tag Manager that are added to the header of every page on your site. If you're looking for information about uploading embed codes to apply through your WYSIWYG on a page level, see Insert embed code.

Facebook Pixel and Google Tag Manager

When adding these scripts to your OpenCities site, you'll receive a script from Facebook Pixel or Google Tag Manager that needs to be inserted into the site's header. To do this:

  1. From the main menu, go to More Device Variables
  2. Select Client Variables.
  3. Select Custom Injection - Header from the list of variables
  4. Add the code snippet in the field Default value.
    Custom header code fields in device variables
  5. Save when you’re done. 

If you have multiple scripts to add to your site header, you just paste them one after the other in the Default Value field.

Please note that when using Facebook pixel there is a privacy concern about site visitors losing their anonymity. This loss of privacy would need to be covered in your cookies or privacy policy.

For more information about Facebook pixel, see the Facebook Business Help Center.

For more information about Google Tag Manager, see the Tag Manager Help center.

Adding scripts to the site footer

The process for adding script to the footer is much the same as adding them to the header. 

  1. From the main menu, go to More Device Variables
  2. Select Client Variables.
  3. Select Custom Injection - Footer from the list of variables
    • Code snippets added to this variable are included just before the closing </body> tag of your site. You can use this variable to include any third-party JavaScript code in the site.
  4. Add the code snippet in the field Default value.
    Custom footer code fields in device variables
  5. Save when you’re done. 

What else?

Was this article helpful?
2 out of 4 found this helpful