As we enter 2019, customers are more and more likely to view your website from a mobile device than from a computer browser. That’s right: it’s time to start imagining your content in the palm of someone’s hand. This means it’s more important than ever to use responsive design so your site to renders well on any device — computer, tablet, phone, etc.
For a while, it’s been possible to create responsive landing pages in Pardot, but you needed developer-level knowledge of code. No longer!! Now you can create a responsive landing page in Pardot with just a few quick clicks – even if you’re not familiar with HTML or CSS.
I’m talking about the Layout Template feature that allows you to import a premade responsive template! This helpful secret has hiding in plain sight for months, but for some reason I can’t find any documentation about it. Let’s see how it’s done in 3 easy steps.
1. Create Layout Template
The first thing you’ll want to do is navigate to Marketing > Landing Pages > Layout Templates. Give your template a name, and remember that Layout Templates for landing pages and forms are all stored in the same place, so make your name as specific as possible for future reference. Choose a Folder and Tags if you want.
Next, scroll down to Import Layout. You can still import ‘From a URL’, which is handy if you want to use existing HTML from your website to create a frame for your landing page. However, this option requires coding knowledge, so we’ll skip past that.
Below that option, you’ll see several Responsive Templates to choose from! Choose one, then click Preview Responsive Template to get an idea of what your landing page will look like. Remember it’s responsive, so stretch and shrink the preview window to see how the page will react on different devices.
Once you’ve decided on a layout, click the blue Import Now button and click “OK” on the pop-up. You should see your responsive code populated by Pardot! Be sure to Save before leaving the page.
This code is editable of course, but you’ll be able to edit the content (without code!) in upcoming steps.
2. Create Landing Page
Now we’ll create the landing page! Once your layout template code is saved, go to Marketing > Landing Pages > New Landing Page. Fill out all the necessary fields. If you need guidance, check out Pardot’s helpful documentation.
On Step 3, Content Layout, choose My Layout Templates and find and select the layout template you just made. This will automatically move you to Step 4, where you can edit your new landing page. All you need to do is point and click! If you chose a form, you should see that populated on the landing page too.
When you’re happy with your landing page, move to Step 5 where you can confirm your Landing Page Details and, more importantly, click the button to Confirm and Save. If you miss this step, your landing page might not be saved, and your coworkers won’t be able to access the landing page for edits.
3. Go Live
There you have it! Once you save your landing page, you’ll go to the overview page where you can view all the details and access your landing page link. You can edit the landing page and layout template as much as you want, and when you’re ready, it’s time to go live. Share your landing page link far and wide. Consider offering exclusive gated content. Hopefully you can score some new leads!
Have you made a responsive landing page in Pardot? How was your experience? Let us know in the comments!
