A Pardot Landing Page, Bootstrap & Browser Display Issues

As a general rule, hosting a marketing landing page that is crafted to create leads should be hosted on a company’s primary domain to maximise a google adwords spend. But there are a lot of situations that come across my desk where hosting a landing page on the company’s main domain isn’t necessary or perhaps even possible.

For our clients that are leveraging a marketing automation solution such as Pardot, we can use a well thought out sub-domain directed at their marketing platform.

It seems like a simple solution, just design a beautifully optimised landing page, code it up using your favourite framework or boilerplate (bootstrap in this case), store all of your assets and code on the marketing platform, and your good to go. “Pardot landing page is in the bag” you proclaim after checking the ‘finished’ product…

But then you open Firefox

Oh, great all of those lovely icon fonts aren’t showing. Instead we get a not-so-useful square. We better check Internet Explorer… and it is the same here too.

Time to hit up google!

Google leads to stack overflow (of course) that held enough hints to point me in the right direction.

Opening up Firefox’s developer tools and checking the console logs showed that there was a problem with the icon font loading. What seemed strange to me was that the google hosted font being used for the site body copy loaded perfectly.

Location, location, location

Today I learned, it matters where your fonts are hosted.

To be more specific, it matter where your fonts are hosted in relation to the CSS file that is calling them (at least in the case of @font-face method anyway).

It turns out that some browsers out there (I’m looking at you Firefox and IE) don’t like it when you hard link to a font file, especially when the CSS file and the font are stored on different servers.

For a moment, it felt like my framework dreams where collapsing around me. But then I had another sip of coffee and the world was beautiful again.

The mind numbingly simple solution

One line of code, replace one line of code…

Instead of hosting the four formats of the icon font, bootstrap.min.css and reworking the @font-face to point to the newly hosted fonts, all I needed to do was remove this line of code from my HTML file:

<link href="http://example.com/large-string-of-characters" rel="stylesheet">

And add this in its place:

<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"  rel="stylesheet">

Now we are loading the bootstrap CSS direct from their CDN, and in turn, loading in the icon font from the same server. Checking the updated HTML in Firefox and IE reveals crisp, resolution independent icons in all their glory.


Marketing Automation, The Brave New World.

In July 2013 I got my first taste of the complex world of marketing automation in the form of the now defunct Optify service. It was the clunky precursor to what would be ‘a brave new world’ of marketing automation that was to blast off (for me) in December 2013. With Optify getting itself into financial difficulty, being purchased and then shut down 30 days later; the Blirt team (wisely) made the shift to Pardot. Who or what is Pardot you ask? Well perhaps you have heard of the company who owns it… Salesforce.

What is Marketing Automation?

Marketing automation can mean different things to many people, but here’s how Pardot describes it:

Simply put, marketing automation works to automate your marketing communication programs. With a marketing automation platform in place, your marketing and sales teams can automate and optimise your lead generation and nurturing programs from initial prospect contact through the entire sales process.

Marketing automation makes it easy to integrate email marketing, reporting technology, and your lead generation and nurturing efforts to create a true sales ecosystem. Use it to create timely, structured communication programs with all of your prospects.


A good platform needs good strategy (and execution).

I’ve seen it several times now, a business is sold into a marketing automation platform on the promise of future full of increased qualified leads, opportunities and streamlined sales pipeline. For some businesses, walking the path to that promised future has been a just a few quick steps and they’re off.

But for others, getting moving along that path can a challenge. Difficulties can arise from a lack of technical or creative resources to produce the marketing materials needed, or no clear custom journey to build from. Sometimes it is just a simple case of team members resisting the change from a standard Commercial Email system to a full featured marketing automation solution.

Whatever the reason for a businesses struggle to get traction with their shiny new marketing automation software, I can assure you it is worth working out or pushing through all the pain points because the results can be amazing.

We’ve helped Blirt clients maximise their marketing suite with creative assets such as ad material, email templates, landing pages, and drip programs. Technical setup and customer journey work which leads into profiling, scoring and grading prospects. Targeted media buying that brings in leads on a cost per lead pricing model – offering a level of security to clients compared to other media buying models.

As a Pardot Certified Consultant I’ll often times run a full client implementation including technical setup, creative assets and training sessions.

And sometimes I have a stretch like this:

Not that I am complaining. Having an abundance of work is a quality place to find yourself in.