I have been experimenting with lead magnets and using Beacon.by to create them. They work really well. And I found that adding a few tweaks to my page made them even better.

beacon.by is a simple to use lead magnet generator.

It helps you create pdfs, which it hosts on Amazon S3, and creates the sign up and opt in forms to drive traffic to your newsletter.

Here are a few tweaks I made on my pages to make the experience work better for me.

Redirecting Thank You

beacon.by allows adding a custom domain, so any links it generates look like they are on your site.

For me, this is only really something I want to do for the “Thank You” pages. The default message appears on a blank page with little customisation so I redirect the Thank You to a page on my site.

Rather than create a separate page for each lead magnet I re-use the sign up page.

I redirect to my landing page url with #thanks after it.

Showing a Thank You Message

In my page HTML I have a hidden thank you message.

<div id="thankyoumessage" style="display:none">
<h2 id="thanks-for-signing-up">Thanks for signing up</h2>
<p>Check your emails. You will receive instructions on how to access your ebook.</p>
</div>

This is hidden by default. So I have a little JavaScript on the page to enable this if the #thanks is on the URL.

<script>
if(location.hash.substr(1)=="thanks"){
    document.getElementById("thankyoumessage").
    style.display="inline";
}
</script>

This basically means, if the url has #thanks on the end then make the div with id thankyoumessage visible.

Hidden Sign Up Form

On feature that comes with default from beacon.by is hiding the signup form when a visitor has recently signed up to the lead magnet and mailing list.

Under these circumstances I would like to show the ’thank you’ message again.

I do this, by checking for the sign up form in the DOM, and if it is not there then show the thank you message.

<script>
window.setTimeout(function(){
if(!document.querySelector("div.BN-root")){
    document.getElementById("thankyoumessage").style.display="inline";
    }
    },2000);
</script>

This basically says wait until 2000 milliseconds have passed, then check if we can see the form, if not, then make the thank you message visible.

There is a risk that the communication between the page and Beacon takes longer than 2 seconds, in which case the message might be displayed. But I view that as fairly low risk.

Benefits

I found that this allows me to create a very simple landing page on my site with an embedded inline form to direct social media traffic to, for lead magnet sign ups.

With minimal configuration of beacon.by and without needing to configure any custom domains.

As I explore more with beacon.by I may well add the custom domains to make the sign up links look more white labelled, but I think people are used to downloading files from CDN type sites so this isn’t a priority for me.

Create Lead Magnets

beacon.by has a free plan if you want to create lead magnets easily and collect leads.

I’m particularly excited by the Video LookBook template which lets you embed videos easily in the lead magnet. I think that a Video LookBook with embedded videos and worksheets should work pretty well for driving traffic.