Some sectors do most of their selling off-line and only use the web to attract, engage and inform their customers before selling them the real product or service.
In these cases online payments are of little use and contact or lead-generation forms take over.
A lot of research has gone into developing the highest converting lead-generation pages for various sectors, and styles and approaches do and will forever vary between sectors – it all depends on the type of customer – their expectations, their a-priori knowledge and various other factors like your brand, their level of trust in you and their current position in the sales funnel (e.g. are they browsing, or are they comparing and closer to buying)
So – make sure you spend a lot of effort getting your main lead-generation pages designed perfectly as well designed pages can double or treble your conversion rates, leading to double or treble revenues.
That still leaves the rest of your website however – your lead generation forms will typically only be on a few pages of your site where you may have a lot of information to attract, engage and convert browsers into leads.
Generating leads from every page
Space is a premium, so you can’t just have a fully fledged form on every page. That’s where the code I’ve written below will help.
It displays a single button with a clear call to action. When clicked, it is replaced in-place with a very short contact request form. The less information requested of a user, the more inclined they will be to move their hands from their mouse to their keyboard and start typing. This button even goes the extra step of automatically making the first text box the focus on the page, so the user doesn’t have to click inside the text box to start typing.
I’ve used Contact Form 7 – one of the best free contact form plugins – to help me build this, and if you combine it with the Contact Form DB plugin then you will start building an online database of leads which you can connect to your marketing or sales team and their workflow process. One of the great things about Contact Form DB is that you can connect it directly to a live Google spreadsheet or a live Excel spreadsheet making it easy to integrate directly into any outbound marketing workflow system.
Contact Form 7 code for hidden lead generation form
This includes some custom styling.
<div class="requesttour"> <input id="requesttourbutton" type="button" class="button" value="Request a tour"> <div class="hiddenrequestform" id="requesttourhiddenform" style="display:none"> <h3>Request a tour</h3> <div class="rflabel"> Your name </div> <div class="rffield"> [text* your-name placeholder "Your name"] </div> <div class="rflabel"> Your email address </div> <div class="rffield"> [email* your-email placeholder "Your email"] </div> <div class="rflabel"> Your phone number </div> <div class="rffield"> [text* your-phone placeholder "Your phone number"] </div> <div class="rfsubmit woocommerce">[submit class:button "Submit"]</div> </div> </div> <style> .requesttour { color:black; } .hiddenrequestform { background-color:#eee; padding:0px 10px; border:1px solid #ddd; border-radius:5px; } .hiddenrequestform .rflabel { margin-top:10px; display:none; } .hiddenrequestform .rfsubmit, .requesttour { margin-top:10px; text-align:center; } .hiddenrequestform .rffield input { max-width:100%; padding: 2px 3px 1px 3px; margin-bottom:5px; } .hiddenrequestform h3 { font-family:'Josefin Sans'; margin-top:10px; font-size:14px; text-transform:uppercase; } .sidebar div.wpcf7-validation-errors { display:none!important; } .sidebar span.wpcf7-not-valid-tip { font-size:12px; } aside.sidebar img.ajax-loader { position: absolute; width: 20px; border-bottom: 1px solid #000; top:auto; left:auto; border:none!important; } .sidebar div.wpcf7-mail-sent-ok { margin: 0px; border: none; background-color: black; color: white; font-size: 12px; } </style> <script language="javascript" type="text/javascript"> jQuery('#requesttourbutton').click(function() { jQuery('#requesttourhiddenform').css('display', 'block'); jQuery('#requesttourbutton').css('display', 'none'); }); </script>
- My WordPress performance plugins and server stack have moved - July 31, 2016
- Price Comparison Pro 1.2 Released - July 5, 2016
- How to run backups on huge WordPress websites without your website being brought offline - February 4, 2016