Start typing to search...

How to customize your protection form

/

User Guides

How to customize your protection form

If you want to customize your content protection form’s design, you can do so with Passster. This guide will walk you through how to customize the form’s content and design.

Customize your form’s content

If you want to customize your protection form’s content throughout your whole site, you can do so with Passster. Alternatively, you can customize it/overwrite the form’s content for each page. See our page protection guide for details.

If you’d like to customize your form’s content for your whole site, take the following steps:

  1. From your WordPress dashboard, go to Passster > Settings and open the General tab at the top.
The Passster settings page in the WordPress admin with the General tab open, showing the Form Labels & Description card with headline, instruction, and placeholder fields
The General tab of Passster’s settings, where the password form texts are managed.
  1. In the Form Labels & Description section, you’ll see each element of your protection form’s content. By default, these contain some standard text, but you can customize each section of the form’s content to suit you.
The Form Labels & Description card in Passster settings, with fields for headline, instruction, placeholder, error message, and button label, plus a Save button
Every text on the protection form (headline, instruction, placeholder, error message, and button label) can be edited here.
  1. Once you’re happy with your form’s content, click the Save button at the bottom of the Form Labels & Description section.

Customize your form’s design

We’ve changed what your protection form contains/says. Next, we’ll customize the design of your protection form.

To customize your protection form’s design, take the following steps:

  1. From your WordPress dashboard, go to Passster > Settings and open the Design tab at the top.
The Passster settings page with the Design tab open, showing the Plugin Styling toggle and the Form Layout card with width and background color options
The Design tab controls the look of the protection form: layout, colors, spacing, and typography.
  1. The Form Layout section lets you customize everything from the form width, to the background color, border radius, centering, and more.
The Form Layout card in Passster's Design tab with form width, background color swatches, border radius slider, and Center Form and Show Password Toggle switches
Form Layout settings: width, background color, border radius, centering, and the password visibility toggle.
  1. The Typography section gives you control over your form’s headline design. Change the color, HTML tag, and font size here.
The Typography card in Passster's Design tab showing headline color swatches, an HTML tag selector, a font size slider set to 24, and a Hide Headline toggle
Headline styling for the protection form: color, HTML tag, and font size.
  1. Typography also covers your form’s instruction text. Change the font color and size here.
The Typography card in Passster's Design tab showing instruction color swatches and an instruction font size slider set to 16
Instruction text styling for the protection form: color and font size.
  1. Button Styling allows you to customize your form’s button design, including the background color, text color, border radius, and font size.
The Button Styling card in Passster's Design tab with background color and text color swatches, a border radius slider, and a font size slider
Button Styling controls the submit button’s colors, border radius, and font size.
  1. Once you’re happy with all your style changes, click the Save button in each section you’ve changed.

Didn’t solve it?

Was this page helpful?
0 1