Upgrade Opt-in Week: Round Image Opt-in Form Template Set

Author
David Gavrilut   23

Updated on December 31, 2019

This is day 1 of the Upgrade Opt-in Week!

Every day of this week we will unveil a new set of opt-in form templates that you can access right away, on your own WordPress website from within Thrive Leads.

Today’s template set includes various opt-in form types with a modern design, that feature a round image with vivid colors.

Check out the video demonstration.

More...

Lightbox Opt-in Form

Various Opt-in Form Types

With this template set, you will not be constrained to display only a certain type of opt-in form.

We've included designs for every opt-in form type available in Thrive Leads (and as you might know there are a lot of them).

Because to optimize conversions it's important to display the right type of opt-in form, in the right place and at the right time. 

The Right Type of Opt-in Form

The opt-in form types that you can apply these templates on are:

  • In Content (1-step, 2-step and 2-step with lightbox)
  • Lightbox (1-step, 2-step, Yes/No, Multiple Choice)
  • Post Footer (1-step, 2-step and 2-step with lightbox)
  • Ribbon (1-step, 2-step and 2-step with lightbox)
  • Screen Filler Lightbox (1-step, 2-step, Yes/No, Multiple Choice)
  • Scroll Mat (1-step, 2-step, Yes/No, Multiple Choice)
  • Slide In (1-step, 2-step, 2-step with lightbox and Sticky)
  • Widget (1-step, 2-step and 2-step with lightbox)

If you're not sure which one you should pick for your website, check out The Beginner’s Guide to Choosing the Perfect Opt-in Form Type. This resource will show you the pro's and con's of each opt-in form type and when you should pick one over the other.

And of course, don't forget that you can A/B test different form types against each other to find out which one converts best on your site!

In the video at the top of this post you can see how each of these opt-in form types looks with the new template set.

The Right Place

One of the advantages of Thrive Leads is that you can very precisely decide where to show each of your forms.

To do so, select the exact location where you want to display your opt-in form (you can show an opt-in form on all blog posts, pages or on specific categories, tags or even on a single post).

To do this on a Lead Group, access the Display Settings:

Display the form in the right place


You can find out more about this in this the following tutorial: How to Set the Display Settings for Your Form

Mobile vs Desktop

Out of the box, all opt-in form templates are optimized for mobile.

1-step Lightbox on Mobile

2-Step Ribbon on Mobile

This means that if you simply add a form ans show it on desktop as well as on mobile, you will not scare away your visitors or loose conversions. But Thrive Leads packs a whole bunch of options to really make your mobile forms as efficient as possible. You can for example show a separate opt-in form type (such as a ribbon) on mobile and another type (such as a screenfiller) on desktop or you can decide to hide all images on your mobile view only to make your form more compact.

Find out more about how to truly optimize your mobile opt-in forms here.  

What's So Special About These Templates? 

Most of the opt-in forms you see on the Internet are just this boring box that looks like it came straight from the year 2008.

But this… This is totally different.

These templates have a modern design that features a round image, which pops out of the template.

This means that this opt-in form will surprise your visitors, and that split-second of attention might be all you need to get them to read your opt-in offer and sign up, rather than close the form immediately.

“Okay. It’s cool, and the image looks really cool.”

But you might be thinking “I can’t use this template for my business... It doesn’t fit my website at all.”

But what if I told you that this can be taken care of in a matter of minutes? 

Let's customize this form to fit your needs!

First, Let's Load the Template

Once you have Thrive Leads installed on your website, loading the template is simple.

In Thrive Leads, you can either create a ThriveBox, a shortcode or a Lead Group and add an opt-in form type (whichever one you please), add a new form and click the “Edit Design” button: 

On a new form, this will automatically open the Thrive Leads templates library.

If you want to change the design of an existing opt-in form, open the form, go to "page setup" and choose a different template from "Template Setup". (Please note that every customization you did on the form will be lost including text changes and connection to email service!)

In the library, look for the "Round Image" set and apply it on your opt-in form.

Now you have the default template loaded up.

Now, Let's Customize it

Change the Image

First, let's take care of that image. The girl with the headphones looks nice but might look out of place on your website (unless you happen to be some cool DJ or sell online music of course).

To change it, click on the content box in which the image is placed, go to “Background Style” and select the image option to replace it:

Change the image

You don’t need to worry about uploading a round image. If you upload a regular, square image, once it is applied on the template, it will be reshaped to a round image (that's the beauty of a content box).

However, you still need to pay attention to the dimensions of image you use.

Avoid using images that are too small for the round space. What will happen in this case is that the image will get stretched to fit the full content box, and will end up looking blurry like this:

Bad image example


Yikes…

Also, avoid using images that are too large. Displaying these sorts of images can seriously slow down your page loading speed.

It would be ideal to load an image that comes as close as possible to the dimensions of the default image.

For the lightbox, for example, the original image from the content box has a size of 329x329 px.

You can always find the size of the image in the content box (for any of the templates) by clicking on the content box and looking for the width and height in the content box options in the sidebar: 

Content Box dimensions 

If you need help resizing your image, you can follow this tutorial to do it right from your WordPress dashboard.

Moving forward, after you changed the image, you will notice that it still has the orange gradient used on the default image. ​This orange gradient is a separate layer on the image background in the content box.

So this means that you don't need to add a gradient with a photo editing tool either! You can simply use the Thrive Leads editor.

You can either modify the colors of the gradient or leave it as it is, if you think it matches your ideal design.

Use the same “Background Style” option to play around with the gradient and the other image effects (such as patterns), as well. 

Some other elements you can play with to match your style are the:

  • Background color of the Opt-in offer box
  • The pattern color on the round highlight boxes
  • Text color
  • Button color
  • ...

Once you're happy with the design, all you need is the prefect offer...

Write Compelling Opt-in Form Copy

You can write your offer by clicking on the text and start typing. You can even change the color of the text, to properly match your ideal look:

Select the text and modify it 


As you can see, changing the text is not the hard part. Coming up with the ideal copy for the opt-in form might. Trust me, I know the feeling...

This free Thrive University course can be a real lifesaver in these situations, check it out: How to Create Persuasive Opt-in Forms. If you already have a Thrive account (as a member or as a Thrive University student) you can simply log in if not, you can create your free account and access all of our online marketing resources!

Some Customized Examples

Here’s how the opt-in form would look if we customized this template for a plumber business :

Change the image, delete the overlay, change the color of the title and the button


Here's a different example: 

Change the image, gradient color, pattern and pattern color and title color

Did you know that you can save your customized opt-in form as a new template in Thrive Leads? This allows you to quickly create new opt-in forms starting from your own, branded template.

Don't Forget: Connect the Form to Your Email Service

Now, the last important step you need to take is connecting your opt-in form to your mailing service.

If you’ve used our products before, chances are you’re familiar with this process. If not, you can check out this article to see how you can establish such a connection with various email services.

Check Out These Opt-in Form Templates!

Are you planning on using the new templates on your website? Or do you have any questions? Let us know by leaving a comment below!

Also, stay tuned, a lot of new template sets and new customization tips & tricks are coming your way.

  • Day 1 - Round images: Surprise your visitors with an original, out-of-the-box design.
  • Day 2 - Corporate: If you're looking for a slick, modern design this set is what you need.
  • Day 3 - Personal Brand: These 2 sets of opt-in forms are perfect for a personal brand or professional service website.
  • Day 4 - Eccentric Lines: This is the most original design you've ever seen on an opt-in form. If you want to impress your visitors with edgy forms, this is the design to pick.
  • Day 5 - Overlay Patterns: My personal favorite! This design is bold, dynamic and perfect for a fitness brand.
  • Day 6 - Typography: Fonts are stealing the show here. These two sets use original fonts to grab the attention and work perfectly for coupon opt-in bribes.
  • Day 7 - Vertical Split: Nature inspired design to use on a travel or outdoors website.

by David Gavrilut  July 9, 2018

23

Disclosure: Our content is reader-supported. This means if you click on some of our links, then we may earn a commission. We only recommend products that we believe will add value to our readers.

Enjoyed this article ?

You might also like:

Leave a Comment

    • I’m glad you like them, Juan! Every day of this week we’ll be releasing a new template set in Thrive Leads! 🙂

  • Saw them earlier. Started using them and testing them against each other over this past weekend. Keep knocking it out of the park you guys. The foul ball over the weekend was unfortunate, but already got to 2nd base today after doing the update.

    • Thank you for your comment, Rob! We’ve got many more templates coming your way, this week 🙂

  • Hi! Thanks for this new template!
    Can you also include the option to use other customized fields created on Mailchimp and others? Almost like the new contact forms, but with so customized fields as the mailing list has?

    • Hi Luigi,
      While this is for sure a cool feature, it would ask for a lot of changes to API connections and so on. Each email provider maps these fields out differently which is why we chose to include name, email and phone as default fields.
      It might be something we expand in the future but it’s not something we’re currently working on.
      In the meantime you might be able to get the desired results using the HTLM form instead of the API connection.

  • The best messages in my inbox come from Thrive Themes! I love what you guys are doing; you make it worth the Membership with all of your updates, new options, and teaching! Thank you!!!

  • You guys are really stepping up your game. The annual membership just gets more valuable every day.

  • thank you for the amazing education – I do want to get started with Thrive themes – maybe a dumb Q – but so do I start with a WordPress site? and what kind of theme to I set it up with? or does thrive themes do all this? Any chance I can use in Weebly?

    • Hello Cary,

      Yes, you must have a WordPress website to use our tools. For everything you’ve seen here in the Upgrade Opt-in Week, you can use any theme you want. The Thrive Leads plugin works theme independently.

  • {"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}
    >