WordPress plugin

Login Designer Pro

Login Designer Pro delivers visual controls and a live preview for customizing a WordPress login page. Select an element to see its settings, adjust its appearance, and review the result as you work. Designs can be used for a branded website, membership project, client website, or other WordPress installation.

Login Designer Pro

Edit the login screen in context

Login Designer Pro delivers visual controls and a live preview for customizing a WordPress login page. Select an element to see its settings, adjust its appearance, and review the result as you work. Designs can be used for a branded website, membership project, client website, or other WordPress installation.

Open the editor from the WordPress Dashboard at Appearance > Login Designer, or use the Login Designer section inside the Customizer. Choose a template, adjust its settings, and publish when the design is ready.

Choose a template and set its background

Start with a predefined template, then add a logo above the login form. Set the logo URL, width, height, and position. Template backgrounds can use an image or a color. Image controls include left, right, or center positioning, tile repetition, and auto-adjust, cover, or contain sizing.

For the form background, upload multiple pictures and pick fade-in, slide-right, or slide-left animation. You can also set the animation speed and duration.

Adjust the form, labels, and messages

Style the form wrapper with controls for background color, radius, shadow, shadow opacity, horizontal and vertical padding, transparency, and width. Customize labels such as Username and Password, including their font, size, spacing, and color. Input fields can also be customized.

Set messages for an empty password field or an invalid username or password. Other controls adjust the badge text color, logo color and position, and the font, size, color, and position of entries such as Lost Your Password and Back to. These below-form components can be enabled or disabled.

Use the Pro settings

  • Choose an animation for the form on initial load.
  • Apply animation to the logo and choose an animation for form submission.
  • Add Google Fonts for labels and fields.
  • Rename the login page in the URL.
  • Use Google reCAPTCHA V2 or V3 on the login form.
  • Import or export Login Designer settings.

The Pro edition includes Login Designer customization functions, with additional animation, typography choices, and login URL options. Published designs are responsive and compatible with web browsers and mobile devices.

Install and publish a design

Install Login Designer Pro in the WordPress administration area, then open the editor from the Dashboard or Customizer. Select a template, configure the page and form, adjust the available Pro options, and publish the design when it is ready.