You can add custom code to your website to integrate third-party services such as forms, booking systems, calendars, chat widgets, analytics tools, and more. Also, you can change the appearance of your website changing its visual style of some elements by adding custom CSS styles for them.

Our built-in tools allow you to add code either to a specific page or across the entire website.

Examples of supported integrations:

• Typeform
• Calendly
• Booking widgets
• LiveChat tools
• Custom JavaScript or CSS
• Tracking and analytics scripts

Important: Custom code is available for Moto4 Pro sites only.

Tip: Learn how to add CSS classes to your website elements in this guide.

Before You Start

Before adding custom code to your website:

1. Request the installation code from the third-party service provider or developer.
2. Make sure the code is optimized.

Custom HTML, CSS, and JavaScript can affect your website performance and loading speed. To minimize the impact:

• remove unnecessary spaces and characters;
• avoid unused scripts;
• use lightweight integrations whenever possible.

How to Add Custom Code to a Specific Page

There are two ways to add custom code to a specific page:

Option 1: Add an Embed Code Block

Open the block gallery...

...and add the Embed Code block as a new section on the page.

This option is useful when:

• you want the embedded content to take the full block width;
• you need a standalone section for a widget or integration.

Step 2: Open Block Settings

Hover over the block and click the gear icon to open its settings.

Step 3: Paste Your Code

Paste the required code into the provided field (code editor) and click Save.

Step 4: Publish the Website

Publish your website for the changes to take effect.

 

Option 2: Add your Custom Code to an existing/predesigned block

You can also add an Embed Code element inside a blank or predesigned block, just like you add any other element on a page:

This option is useful when:

• you want to place the integration within existing content;
• you need more control over the widget placement inside the layout;
• you want to combine embedded content with text, images, buttons, or other elements.

 

Don't forget to publish your website for the changes to be applied to the live version.

How to Add Custom Code to the Entire Website

To apply code globally across all website pages:

Step 1: Open Website Settings

Go to:
Settings → Custom Code

Step 2: Add the Code

Paste your code into the required section and click Save.

This method is commonly used for:

• analytics tools;
• tracking pixels;
• chat widgets;
• global CSS styles;
• JavaScript libraries.

Important Information About Custom Code Support

Please note that troubleshooting or modifying custom code is outside the scope of our support team.

If you experience issues with a third-party integration, contact the support team of the service you are using.