Responsive Image Landing Page With Email Form On Top Of Image

The Ultimate Landing Page Advanced plugin does some amazing things out of the box. But sometimes you want to accomplish something that requires a little bit of coding.

In this tutorial, I will show you how to place an image in the center of your landing page and position an email form on top of the image. The image will be responsive so it will look correct when resized and placed on mobile devices.

First, we need to turn off the default email form. Select Custom from the Email Management drop down.

customEmailManagement

Next, place your custom email form code in the Custom Email Form for Shortcode box.

shortcodeEmailForm

Next, put the html in the Content Area 1 editor. Edit the img tags src to contain your images url.

contentArea1EmailFormOnImag

Finally, place the custom css in the Custom Code box.

customCodeCss

And here is what it will look like.

emailFormOnImageFinal

Go Ahead...ShareShare on Google+Buffer this pageShare on FacebookTweet about this on TwitterPin on PinterestShare on StumbleUponShare on LinkedInShare on TumblrEmail this to someone
Posted in Landing Pages, Tutorial
How To Get 4,692 Subscribers
The step-by-step guide to more conversions
  • The one thing you must do to get subscribers
  • How to find the traffic that converts more than any other traffic
  • What to include in your auto responsder to keep 'em subscribed
  • The exact method I use to skyrocket my email list to more than 4692 subscribers

Download Now