There’s currently no feature for Pardot forms that allow you to use placeholder text instead of the label text. So, in this tutorial, I will show you how to add a bit of JavaScript to your Pardot forms to use the field labels as placeholders.

Step 1: Add the JavaScript

Navigate to Marketing > Forms > Layout Templates and select the layout you want to add the placeholder text to. Paste this Javascript at the bottom of the form tab and save.


Step 2: Add the CSS

If you want to use placeholder text instead of the form field labels, you will need to add some CSS that will hide the labels on the form.

Navigate to Marketing > Forms > Layout Templates and select the layout you added the JavaScript to. Paste this CSS at the top of the form tab and save.




Questions?

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

Author

I'm a Freelance Marketing Operations Consultant With 15 years of experience in Marketing Operations, I’ve worked with a wide range of tools including Salesforce, Marketing Cloud Account Engagement (Pardot), Marketo, and many other sales and marketing platforms. I help teams optimize their tech stacks, improve processes, and get accurate, actionable reporting. Whether it’s setting up your Marketing Automation Platform, building Salesforce reports, managing lead lifecycles, tracking attribution, or integrating your tech stack, I ensure everything is aligned to drive real results.

67 Comments

  1. Matt Larson Reply

    Quick follow up: I was able to get everything working by using the additional javascript elements included in Katy’s comment.

  2. Matt Larson Reply

    Jenna, thanks so much for this post! I got the placeholder text working on a basic form, but once I add a checkbox, the placeholder text stops working. When I remove the checkbox, the placeholder text is back. Any suggestions on how to get placeholder text and checkboxes to work on the same form?

  3. Hi Jenna, this is a great post!

    This is working for me, but I was wondering if you could make any suggestions on how to wrap the “required” asterisk with a selector so you could customize the color independently of the rest of the label to make it stand out.

    I’ve made a couple unsuccessful attempts and feel like I’m hitting the wall, but I think that would be a great little detail to add to this tutorial!

    Thanks for all your awesome Pardot posts!

    • Jenna Molby

      Hi Holland, So happy it’s working for you! I don’t think it’s possible to make part of the placeholder a different color since you can’t add HTML to it.

Write A Comment