Adding custom code to your site and page

You can add custom code snippets to your site using the code insertion fields in Website Settings.

Use the HTML Embed block to add HTML and scripts that enhance your site. Some of the code that can be added include:

  • Live chat services
  • Site analytics
  • Google Tag Manager

Note: HTML Embed functionality cannot be used for adding content or styles. To add content to your site, add a block. Visit this tutorial to learn more.

 

How to add a custom HTML block

Click on the +Add a block button. In the Block library, choose HTML Embed:

Screenshot_2021-06-02_at_21.14.43.png


The block adds to the space on the page that you have chosen. It will look like this:

Screen_Shot_2021-04-26_at_14.18.24.png

You can now start embedding various types of custom code into your page. To access the Custom HTML function, click on the block to activate the control pane:

Screenshot_2021-06-02_at_21.16.34.png

For more information on how to embed content, please read these tutorials.

 

How to add site-wide custom code

  1. In the main menu, click Settings…  

website_menu_-_how_to_access.png

 Screen_Shot_2020-08-17_at_09.56.12.png

 

2. Scroll down to the Custom code area.

Screen_Shot_2020-10-13_at_01.27.42.png

 

3. In the service from which you want to add code, copy the HTML code, and paste it in an appropriate field:

  • Inside <head> tag: Code added in this field is injected into the <head> tag on every page of your site. 
  • After <body> tag:  Code added in this field is injected after the opening <body> tag on every page of your site
  • Before </body> tag:  Code added in this field is injected before the closing </body> tag on every page of your site.

The results will not be visible at this stage. Click Submit and Publish for your code to be executed.

 

Integrating Google tools

You can connect Google services by adding Google Webmaster verification code and Google Analytics in the Integrations tab:

 

Screen_Shot_2020-10-13_at_01.28.58.png

 

Add the relevant data and click Submit, then Publish.

For more information on adding Google Webmaster code and Google Analytics read these:

Google Webmaster verification steps

Adding Google Analytics to your site

 

How to add per-page custom code

  1. From the main menu, go to the Pages menu and click on the “cog” icon next to the page where you want to inject custom code.

page_settings.png

  1. In the Page Settings menu, scroll down to the Custom code section.

  2. In the service from which you want to add code, copy the HTML code, and paste it in an appropriate field: 

 

A. Inside <head> tag: Code added in this field is injected into the <head> tag on this page only.

BAfter <body> tag:  Code added in this field is injected after the closing </body> tag on this page only.

CBefore </body> tag:  Code added in this field is injected before the closing </body> tag on this page only.

  1. Click Submit and Publish. Your custom code will be added to your page.

FAQ: How do I know in which area to add the code?

Some service providers give you instructions on which part of the HTML to add the code.

Screen_Shot_2020-05-21_at_18.28.44.png

Other helpful articles

Adding a Language code (hreflang tag)

Embedding a Facebook post

Adding website animations

Text formatting

Was this article helpful?
0 out of 0 found this helpful