Custom JS/HTML

The custom JS/HTML element empowers you to integrate your personalised code into your webpage.

D
Written by Danni Harris
Updated over a week ago

The custom JS/HTML element empowers you to integrate your personalised code into your webpage, enabling the addition of unique custom components. This versatile feature allows for greater flexibility and creativity when designing your site, ensuring a truly tailored user experience that aligns with your specific needs and vision.

General Settings

Element Name/Title

Within the General Settings feature, you can access the default name/title of the Edit option you are currently working on, and choose to rename it if you prefer. This feature is particularly useful when you are working with multiple elements in your funnel and need to distinguish them quickly.

Open Code Editor

You can utilise the Open Code Editor button to input your custom code for your element. By clicking on this button, a popup window will appear, allowing you to type in or paste your code with ease. This feature provides you with the flexibility to add custom coding to your web page, enabling you to tailor the look and functionality of your elements to suit your specific needs.

Spacing Option:

There are different spacing options available for adjusting your content. Depending on the Edit option you are working on, the settings will only be applicable to that option. For example, if you are editing a particular Row (the BLUE box), only every content in that Row will follow the command of what settings you make.

  • Padding Left, Right, Top, and Bottom

This Four (4) different toggle bar moves the content to either the left, right, top, or bottom depending on the toggle bar you click on.

  • Margin Top and Bottom

You can adjust the margin on the top and bottom of your element by toggling the respective toggle bars.

Visibility

The Visibility feature allows you to control the visibility of specific Edit options on mobile devices, desktops, or both, by selecting the corresponding icon. This feature enables you to tailor your web page to your target audience and optimise the user experience for each device type.

Custom Class

You can add a Custom Class to your web page by inputting your desired class name into the dedicated field. This feature helps you apply custom styles to specific elements of your web page by linking them to style definitions in a stylesheet.

CSS Selector

You can easily copy the Custom CSS code by clicking on the "copy" icon located on the right side of the reference code. This feature saves time and makes it straightforward to replicate and implement your CSS Selector code across your web page.

Need more help?
โ€‹
Join us for live daily support - Book now.

Did this answer your question?