Skip to main content

How to integrate custom code into a section (Proven expert, webinar-opt-in, Google reviews etc.)

In this article you will learn how to integrate custom code into specific sections of your landing page.

Jacob avatar
Written by Jacob
Updated this week

Onepage allows you to add custom HTML, CSS (including SCSS), and JavaScript code to your website. These technologies are essential for creating and designing modern websites. Here is an overview:

  • HTML (HyperText Markup Language) is the standard language for structuring and presenting content on the web. HTML tags are used to define elements such as paragraphs, headings, tables, images, and videos, which form the basic structure of a webpage.

  • CSS (Cascading Style Sheets) is used to style HTML elements. With CSS, you can control the visual appearance by setting properties like colours, fonts, layouts, and responsive design.

  • JavaScript is a programming language that enables dynamic and interactive features on websites. It is used to update content without reloading, create animations, process user inputs, and much more.

With these tools, you can customize and optimize your Onepage website to suit your needs.

Step 1: Select section and bring up element menu

Move the mouse pointer over the section you want to edit. A grey panel will be displayed. Click on the second ‘burger symbol’ (symbol with three dashes).

Step 2: Add the "Custom Code" Element

Click on "Add element" and search for the "Custom Code" element.

Step 3: Enter the code

A new code element will now appear in the section. Please click on it to insert your code.

Three separate columns are available in the custom code section: HTML, CSS and JS. It is crucial that you enter your code in the correct column to ensure the proper functionality and display of your website. When you receive code from third-party providers, there are usually instructions included that specify which column the code needs to be placed in. Following these guidelines will help avoid errors and ensure that your customisations work as intended.


To help you understand the process better, we have also included a video demonstration:


Frequently asked questions and solutions

Why is my embedded content (e.g. a form) not displayed?

This can have several causes:

  • Wrong column: Make sure the code has been inserted in the correct column (usually HTML for <iframe> codes).

  • Invalid code: Check that the code has been copied completely and correctly, with no missing characters or tags.

  • Third-party restrictions: Some services (e.g. Typeform) require that the website is publicly accessible or that certain settings are activated.

  • Browser restrictions: Test the page in a different browser or in incognito mode to rule out cache issues.

I can no longer edit my website properly after inserting the code.

Personalised code can sometimes cause a conflict with the Onepage code. We recommend removing the code or checking for errors. If it is no longer possible to remove the code, please contact our support team.

How can I set up the code in the level of the whole project or subpage?

Please take a look at our instructions.


Related articles


💡Do you have any feedback concerning this article? Please let us know through our live chat or at support@onepage.io, so we may keep it up to date. Thank you! 🙂

Did this answer your question?