Setting up a custom WP-Members stylesheet

 

WP-Members is designed to work out-of-the-box, yet be extensible and customizable. The layout of the forms and dialog messages are a good example, with the ability to easily define a custom stylesheet in the plugin options.

I don’t recommend making edits to the core files, and the included CSS is no different. But you can use the included CSS as an easy base to begin from. Here are some steps to follow so that you can easily set up a custom CSS file for your installation and be able to edit it in the WP Theme Editor:

  1. Copy the included default stylesheet found in the plugin’s folder /css/wp-members.css.
  2. Save it to your theme folder.
  3. In the plugin options specify this location for Custom CSS:

    http://mydomain.com/wp-content/themes/mytheme/wp-members.css

    (Don’t copy/paste – you’ll need to specify the correct path for your domain/theme)

  4. Open the theme editor (Appearance > Editor) and look for wp-members.css in the list.
  5. Make any edits/changes you need. Click “Update File” when you are done.

Now you can edit the CSS for WP-Members, save your changes, and not have to worry about overwriting your customizations when you upgrade the plugin. (Be sure to maintain a backup copy of your changes though, just in case something would go wrong with your site somewhere else.)

You don’t have to limit this to working from the default stylesheet, which is based on TwentyTen.  There are two additional stylesheets included with the download, one based on TwentyEleven, the other based on Kubrick.  Or, you may find it easier to start from a completely blank stylesheet.

If you are a more advanced user and understand WP action hooks, you might want to simply load a custom stylesheet direction with wp_enqueue_style.

Private

You do not have permission to view this forum.