Four words, three words, one word? How many words should the perfect call to action button include?

The primary focus of a successful “call to action” is not about how many words you use.

It is more about using words that resonate with your lead magnet or sales offer and switching your target audience into taking action and converting them into a new lead or sale.

One issue people had before OptimizePress came to market was the ability to design attractive buttons. Designers were already aware of this, and even when the first version of OptimizePress was released it shook up the marketing world by creating powerful, bright, eye-catching buttons.

These classic marketing buttons were seen everywhere and became an essential part of every sales page.

OptimizePress-CTA-Buttons-Classic-buttons

Now with the latest version of OptimizePress, it’s a breeze creating stunning high converting buttons in only a few clicks.

You can easily clone buttons, edit text, font styles, letter spacing, but you must be aware there are many other factors that influence the conversion rate of your call to action button.

The ability to clone buttons makes it easy to test layouts and place buttons in multiple areas of you pages.

Creating the perfect call-to-action button | GoodUI Call-to-action template

Successful buttons have a combination of the following elements.

  • Font Style
  • Space Balance
  • Size & Colour Tone
  • Informative
  • Language
  • Urgency

What is a Call To Acton

The term “call to action” is a little vague when used in articles, so to be as clear as possible a call to action is “something that makes the site visitor take action or do something”. It is also referred to simply as CTA.

The CTA could be:

  • Download a product
  • Add item to cart
  • Request information
  • Trial offers
  • Learn more
  • Complete a survey

Our landing page guide covers how to build a good call to action area on your landing pages but read on to learn how you can use these other elements to encourage more clicks on your buttons.

Font Style

The font on your buttons is a major factor in making your buttons blend with the overall design. Always keep your button font a similar style to all the other fonts on your page. Don’t go to wild and use crazy handwritten fonts if they not used elsewhere.

Remember OptimizePress includes some beautiful default fonts…

OptimizePress-CTA-Buttons-Default-fonts

…and some of the Google fonts:

OptimizePress-CTA-Buttons-Google-fonts

Just because they are there it doesn’t mean you should always use them all on one page.

Balance The Surrounding Space

You want your call to action buttons to stand out on the page. We recommend using white space on your landing pages, so the important elements have room to breath and take center stage.

The size of the buttons must balance well with the space around it.

Look how ActiveCampign let these ‘Learn More‘ buttons have space around them. They stand out under the content and clearly allow the user to make a choice.

Creating the perfect call-to-action button | ActiveCampaign Call-to-action buttons

However…. that said if you were building a shopping cart styled page you might not want to add lots of space around the ‘Add to cart’ button. This product page from Zappos shows no space around the buttons and they still stand out.

Creating the perfect call-to-action button | Zappos Call-to-action

Colour & Size

The colour and size of your button will have an impact on the conversion rate. A stupidly big button will be overwhelming and distract from the offer. A button that is too small will get lost in the content of the page. The wrong colour will clash on the page and possibly change the mode of the visitor.

You button colour tone must blend well with the page design and font. Along with the size, it must all balance well with the text, colour and offer around it.

Evernote do this very well.

They actually don’t use much spacing but the call to action button is beautifully designed and positioned perfectly within the offer making it stand out in the surrounding content.

Creating the perfect call-to-action button | Evernote Call-to-action buttons

Download our colour emotion guide if you need help deciding what colours trigger different emotions for your visitors.

Be Informative

The call to action button should clearly explain what will happen next or what the user will receive after clicking the button. This could be in the main button text or even another line of text above or below the primary call to action.

Shopify makes it very clear what will happen when you click this button.

Creating the perfect call-to-action button | Shopify Call-to-action

The OptimizePress button generator has a subtext feature built into it. This can work wonders if you are trying to entice your site visitors to follow through and take action.

Creating the perfect call-to-action button | OptimizePress Button Designer

The extra information you provide must add to the overall user experience. It may describe more about what will happen, what they receive or even pricing details but remember the main call to action text must be more prominent.

Informative text or subtext is most commonly used on the trial buttons when explaining how many days a trial is, like this Basecamp example:

Creating the perfect call-to-action button | Basecamp Call-to-action buttons

Informative text could also be used to mix up the copy and make a clearer call to action like this example from ContentVerve.

Control page button text: Get your membership
Treatment page button text: Find you gym & get membership

It’s amazing how much simple changes can increase conversions.

Image source.

Creating the perfect call-to-action button | Split-Test Example

Language

The language you use in your message will also play a vital role in the conversion process.

If you choose to use action orientated words to encourage clicks, try testing multiple words across a couple of different pages. You may also choose to get personal with your call to action text and clearly describe the exact offer using words and phrases your audience know.

We are always reinforcing the benefits of split testing OptimizePress landing pages, and this example shows how the words Get and Order can make a difference of 14% increase in conversions.

All from simply changing the one words used on the call to action button.

Image source.

Creating the perfect call-to-action button | ContentVerve Split-Test Example

Add Some Urgency

When testing your landing pages, you may want to try adding some urgency into your button text.

If your landing page doesn’t create a sense of urgency using countdown timers you can try the subtext option and include a text line with a time limit phrase or end date.

Creating the perfect call-to-action button | OptimizePress Button Example

This urgency text could fall under our extra information section as your are adding to the user experience. As urgency is a powerful factor for increasing conversions on any landing page we feel is deserved it’s own place on any CTA button.

Call To Action Buttons For You

So now you have some tips for creating higher converting call to action buttons we have given you a head start by building a template that includes a bunch of call to action buttons for you to use on your pages.

The template has over 100 buttons ready to use with icon fonts.

Creating the perfect call-to-action button | Call-to-action button templates

How To Install The Template

Note this template will only work in OptimizePress.

Step 1 – Download the template

Simply enter you email below and we’ll send you the template. Do NOT unzip the file.

Leave it zipped up ready for importing into your OptimizePress site.

[optin_box style=”24″ alignment=”center” email_field=”inf_field_Email” email_default=”Enter your email address” email_order=”1″ integration_type=”infusionsoft” double_optin=”Y” list=”150″ name_field=”inf_field_FirstName” name_default=”Enter your first name” name_order=”0″ name_required=”Y” action_page=”https://zf137.infusionsoft.com/app/form/process/ba6bb636aded69425684e72b686c8bff”][optin_box_hidden][/optin_box_hidden][optin_box_field name=”headline”]Subscribe Below to Download the Call to Action Buttons Template[/optin_box_field][optin_box_field name=”paragraph”]PHA+TG9yZW0gaXBzdW0gZG9sb3Igc2l0IGFtZXQsIGNvbnNlY3RldHVyIGFkaXBpc2NpbmcgZWxpdC4gRG9uZWMgdmVsIG51bmMgbm9uIGxhY3VzIHZlbmVuYXRpcyBjb21tb2RvLjwvcD4K[/optin_box_field][optin_box_field name=”privacy”]We value your privacy and would never spam you[/optin_box_field][optin_box_field name=”top_color”]undefined[/optin_box_field][optin_box_button type=”0″ button_below=”Y”]Get Instant Access![/optin_box_button] [/optin_box]

Step 2

Navigate to the Create New Page area.

OptimizePress-Call-To-Action-Buttons-activecampaign-cta-step1

Step 3

Browse and choose the CTA_Buttons.zip template from the location you saved it on your computer.

You will see confirmation when the zip file is ready to be installed.

Next, click the install button.

OptimizePress-Call-To-Action-Buttons-activecampaign-cta-step2

Once the template is installed you will see a green confirmation bar like this.

OptimizePress-Call-To-Action-Buttons-activecampaign-cta-step3

Step 4

Scroll down to Other Pages and you will see the CTA Buttons template ready to use.

OptimizePress-Call-To-Action-Buttons-activecampaign-cta-step4

How To Use The Buttons

Step 1

To use our button template all you need to do is drag any button into the empty rows provided.

Click the Copy Row button. When you click this copy button another icon (paste) appears on the right hand side between the move and delete row buttons.

You watch how to use the Copy & Paste Row in this video.

OptimizePress-Call-To-Action-Buttons-activecampaign-cta-drag-button-row

Step 2

Now on the same site, open the LiveEditor for the page you want the button on and click the Paste Row button then delete the 1. & 2. text elements and you now have the button ready to use.

OptimizePress-Call-To-Action-Buttons-activecampaign-cta-paste-row

That’s it! You now have over 100 buttons to use!

[feature_box_creator style=”1″ width=”” top_margin=”” bottom_margin=”” top_padding=”” right_padding=”” bottom_padding=”” left_padding=”” alignment=”center” bg_color=”#F3F3F3″ bg_color_end=”” border_color=”#CBD2D6″ border_weight=”1″ border_radius=”” border_style=”dotted” ]

Tell Us What You Think – Please Comment Below!

As always we love to hear your comments or questions. What text converts the highest on you own call to action buttons?

[/feature_box_creator]


    42 replies to "[Download] Creating The Perfect Call To Action Button With Examples"

    • Milad Infinity

      David! Thanks for this. Very good analysis/input about landing pages.

    • Jason Harrison

      Love the buttons! How does one link them with a shopping cart or paypal? Is there a tutorial on this that I missed?

    • Matts Rehnström

      Thanks for the article. I can however not see any “Create New Page”. I have “Dashboard” as the first option, and no create below either.

      • David Frosdick

        Hi Matt, are you using the latest version of OP?

        • Matts Rehnström

          Yes I did update just before looking at the article. I did again just now, and now I see the menu item of “Create New Page”. Thanks.

          I however do not see the template under “Other Pages”, after installing the it. I only see the templates; Help & Faq Page, Modernt Style Download 1, and Modern Style Download 2.
          I did get an okay that the installation was successful.

    • kevinjgallagher

      way to make this really difficult, could you not of added them to the button element?

      • David Frosdick

        Hi Kevin, the buttons are using the button element adding inside rows. Are you seeing something different?

    • Judith Gotwald

      I installed this according to directions and get the message in the green bar that it installed successfully, but it is not showing up in the OTHER PAGES section.

      • David Frosdick

        Hi Judith, have you managed to get it working? If not can you reach out to our support team so we can login and check your site?

    • Roderick Low

      Hi, I downloaded the zip file. But the image folder is empty. How come?

      • David Frosdick

        Because there are no images in the template… 🙂

        There’s no need to unzip the file, just upload it into your site as the instructions say 🙂

    • KM Lee

      @shellybullard:disqus: as David mentioned, the long line of code is actually the Link URL. copy and paste that code into the Link URL field when you edit the button element.

      feel free to reach out to me if you’re still confused.

    • David Frosdick

      Hi Shelly, after step 8 you copy that URL into your button link URL field.

    • Ebonie Allard

      Where do I download the template from? I’m sure I am being stupid but I can’t find it anywhere!

      • David Frosdick

        Follow Step 1 under How To Install the Template. Enter your email and we’ll send it to you.

    • Shelly Bullard

      Hi there, can you please add instructions on how to link these buttons to PayPal? I currently use Membership Order Buttons and that takes me through a process of linking to PayPal. It looks as though I’d use a link for these new buttons, but I have no idea which link to use or where to find this link? I hope this is clear… thanks!

      • Shelly Bullard

        I’m talking about the “Link URL” —> Where do I find this in PayPal? Thank you!

        • KM Lee

          @shellybullard:disqus are you referring to the OptimizeMember plugin? you can manually ‘convert’ the code into a URL.

          just go to the OptimizePress knowledgebase and search for “URL order link”. you’ll find the answer there.

          • Shelly Bullard

            Hey KM! Thank you – I’ll try it!!!

    • Mike Denison

      Is this template also available in the OP Clubhouse Template Library? I’d like to just download from there if possible.

    • Dmitrii Bushkov

      Great job, David. I had never used row copypast between pages. Excellent )

    • Ian Bass

      Great post David… These pre-created and optimized buttons are a great time saver…

      • David Frosdick

        Thanks Ian! Anything to help people save time is a bonus.

    • Isabella

      I have downloaded the buttons without any glitch. However, it is not clear if i can use the buttons in a page that I have already created. Do I necessarily have to use the buttons template and play around with it or I can make the buttons pop up in other OP2 pages?

      • David Frosdick

        Hi Isabella, install the template then copy the buttons you want to use into your other existing pages.

        Freely edit the the colours and settings as you want.

        • Isabella

          Cool, thank you!

    • DavidREnglert

      Paula, it looks like the config.php file has the code for the images but I want some clarity on the installation. Are we using .ftp for the install and if so, what are the proper installation steps?

      • David Frosdick

        Install as you would any other template. I’ll add some screen shots to the post for more help.

    • Paula Talmelli Cavenaghi Dias

      the zip file is empty. no button images

      • David Frosdick

        We tested our end. Don’t unzip the zip file. Go to ‘Creat new page’ and install as a new template.

        I’ll update the blog post with more instructions.

    • DavidREnglert

      I just downloaded the template however I don’t see any instructions on how to install the .zip file into Optimizepress… can you help with this?

      • makeda

        It took me a few minutes to figure this out too but if you hit Create New page, right above the Optin/Landing Page templates is the option to upload the zip file. It says “upload a content template in a .zip file”. Hit that, upload the zip file and you should be good to go. HTH.

    • Steve Barnes (TheOffGridCabin)

      Fantastic information Dave! Much appreciate the level of detail that went into this. Makes teaching my OP fans so much easier 🙂 Cheers!

      • David Frosdick

        No problem. I have some other buttons I’ll work on for another time.

    • Cris 'ingay'

      Excellent article as always, Dave. Thank you.

    • Vic Dorfman

      Thanks for the resources, David! I appreciate you posting the A/B testing results from ContentVerve next to the buttons, very interesting stuff.

      • David Frosdick

        Cheers Vic! ContentVerve have some great examples. I often use those as examples why people must test test test

Leave a Reply

Your email address will not be published.