The ability to add custom code in specific sections of a website, such as inside <head> tag, after <body> tag, or before </body> tag, provides you with more flexibility and control over your website's functionality and appearance.
Most third-party tools will let you know which tag to add their code to. If they don't specify that, you'd want to try the <head> tag first.
With Sitebuilder, you have four places where you can add custom code to your site:
- In the Website settings for the whole website
- In the Page settings for a single page
- In the Custom block using the HTML widget
- Via HTML Embed block.
Adding site-wide custom code
To add site-wide custom code to your site, follow these steps:
- When in Sitebuilder, click the Main menu button in the top left corner and then click Settings on the Sidebar.
- In the Website settings menu find the Custom code tab.
- Copy the HTML code, and paste it (or write it right in the field) into 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.
- Click Submit to save the changes.
The results will not be visible at this stage, you need to Publish for your code to be executed. If you want to check how the code works before publishing, use the Preview button on the Topbar.
Adding per-page custom code
- On the Topbar, click Pages to open the Page manager.
- In the Page manager, choose the page you want to add custom code to and click its Settings icon.
- In the Page Settings menu, click the Custom code tab and insert the HTML code valid for this page only into the relevant field.
- Click Submit and Publish. Your custom code will be added to your page.