Add Popup

Follow these steps to add a pop-up. There are multiple sets of steps, depending on how the pop-up needs to be added.

1 Creating Your Pop-up
2 Adding a Form to a Pop-up
3 Adding a Pop-up Site-wide
4 Adding a Pop-up to a Single Page
5 Adding a Pop-up to a Group of Pages

Creating Your Pop-up

First, you will need a snippet set up to behave like a pop-up. Some sites may already have some type of pop-up snippet that you can copy or alter to suit your needs. However, if the site does not have a pop-up snippet already, you can copy it from our Standard Snippets folder in the InteractRV account.

Make sure you are logged in to the InteractRV account.

Once you are, you should see a “Standard Snippets” folder on the left-hand side of the Websites>Content area.

Expand the StandardSnippets folder to show the contents of the folder. There are two different versions of pop-up snippets you can copy from – pop-up-graphic and pop-up-text.

Depending on the type of pop-up you are planning to put together, you should select accordingly. Pop-up-text is meant for pop-ups that only contain text, where pop-up-graphic contains a placeholder image for any pop-ups with images.

To copy either one to where you’d like it to go, right-click on the snippet in question to make the actions menu appear to the right of the list of snippets. You’ll want to select “Copy” to copy the snippet to another dealer’s folder.

It will then prompt you to choose where you’d like to copy to. Expand the InteractRV accounts to find the dealer you want, and place it in the Snippets folder for that dealer.

Once you copy it over to that dealer’s snippet folder, it will appear in gray (meaning it is not saved or published yet) in that dealer’s folder.

Click on the name of the snippet to open and edit it. You will see a mostly-empty snippet that has a placeholder image in it like this:

Now, you can make the adjustments you need to set up the pop-up to look as you need. You should be able to edit the image by clicking on it and selecting the “Edit” button to change out what is there.

Once you open the Edit menu, you will be presented with a few different options to edit. You should Choose Image to change the image out to the appropriate image you’d like on the pop-up (size should be 600px x 600px if the pop-up is an image only, or 600px x ~250px if the image is going to have text or a form beneath it). After you’ve chosen your image, you must add an Image Name. This image name should be a summary of what the image is advertising without being a lengthy description. For example, if the image is advertising a deal of $200 off all 2023 models, the Image Name should state “$200 off All 2023 Models at Dealer Name” or something similar to help with SEO. Finally, while it is optional, it is strongly recommended to add an Image Link to any image pop-ups. For example, an image advertising a specific sale may point to a page that shows units that are eligible for the sale. If it is a promotion that can not be made into a listing page, you may just want to link to the main RV Search page or something similar. If you type the link into the box instead of using the “Choose Link” button, do not copy and paste the entire URL (ex. www.rvdealer.com/rv-search). Instead, use a relative URL (ex. /rv-search).

Once you’ve filled this out, and the pop-up has the image content it needs, you have completed setting up your pop-up (unless it needs additional text or a form, in which case, you will want to add those things in below the image as needed). All that’s left to do is save and publish the snippet so it is live.

Adding a Form to a Pop-up

If the dealer wants a form added to the pop-up, then it’s pretty easy to place one of our standard forms in the pop-up. You’ll want to be logged in to the main InteractRV account while editing the pop-up on the individual site, to ensure you have access to our standard forms.

To add a form, simply go into the Code Editor to create a placeholder for where we want to add the form snippet.

Click “Ok” on the Code Editor to return to the original view of the page, and then highlight the placeholder you created.

Now click the “Insert Macro” button (the gear on the top right), and select “FormSnippet”.

Once you select FormSnippet, it will provide you with some options to choose from in regards to which form you want to place. There are two things we need to change to ensure this form works as intended.

First, we need to select the specific form that we intend to use by clicking on the “Select…” button under FormSnippet.

This will prompt you to select from the folders available which form you want to use. The StandardForms folder under the InteractRV account contains a lot of basic forms that we use in many circumstances. Depending on which fields the dealer wants on the form, you may need to poke around in the folder beforehand to see which one might be the most appropriate.

Once you’ve selected the form you want to use, we’re going to make a small override to ensure the dealer can tell these leads apart from other leads. The “Setting Name” area should appear beneath the form you’ve selected once you’ve selected it, so we’re going to add a “FormType” override to differentiate this source of form from others.

In the example above, I used “Popup Form” as the type (this is what the dealer will see as the “type” of form that comes in, just like it might be labeled “Contact Us” or “Service Request” normally) – but you should put something relevant to the particular promotion or event that the pop-up is for, to ensure that it’s easy for the dealer to identify.

Ex. A popup prompting users to subscribe to their mailing list could be called “Mailing List Popup”. A popup prompting users to RSVP to a show they will be at could be called “RV Show RSVP Popup”.

Once you’ve filled out the name properly, make sure you click the “Add” button next to the setting. This will activate the setting and move it out of the text boxes you were using prior.

You may also add email overrides here if this form should only go to specific emails. You can do this with the setting name AccountOverRideEmail, followed by any emails the form should go to separated by commas.

Now that you’ve set that up, your form is properly added to the pop-up. Make sure you “Submit” your changes on the FormSnippet and Save & Publish the pop-up snippet itself. You will want to test this form after placing it to ensure it works as intended.

Now that your pop-up is all set up with the content required, we will need to decide where to place the pop-up.

Adding a Pop-up Site-wide

If the dealer would like the pop-up to appear site-wide, then we only need to place the pop-up in one place – the footer! We will need to open the footer snippet in the Snippets folder to get started.

Once we’ve opened the snippet, we will want to use the <> button to open the code of the Footer. At the very bottom, we’ll put a “placeholder” for where the pop-up is going to be added.

Now, hit “Ok” and exit the code editor. You should see your placeholder at the bottom of the footer:

Highlight the placeholder you’ve created, and then select the “Insert Macro” button to actually place the pop-up.

Upon clicking the “Insert Macro” button, you will be prompted to select a type of macro – choose “Snippet” from the dropdown. This will bring you to a spot where you will be prompted to choose which snippet to place. Click the “+ Add” button to select the pop-up you just made.

Once you’ve selected the pop-up you made, go ahead and click “Submit” to finalize the placement.

Now you will see a Snippet placed at the very bottom of the Footer. If you click “Edit Snippet”, you should see the name of the pop-up you just added inside.

Make sure to Save & Publish the footer snippet after making those changes. Afterwards, you’ll want to navigate to the homepage (or any other page on the site) to ensure that the pop-up is showing.

Congratulations! You’ve added a pop-up!

Adding a Pop-up to a Single Page

To add to a single page, you will follow a similar method to the one described above for adding to the whole site. But instead of adding this snippet to the footer, you’ll add it to the bottom of whatever single page you want this to appear on.

For landing pages, this will be at the bottom of the Content area:

For listing pages, this will be placed in the “Bottom List Blurb” area.

Adding a Pop-up to a Group of Pages

Adding a Pop-up to SRPs

Adding a popup to all SRPs is a bit more involved than adding a pop-up on all pages.

Start by creating a standard snippet in the snippet’s folder. Add the following code to the snippet:

<div class="hide">
    <div id="popup_closeout" style="padding: 30px 20px 20px; text-align: center;">
      <a rel="colorbox-close" style="position: absolute; top: 5px; right: 10px;"><i class="fa fa-times close"></i></a>
      <!-- YOUR POP-UP CONTENT HERE -->
    </div>
</div>

Import the above snippet in the site’s footer snippet.

Place the following code in the Page Footer Scripts of the domain node.

<script>
    //Enables pop-up on SRPs only
    $(function(){
        var delayInMilliseconds = 10000;
        if ($('#main').find('.ajax-unit-list').length > 0) {
            if (!$.cookie('srp-popup')) {
                $.cookie('srp-popup', true, {
                    expires: 1,
                    path: '/'
                    }); 

                    $(window).load(function () {
                console.log("Timer started, popup displaying in " + delayInMilliseconds / 1000 + " seconds.")
                setTimeout(function() {
                    $.colorbox({
                        href: '#popup_closeout',
                        inline:true,
                        maxWidth: '600px',
                        width: '90%',
                        rel: 'colorbox-inline'
                    });
                    }, delayInMilliseconds);
            });
            }
        }
    });
</script>

Save and Publish the domain node. This pop-up will now show on SRPs.

Note that the '.ajax-unit-list' selector above can be changed as needed to work on more specific pages. This script can also be modified to work with certain URLs only.

Adjusting Pop-up Frequency

Some dealers may ask for adjustments to how often the pop-up will appear for users. This can be changed by adjusting the “script” part of the pop-up.

When you open the snippet for the pop-up and navigate to the Developer Tab, you will see a script is in place.

The first part of this script relates to how frequently the pop-up will show up for the user. The “expires: [#]” area determines how long it takes for the cookie this pop-up generates to expire (and therefore, show it again to the user).

The default for the versions of the pop-ups you can copy in the StandardSnippets folder is 30 days. This means the popup will only show to users once every 30 days. The value here is in days, so if a dealer wants a pop-up to show more frequently than once every 30 days, we can turn the number down from there.

When you are editing the number in the script, be very careful not to delete the comma after the number, as this will cause the script to not work properly.

Making a Pop-up Show More Than Once A Day

While we strongly recommend against showing a pop-up more than once per day (as it is annoying to users, and we should push back on this and let dealers know that it will likely frustrate users), it is possible to do if a dealer insists on it.

To make a pop-up show EVERY time the user loads the page, we should set that “expires” setting to 0.

To make a pop-up show within a certain number of hours under 24, we will need to do some math. 1/24th (aka, 1 hour) = 0.04167. Therefore, if a dealer wants the pop-up to show every [x] amount of hours, we will simply multiply that decimal by the number of hours we need.

1 hour - 0.04167
3 hours - 0.125
5 hours - 0.208

So on and so forth. However, we strongly recommend against going below once a day to avoid users exiting the site out of frustration.