2 Free Pardot Landing Page Templates You Can Use for Your Next Event

In:

Create beautiful, responsive landing pages in Pardot by using one of these 2 free Pardot layout templates. These landing page templates are designed specifically for events such as webinars or trade shows, but they will work well with any landing page that contains a form.

Terms

These templates are free for both commercial and personal projects. No attribution is required, however, if you use them I would love to see how you customize them. Share your templates with me through Twitter, email, or in the comments below.

Preview the Templates

Template 1

Template 2

How to Use the Templates

1. Create a new layout template in Pardot (Marketing > Landing Pages > Layout Template > Add Layout Template). Give your layout template a descriptive name and add your desired tags.

create-pardot-landing-page-template

2. Copy the link to the template by clicking on one of the ‘copy link’ buttons below. This will copy the URL to your clipboard.

Template #1 View Demo
Template #2 View Demo

3. Navigate to the import layout drop down and select from URL. Paste the URL to the template into the text field and click import now.

Customizing Basics

All templates use the Bootstrap Framework and use Font Awesome for the social media icons. The CSS is directly in the template (no external CSS files are referenced other than the Bootstrap and FontAwesome library). You can easily modify the template to meet your branding requirements by modifying the hex codes directly in the template which are commented clearly within the template file.

Questions?

Send them to me via email, send me a tweet @jennamolby, or leave a comment

Related Posts

  • 11/12/2018
    Beautiful Pardot Forms: Styling Checkboxes and Radio Buttons

    Your Pardot forms don’t have to be boring. With a little extra CSS you can create beautiful Pardot forms with customized checkboxes and radio buttons. In this tutorial, I’ll show you how you can style checkboxes and radio buttons within Pardot forms with minimal coding

  • 24/10/2018
    How to Create a Net Promoter Score Survey in Pardot

    Learn how to build a net promoter score (NPS) survey directly in Pardot. I will show you how to create an NPS survey that asks the recipient to give you a score from 1 – 10 using an in-email rating that directs them to a Pardot landing page to collect more information.

  • 10/10/2018
    How To Use UTM Parameters to Capture Lead Source in Pardot Part 2

    In part 1, I covered how to use UTM parameters to capture lead source when you are embedding a Pardot form on a Pardot landing page. In this post, I will cover how to implement the same method using an iFramed form on a web page.

11 comment(s)
  • Annette Ibarra

    25/09/2018 at 8:41 am
    Reply

    Hi Jenna, I am using your template #1 while also using it as inspiration to begin building my own! I have one question regarding the javascript code at the very bottom at the very bottom of the code. The first function is for placing the form either before or after the highlight which I understand. And below that, the function is being called on a document. What document is this referring to? You are also adding an EventListener to the window as a whole, is this what tracks the size of the browser window? I see there is a Download link right above (labeled "open-form desktop-hide"). Does this mean this download link is only visible on mobile devices? Thanks! Great Template!!

  • Jenn

    16/08/2018 at 8:41 am
    Reply

    Hi Jenna, Love these templates, Thank you! If I use your workaround for the image banner, will this affect the landing page only or will it change it at the template level as well. Thanks!

    • Jenna Molby
      to Jenn

      16/08/2018 at 10:10 am
      Reply

      Hi Jenn, So happy you like them! It will affect the landing page. If you use that method you can choose a different banner image for each landing page. Cheers, Jenna

  • Emily Z

    30/07/2018 at 6:31 am
    Reply

    These templates are wonderful, Jenna. Thank you so much for providing them!

  • Lou

    26/07/2018 at 12:33 pm
    Reply

    These templates are fantastic - but I'm having some challenges with getting my form to show up instead of the placeholder.

    • Jenna Molby
      to Lou

      26/07/2018 at 12:40 pm
      Reply

      Hi Lou, Thank you! You might be importing the preview links instead of the template links. Make sure you use one of these two links: template 1 (https://jennamolby.com/Pardot-Templates/Event-Template-1/pardot-template.html) template 2 (https://jennamolby.com/Pardot-Templates/Event-Template-2/pardot-template.html). Cheers, Jenna

  • Lou Hong

    26/07/2018 at 11:24 am
    Reply

    Hi, this is fantastic! Is it possible to make the banner image itself an editable region so I can swap the image without having to modify the template? Thank you!

    • Jenna Molby
      to Lou Hong

      26/07/2018 at 12:51 pm
      Reply

      Hi Lou, thank you! The background image has to be edited using CSS, but there's a workaround to have a different background image per landing page. Add this HTML right after the opening BODY tag <div pardot-region="background-image-css"></div> This will create an editable section available within the top left corner of the landing page editor. You can then use that section within the editor to modify the landing page's CSS. Here's the CSS for the background image section: <style type="text/css"> </style>

    • Pardot adds CDATA around any CSS outside of the BODY tags. You need to edit this region and escape the CDATA tags - /**/

Leave A Comment

Your email address will not be published. Required fields are marked *

About Me

Welcome to my blog, where I share, tips, tricks, thoughts and solutions that I learn in my daily life as a sales and marketing professional.

LEARN MORE

Categories
Most Commented
Popular Posts