Adding On-Page Scripts

Introduction

When editing your Carrot site, you may want to add some 3rd party widgets on your pages to help differentiate your content, demonstrate your credibility to leads and heighten user experience. These are added manually to individual pages via either JavaScript or an iFrame embed, and are shown to users on a specific page for them to view and interact with. Some examples of these widgets are:

However, there are a few things to note when adding these items to your site. Let’s dive into these below!

Note: This guide covers adding scripts to pages that will be visible to leads, not site-wide tracking scripts or live chat scripts. For information on installing site-wide tracking and live chat scripts, we have a great guide on that here.


Security at a Glance

This guide is particularly addressing any code that contains a <script> or <iFrame> tag in it, which can be determined by the very first piece of text in the code. Here’s an example:

Anytime you obtain a 3rd party interactive widget and install it manually, it will almost always be in the form of JavaScript or an iFrame embed. To add these to your Carrot site, you’d want to use our HTML block, which accepts multiple types of code. However, you may notice that if you were to place a script in a Custom HTML block and then save, you may not see the widget that you just added on the page.

There is good reason for this, which is, Carrot has a built-in security feature that prevents users from installing this interactive code on-page specifically. JavaScript and iFrame scripts can be and have been used for malicious purposes, such as stealing information or infecting a users machine/device. With this considered, we’ve added an extra layer of security to prevent this from happening to our users and leads that browse our users sites.

If you attempt to save an iFrame or JavaScript code, upon clicking the “Update” button the editor will strip out a portion of the script that allows it to function, and will break the widget. Scripts and iFrames must be installed to your page by a member of the Carrot team. Below we will dive into how we can make that happen for you!


How to Add A Script On-Page

Step 1: Obtain Your Script or iFrame

If you decide to add a 3rd party widget to your site, be sure to shop widgets from a reputable source. Once you’ve decided where you’re going to get your widget, follow the 3rd party’s steps in obtaining the Script or iFrame for it.

Step 2: Determine Where You Want It

Once you have your script/iFrame, figure out where you want it on your site. If you’re adding a reviews widget, you may want to add it somewhere specific on the homepage or add it to your testimonials page.

Step 3: (Optional) Place A Custom HTML Block

This is purely optional, but if you want to add a placeholder so that a Carrot team member knows exactly where to add it for you, go for it! In the editor, click the + button to add a block and search for the “HTML block”. Then click on it to add it to your page, and drag it into the position you want it.

Step 4: Reach Out to the Team!

Now that you’ve got your script/iFrame and know where it’s going, reach out to the team via the chatbox in the bottom right corner of your screen! Let our team know which page it’s going on, then copy and paste the script/iFrame into the chat for them to install. Once they’ve got the necessary resources, they’ll dive right in and get it installed for you. If you plan to add it to multiple pages, let the team know and we can create a block pattern for you that houses the script/iFrame.

Voila! You’ve successfully added a script or iFrame.


Learn More About 3rd Party Tools