Incredible But True: These Opt-in Forms Are Made Without Photo Editing Tools [Day 5/7]

It's day 5 of our Opt-in Templates week and today's design is a bold one!

I have to admit I was impressed with what our designers managed to accomplish, especially given that every element on this template is made in Thrive Leads and is completely customizable.

Let's have a look!

More...

Screen filler design from the Overlay pattern set.

Bold Colors & Patterns

The first thing that stands out on this opt-in form design are the colors. The black and red give a very dynamic feel to the form and the triangles further reinforce this.

Now, like I said before, all of these elements were created within Thrive Leads and can thus be edited.

This means you can change the patterns and colors if you'd like to obtain a different atmosphere without having to open any photo editing tools.

Triangle Shapes (2.14 min)

The triangle shapes are obtained by adding decorations to a content box.

In this case we used the "pointer" decoration on the left side of the content box. And set the width and the height to 100%.

Make a triangle shape adding a pointer decoration to one side of a content box

Patterns (3.31 min)

In day 2 of Upgrade opt-in week, we've already talked about the power of layering background styles which allows you to add a gradient over an image or a pattern over a solid color.

But as you can see in this design, a standalone pattern layer can really up your design game.

Add a pattern Layer

Once you've added a pattern layer, you can pick the color and adjust the opacity to fit your needs.

Black and White Images (5.14 min)

This design will work best with a black and white image. But don't worry if you only have a colored image. 

Upload it in Thrive Leads and use the image effects to dial up the grayscale to 100%.

Use the grayscale option in the image effects panel

What do you think?

Do you like this design and the advanced editing tricks?

Let us know in the comments below!

  • 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.

Author: David Gavrilut

David is a video content creator and writer at Thrive Themes. When not at his working desk, he enjoys driving like an enthusiast, visiting the beautiful cities of Transylvania for the 100th time. Either that or he could end up watching an entire season of Friends in one day.

  • Kathryn G says:

    I’m loving the roll out of these new opt in form designs. I look forward to choosing a set so the forms have a consistent look and feel across my site.

    Do you have a resource with recommendations as to which and how many different opt in forms should be combined on a single page/post? Is there a best practice suggestion as to whether a site should combine a ribbon with a welcome mat with a footer with a side bar widget with a slide in? How do you decide which to use, when, and where? Any help with an implementation strategy would be appreciated.

    • Hanne says:

      Hi Kathryn,

      To pick an opt-in form type we have this resource A Beginner’s Guide to Choosing the Perfect Opt-in Form Type.
      And I’ve been thinking about putting together a guideline for how to combine or what I think is the best setup.

      In general I suggest going with one “non-intrusive form” such as a post footer or a sidebar widget and one “intrusive form” such as a screen filler or lightbox.

      This allows to have the “in your face” effect that will capture most leads and give a softer option for those who closed the first form and decide later to opt-in.

      In order to decide what’s most efficient on your site Eg. post footer vs widget or screen filler vs lightbox you can use the A/B testing feature for form types.

      Hope this puts you on the right path :)

  • Juan Z says:

    Hello team :

    What are the advantages of using multistep optin forms . Is there any post about this?

    Thanks

  • Kevin B says:

    Brilliant! Nice demo, David. It’s great being able to achieve so much without having to dip into a graphics program. :)

    • David Gavrilut says:

      Indeed, it is! Thank you for your comment, Kevin!

  • Alisa G says:

    Loving the templates but am so very confused trying to set everything up.

    • Hanne says:

      Hi Alisa,
      Sorry to hear, I answered your question below with some extra resources I hope will help you out.

  • Sharon Landis says:

    The colors are fantastic. I love the effect.

    • David Gavrilut says:

      Glad to hear that, Sharon! Enjoy :)

  • Claudio Ciganotto says:

    Excellent Opt-in Form Template You can select different effects on the images.

    • David Gavrilut says:

      Yes, Claudio :) You don’t need to edit the images separately, you can just apply an effect for them in Thrive Architect.

  • Megan says:

    Hi David, thanks for the great tutorial. I would love to see more about how the content boxes are positioned that way.

    • David Gavrilut says:

      Hello, Megan!

      Sure thing. As I say in the video, the shape of the boxes is given by the “Decorations” option on the sidebar. In this case, they either have the “Pointer” or “Slanted Edge” effect added to their margins.

      The positioning is given by the “Layout and Position” option. There, if you expand the “Advanced” options, you can click on “Edit Position” and move the box around however you see fit :)

      And, last but not least, in order to stack the boxes on top of each other like in this template, you have to work with the “Z-index”, also from the Advanced options. The box with the highest Z-index value will be at the top, and the one with the lowest value will be under the other boxes.

      I hope this was useful :)

  • Alisa G says:

    Great! Thanks Hanna.

  • myriam s says:

    Très beau, je n’arrive plus à avoir accès aux formulaires malheureusement

    • Hanne says:

      Hi Myriam,

      Make sure to:
      – have the latest updated version of Thrive Leads installed
      – Clear cache (CRTL+F5)

      If you can’t see the templates, please open a ticket on the support forum so that our tech team can help you out!

  • EL Mehdi Zefzoufi says:

    I’m completely a beginner in the field, but I’m wondering how does opt-in form work? I understand it serves to collect emails from subscribers but is Thrive the one collecting and saving them for us to use when we want to reach them? or there are other plugins we will need to use for that purpose?

    • David Gavrilut says:

      Hello, El Mehdi!

      So, Thrive provides you with two plugins with which you can build your opt-in forms (Thrive Leads and Thrive Architect – the Lead Generation element, more specifically)

      However, these opt-in forms need to be connected to a mailing service. These are not plugins, but websites, on which you can create an account, and create different lists. In this way, when you are connecting your opt-in form to the mailing service, you can select to which list you want the users that sign up on that form to be sent.

      In this way, you will have a few targeted lists, and you can send specific emails to every list.

      Check out all the mailing services that you can connect our opt-in forms to, here: https://thrivethemes.com/integrations/.

  • Elizabeth says:

    How would you connect the templates to your homepage if you have set up one on your page? I set up my page using Chi, and I have no idea how to connect the pages with the option forms. I have the setup, confirmation and download pages set up and I have no idea how to make them work the correct way.

    • David Gavrilut says:

      Hello, Elizabeth! Could you please open up a support ticket for this issue? Just so that we can have an in-depth look at what’s going on. We’ll help you connect the pages right away :)

      • Elizabeth says:

        I tried loading a new logo to all of my pages without success. The logo is only showing up on the homepage. The about me and the blog has the old logo on each page.

      • David Gavrilut says:

        My suggestion is to open a suport ticket, because then you can privately send us the pages where the issue occurs, along with screenshots and everything, and we can have a look and see what is going on :)

  • Steven Kemp says:

    loving the fitness stuff, keep it coming

    • David Gavrilut says:

      Glad to hear that, Steven! Will do :)

  • >