How to Create Responsive Landing Pages in Pardot – Without Code!

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: desktop computer, tablet, or phone.

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! Click the button that says 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.

landing page template preview

 

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!

 

Interested in a Pardot or Salesforce onboarding so you can take full advantage of your CRM or marketing platform? Fill out the form below and we’ll be in touch.

Pardot Form Styling [Webinar and Guide]

This month we had the opportunity to present a Pardot Form Styling webinar for Pardot’s Advocate Hours.

In case you missed it: Pardot Form Styling Webinar and Pardot Form Styling Guide

The webinar and guide will walk you through how to use HTML, CSS, and Javascript to style a Pardot form from scratch. The best part is- you don’t have to know code to do this! Seriously!

The webinar and guide will enable a beginner-expert to copy/paste the code like you’re a pro. 🙂

 

The webinar received  4.6/5 stars from Pardot clients! Here are some comments from the live attendees:

“Definitely, information that I can use.  Thank you.”

“The presenter was awesome!”

“This was awesome.  Super helpful.  Having these CSS classes will really speed up development.”

Pardot Form Styling Guide

 


Keep up with our Pardot and Salesforce magic:

digital marketing

Digital Marketing Favs of the Week- 3/3-3/10

Here are our top 4 favorite Digital Marketing articles this week!
Did you come across any great articles this week? Tweet Your Favorite To Us!

Marketing Tech’s Bumpy Road: Consolidation, Growth, and a New Frontier

digital marketing

 

How to Use Psychology to Improve Your Marketing Messages

digital marketing

 

Landing Pages for Lead Generation: 8 Conversion-Driving Tips

digital marketing

 

In Praise of Email

digital marketing
Stay up to date on Pardot and Salesforce by subscribing to our blog!

digital marketing

Digital Marketing Favs of the Week- 2/26-3/3/2016

Digital marketing is an umbrella term for the targeted, measurable, and interactive marketing of products or services using digital technologies to reach and convert leads into customers and retain them. – Wikipedia.org

Our Marketing Team works hard staying up-to-date on the latest digital marketing trends and statistics (you know, proof that the trend is worth it!) and we thought it was about time to share some of our favs (favorites) with our readers. Check back weekly for our top 4!

Did you come across any great articles this week? Tweet Your Favorite To Us!

16 Eye-Popping Statistics You Need to Know About Visual Content Marketing

Blog 1- Visual Content Marketing

 

37 Visual Content Marketing Statistics You Should Know in 2016

Blog 2- Visual Content Marketing2

 

22 Ways to Promote Your E-Book

Blog 3- Promote E-book

 

8 Brands That Have Mastered GIFs In Emails

Blog 4- Gifs in Emails
Stay up to date on Pardot and Salesforce by subscribing to our blog!

New Cloud on Tap Website Design

Did you notice the changes around here? 🙂 We’ve been working hard the last month to build a better site and we’re finally done!  Many thanks to our newest COT-er, Sara, for spearheading this endeavor.

New features:

  • Fully responsive, mobile-friendly
  • Sleeker look and feel that’s more “Cloud on Tap”
  • Our favorite Google Fonts– Open Sans and Raleway
  • Easier points of contact- buttons, links, and forms everywhere (but not annoyingly!)
  • Company and Careers Pages (team pics coming soon)
  • Can’t miss display of our core Pardot and Salesforce certifications

Is your site mobile-friendly? How about your forms? Pardot forms can absolutely be built to respond to any browser and device and we’re excited to show that off to the world.

Subscribe to our blog!

Google Mobile Friendly Update

4 Things You Need to Know about Google’s New “Mobile-Friendly Update”

Social media is a buzz with what’s been titled, #Mobilegeddon! We thought it would be good to break it down to the 4 most important things to know about this new Google feature:

1. It only affects search rankings on mobile devices
This means anyone searching in a browser will still see your normal site ranking. If they are searching on mobile though, your rank will differ based on your mobile friendliness.

2. A high quality but not mobile-friendly page can still rank high
If you have high quality pages with great content, you can still get high mobile search rankings, per Google. Keep in mind that others with great content AND mobile-friendly will likely out rank you.

3. The rank applies to your individual pages, not your entire website
If a website re-vamp isn’t in the time and/or money budget right now, consider upping your content game for a couple of your key pages. Each page is judged on its own merits.

4. Google will put you back in its good ranking graces as soon as you update to mobile friendly
Whether you get around to updating tomorrow or a few months from now, Google crawlers are out there and ready to find and re-rank you. You can speed it along by asking nicely too.

Not sure if your site is mobile friendly? Run the Mobile-Friendly Test.
Remember, the update is live today, April 21st!

 

Subscribe to our blog!