×

Welcome to ClickFunnels Support!


To get you a solution as fast as possible please read and follow these guidelines prior to submitting a ticket. This sequence has been proven to get you solutions, very fast.


  1. Don’t Panic. All problems can be solved, and most can be found quickly within our Help Articles.


  2. Clear Your Cache. Please see our article on Clearing Your Browser Cache if you’re not familiar with how to do so. This quick and easy step is the first step to solving a number of issues.


  3. Review Your Settings and Steps. Many issues are caused by an unintentional miss-step, like not saving a change in settings or the editor. Please try the process again to see if the solution presents itself in the re-attempt.


  4. Submit a Ticket with All Relevant Information To get you an answer faster it’s important that our team has all relevant information including the issue that you’re experiencing, relevant links, screenshots, error messages, and images to show us what you see. Please also include the funnel, custom domain, integration related to your solution.



Our funnel heroes are often able to respond within 24 hours of submitting your question, Monday through Friday.

Articles in this section

See more

Adding A Custom JS/HTML Element To Your Funnel Page

Yashica Burgess
  • Updated
Follow

Adding a Custom JavaScript/HTML element will be helpful for including scheduling software and other tools in your funnel page. This article will go over how to add a Custom JS/HTML element to your page.

Prior to getting started, you will need to have the following:

Step 1: Adding The Custom JS/HTML Element:

1. Access the Funnels Page by hovering over the ClickFunnels drop-down menu from your dashboard and clicking on Funnels.

Adding_A_Custom_JS_HTML_Element_To_Your_Funnel_Page_1.png

2. Choose the funnel you want to edit by clicking on the Funnel Name.

Adding_A_Custom_JS_HTML_Element_To_Your_Funnel_Page_2.png

3. Select the desired funnel step.

Adding_A_Custom_JS_HTML_Element_To_Your_Funnel_Page_3.png

4. Click on the Edit Page button of your funnel page to access the Page Editor.

Adding_A_Custom_JS_HTML_Element_To_Your_Funnel_Page_4.png

5. Navigate to Elements and click on Add Element.

Adding_A_Custom_JS_HTML_Element_To_Your_Funnel_Page_5.png

You can also hover over any other element on your page and click on the plus sign to add a new element.

Adding_A_Custom_JS_HTML_Element_To_Your_Funnel_Page_6.png

6. Scroll all the way down and click on the Custom JS/HTML element under the Misc Elements section. You can also drag the element and drop it on your page as needed.

Adding_A_Custom_JS_HTML_Element_To_Your_Funnel_Page_7.png

Step 2: Editing The Custom JS/HTML Element:

1. Hover over your Custom JS/HTML element and click on the gear icon to access the element’s Settings.

Adding_A_Custom_JS_HTML_Element_To_Your_Funnel_Page_8.png

2. Click on the Open Code Editor button to add your JS/HTML code.

Adding_A_Custom_JS_HTML_Element_To_Your_Funnel_Page_9.png

3. Paste your code in the Custom Javascript / HTML field.

4. Click on the X or outside of the code field to exit.

Adding_A_Custom_JS_HTML_Element_To_Your_Funnel_Page_10.png

5. Choose code type from the Custom Code Type drop-down menu.

a.Regular HTML/JS Code - Use the HTML and JavaScript that you write inside of the custom code editor.

Adding_A_Custom_JS_HTML_Element_To_Your_Funnel_Page_11.png

b. 3rd Party Embed Code - Use this option when you are using a 3rd party widget that is printed to the page.

Important Note: Due to the custom and varying nature of custom coding, our support team is unable to provide support for writing or troubleshooting any code added to your ClickFunnels pages.

6. Adjust the general settings in the Settings tab. (optional)

a.Regular HTML/JS Code - Use the HTML and JavaScript that you write inside of the custom code editor.

Adding_A_Custom_JS_HTML_Element_To_Your_Funnel_Page_12.png

7. Click on Advanced to adjust the advanced settings. (optional)

a. Animation.

    • Timed Delay - Fade in or fade in with scale.
    • Type - On page load or on page scroll for the delay that you have set.

Adding_A_Custom_JS_HTML_Element_To_Your_Funnel_Page_13.png

8. Click the Save button to save your changes.

Adding_A_Custom_JS_HTML_Element_To_Your_Funnel_Page_14.png

 

 If you have any questions about this, please contact our support team by clicking the support icon in the bottom right-hand corner of this page.

Related articles