Site Members: Changing the Design of the Default Signup and Login Forms

5 min read
Design the window that visitors see when signing up or logging in to your Members Area. This also applies to any password protected page on your site.
The default form is already designed for you. It matches your site colors and themes so your design stays consistent. While you can't customize the design of the default form from scratch, you can still control some design elements by customizing your color theme. 
Using a custom signup / login form?
This article refers to the default forms. If you are using custom forms, you can click below to learn how to customize:
In this article, learn how to change the:

Changing the Title Font

The font for the title text on the password window is taken from the Heading 2 text theme. If you want to change the font, you can customize the text theme for your site. 
Important:
This also changes any other text with the Heading 2 theme on your site.

To change the Heading 2 font:

  1. Click Site Design  on the left side of the Wix Editor.
  2. Click Text theme.
  3. Click Customize heading styles.
  4. Hover over Heading 2 and click the Edit icon .  
  5. Customize the theme using the available options. You can change the font, color and size, and bold and italicize the text.
  6. Click Apply to save your changes.
A screenshot of the Heading 2 font in the Wix Editor and the corresponding title text on the members area sign up form.

Changing the Text Elements Font

The font for all other text elements on the password window is taken from the Paragraph 2 text theme. If you want to change the font, you can customize the text theme for your site.
Important:
This also changes any other text with the Paragraph 2 theme on your site.

To change the Paragraph 2 font:

  1. Click Site Design  on the left side of the Wix Editor.
  2. Click Text theme.
  3. Click Customize paragraph styles.
  4. Hover over Paragraph 2 and click the Edit icon .  
  5. Customize the theme using the available options. You can change the font, color and size, and bold and italicize the text.
  6. Click Apply to save your changes.
A screenshot of the Paragraph 2 font in the Wix Editor and the corresponding text on the members area sign up form.

Changing the Text Color

Pick a different color for the title and text of the password window by customizing your site's color theme. The darker tint of your Base colors is used across your site for various text elements. 
Important:
This also changes the color of any other elements on your site that use the darkest base color. 

To change your base color for text elements:

  1. Click Site Design  on the left side of the Wix Editor.
  2. Click Color theme.
  3. Click the darkest color under Base colors
  4. Use the color picker in the Custom Color box to change the color. 
  5. (Optional) Use the sliders to change the Saturation and Brightness values.
  6. Click Apply
A screenshot of the Base colors in the Wix Editor and the corresponding text colors on the members area sign up form.

Choose a different color for links and buttons by customizing your site's color theme. Accent colors are used across your site for many actionable elements like buttons, links and menu items. 
Important:
This also changes the color of any other elements on your site that use this accent color. 

To change the accent colors for buttons and links:

  1. Click Site Design  on the left side of the Wix Editor.
  2. Click Color theme.
  3. Click the first color in the Accent colors section. 
  4. Use the color picker in the Custom Color box to change your accent color.
  5. (Optional) Use the sliders to change the Saturation and Brightness values.
  6. Click Apply
A screenshot of the Accent colors in the Editor and the corresponding button colors on the members area sign up form.

Changing the Background Color

To change the background color of the password window, adjust the lighter tint of your Base colors in your site's color theme. This color is automatically used across your site, mostly for page and element backgrounds.
Important:
This also changes the color of any other elements on your site that use this background color.

To change your base color for page backgrounds:

  1. Click Site Design  on the left side of the Wix Editor.
  2. Click Color theme.
  3. Click the lightest color under Base colors
  4. Use the color picker in the Custom Color box to change the background color. 
  5. (Optional) Use the sliders to change the Saturation and Brightness values.
  6. Click Apply
A screenshot of the Base colors in the Wix Editor and the corresponding text colors on the members area sign up form.
Tip:
Click Publish to view the changes on your live site. You won't be able to see the password window by previewing your site.

Did this help?

|