Overlay Content

Your overlay is what the visitor to your site will see. The content is created for Google and the overlay is created for the visitor. Your overlay is what will send your visitor to your destination page.

This is where you need to grab your visitors attention within a couple seconds so they will stay and read your image, iframed page or watch the video. This is called the hook and you only have a few seconds to do it in.

We need to talk relevancy again here. The message on your overlay needs to be very closely related to your titles and your content or your visitors will be bouncing away from your site very quickly. They need to know they are going to see what they are searching for within a few seconds of landing on your page.

There are three default options for your overlay. Those with web programming skills can extend this any way they wish. However, we will be unable to offer support on custom programmed pages.

1) Clickable Image – This overlay will display an image that is clickable. This is much the same as the similar option in Phantom. You will need to create the image to be used. When creating an image for this type of overlay, you will likely need to experiment on sizing so that it is readable on all devices that it could be viewed with – mobile, tablet, laptop and desktop. Create you project using what you think might look good and then upload it after OTP-Evolved has created all the files. View the page in different sizes to see what it looks like. Make adjustments as you see fit and create a new image with exactly the same name as the first one you created. Now upload it to the same folder and overwrite the first image. Now the second image will display on your page. Review it again to make it look good.

2) Video with Clickable Image – The overlay will allow you to display any online video from Youtube, Vimeo or others to give the user a more detailed video description. You need to also provide an image that will be displayed below the video and when clicked sends the user to the page you are promoting. This image is usually just a button. You will need to provide the video url and image to be used.

3) iframe – This option allows you to actually display a web page anywhere on the internet that allows the use of iframe technology. You simply provide the URL to that page and it will display on the overlay. When doing this, the page being iframed is also able to be accessed and used by the visitor. This is a very powerful option. This page could be an optin page for collecting email addresses before forwarding the person on to your offer page. You could actually have a complete funnel on your overlay.

If you are going to be promoting an affiliate offer, do note that most affiliate platforms do not allow their pages to be displayed in an iframe. In this case, it will be necessary to create your own page to lightly discuss the coming offer and a button for them to click to see it. If you are not sure if the platform allows iframes or not, you can use a free resource, such as https://www.tinywebgallery.com/blog/advanced-iframe/free-iframe-checker to see if your url allows one or not.

*** Caution: When you iframe a webpage, that page is similar to being part of your page and will slow the loading of the page. It would be best to create such pages to be very fast. We have had great success with pages created with html and well optimized images.

OTP Overlay Setup

To use one of these overlays, you need to go into your projects upload folder then open the assets folder. In the assets folder is where you will find the files to change your overlay.

The iframed web page overlay file is called – overlaycontent1.php
The overlay you will see on your site by default is from this file. It is an iframed page you are looking at. The default file is set to display https://locustware.com. You need to manually edit this file to the destination URL you would like to send your visitors.

The image overlay file is called – overlaycontent2.php
There is a default image that is being used for promoting the Organic Traffic Platform. You would need to manually edit this file and change the image url and the destination url for your project.

The video overlay file is called – overlaycontent3.php
You will need to manually edit this file to use the video url, image url and destination url for your project.

Once you edited the above overlay file, we need to set up the appropriate method to be used. By default, the iframe technique is used. No further work needs to be done. To change the overlay type from the default overlay (iframe) you will need to go into the overlaycode.php file and change out the file name from overlaycontent1.php to either overlaycontent2.php (image) or overlaycontent3.php (video and image).

Now test your site and your overlay should now be displaying correctly. Don’t forget to test clicking on the overlay or iframed site to make sure they are working correctly.