We’ve got an Ask Sell with WP question queued up for you today! This question is from Jeremy:

I have a membership site and I want it to be really easy for the members to log in so they can see their content and benefits. Can you add a login to the sidebar for WooCommerce Memberships so members see this?


Certainly! You could add a sidebar login for a membership site powered by WooCommerce, Easy Digital Downloads, MemberPress, or pretty much any other membership solution for WordPress. This would let registered users or members log in via the sidebar, and you could optionally link to a “register” page for new users to register.

The free Sidebar Login plugin from Mike Jolley will give us what we need here with a bit of flexibility for registration or logged-in links. Let’s take a look at a general use of this plugin, then we’ll get a bit more specific for WooCommerce and Easy Digital Downloads sites.

Membership Sidebar Login

When you install and activate Sidebar Login, you’ll now have a login widget that can be added to your site’s sidebar or another widget area. For logged-out users, this will let you show a login form and optionally add other links. For logged-in users, you can show a welcome message and some links as a sort of “dashboard” for your customers.

By default, this widget will use some WordPress core links for membership information, and will have all features enabled:

Membership Sidebar Login default settings

However, we can adjust this to make it more useful for a membership site. Before we do, here are some helpful notes:

  1. Any links in the “Links” field under “Logged out” will be shown to logged-out users. This could be a good place to add a “Register” or “Sign up” link, such as a link to the WP admin, or perhaps a link to purchase a membership.
  2. Any links in the “Links” field under “Logged in” will be shown to logged-in users. This is where you can show things like a link to edit a profile or a member dashboard.
  3. I would recommend disabling the “register link” setting in favor of adding your own version of this link.
  4. There are some helpful merge tags that you can use in the “Links” sections listed in the plugin description. Some membership sites may be interested to use these for their logged-in links section:
    • %buddypress_profile_url% – BuddyPress Profile URL
    • %bbpress_profile_url% – bbPress Profile URL

In my case, I’m going to make a few changes to these widget settings for my members.

  1. Change the logged-out title to something less boring
  2. Add my own “Register” link under logged out links. I can use %admin_url% as the target for this link by entering Register | %admin_url%, but you could target any page on your site with this link (in case you have a frontend registration form).
  3. I’ll personalize the logged in title a bit by using the member’s first name instead of username.
  4. I’ll make the logged in links a bit more relevant for my members.

Member Sidebar Login updated settings

Now when a member is logged out, the login form will be shown, along with my custom “Register” link added.

Member Sidebar Login: logged out widget

Logged out widget

Once a member has logged in, the widget title and links will change to show the member their “dashboard” or helpful information.

Member Sidebar Login: logged in widget

Logged in widget

That’s it! You can use this process for any membership site, or you could customize your links a bit for your eCommerce platform as desired. We have some additional tips if you’d like to modify this widget further.

WooCommerce Membership Sidebar Login

For WooCommerce membership sites, the account system typically leverages the WooCommerce account. As such, the registration form is typically on the account page. We can point the logged out “Register” link to your account page URL instead of the WP admin url:

Register | /my-account/

However, what if your membership is a premium one that requires purchase? You could use this as a “sign up” link instead that adds your membership product to the cart:

Sign up | /checkout/?add-to-cart=99

You can create a custom add to cart link for any product to use this trick.

When members are logged out, they’ll see this register or signup link.

WooCommerce Memberships sidebar widget

Now what about the widget’s “logged in” settings? For WooCommerce Memberships in particular, the “Memberships dashboard” is on the account page, so we could link directly to this for logged in members. As members make purchases in your WooCommerce store, you could also consider linking to the “orders” section of the account as well (WooCommerce 2.6+). Your “logged in” links could look something like this:

My Memberships | /my-account/
My Orders | /my-account/orders/
Logout | %logout_url%

(You could also just use “My Account” instead of “My Memberships”.)

Now a logged in member will see these links in the widget.

WooCommerce Memberships Logged in widget

On a final note, I wasn’t a fan of the link list being out of alignment, so here’s a tiny bit of CSS you could add to your stylesheet to change it:

/* move every link from #3 onwards to the right in alignment */
.widget_wp_sidebarlogin ul.sidebar_login_links li:nth-child(n+3) {
    position: relative;
    left: 50px;
}

WooCommerce Memberships member sidebar

Much better 🙂 This lets your members log in easily, provides a potential selling point for non-members, and gives existing members handy links to their benefits when logged in.

Easy Digital Downloads Member Sidebar Login

Easy Digital Downloads membership sites will typically use EDD Members or Content Restriction, but you can probably set the member widget up in a similar fashion for each.

First, if you allow registration, you’ll need a registration form. The [edd_register] shortcode is handy for this, and I add it to my “Purchase history” page often (as it shows nothing to logged in users, so it’s a good complement to the purchase history shortcode):

Easy Digital Downloads registration form

Now you could link to this page with a “Register” link in the logged out links section:

Register | /purchase-history/

For logged in links, you could still link to the purchase history so members can see past purchases, and could also link to the blog or other pages where you have shortcodes for members.

My Purchases | /purchase-history/
Logout | %logout_url%

Easy Digital Downloads member login widget

This will look similar to our general set up. Logged-out users will see our login form and register link:

Easy Digital Downloads member logged out widget

While logged in users will see a link to the purchase history page:

Easy Digital Downloads member logged in widget

On a final note, if you want to upsell a membership or link to a membership purchase, you could use a custom add to cart link with EDD as well.

Sign up | /checkout/?edd_action=add_to_cart&download_id=68

Creating a Membership Sidebar Login

No matter what membership plugin you use for your WordPress site, the free Sidebar Login plugin can help you create a membership login widget, giving your members an easy way to log into access member benefits.

While the generic set up for the widget can work for most sites, you can customize the widget’s links for your own membership plugin, directing non-members to the right place to sign up, and giving members a list of useful links for their membership information.


Note: This post may contain affiliate links, which means we get a commission from the plugin, theme, or service provider if you choose to purchase. Regardless of this, we are committed to providing high quality, unbiased resources. Have more questions? See our affiliate policy. You can use the plain links below if you prefer that we not receive a referral commission:
Articles you may also like:

Posted by Beka Rice

Beka Rice manages the direction of Sell with WP content and writes or edits most of our articles to share her interests in eCommerce. Or she just writes as an excuse to spend more time jamming out to anything from The Clash to Lady Gaga. Who knows.

3 Comments

  1. Thanx Beka for another useful article!
    I also have the WooThemes “Social Login” plugin. Do you know if there is some way – for a non-coder like me – to integrate the social login buttons from that plugin into this widget? Would be much neater than having them in separate widgets.

    For example, by adding a line in the Sidebar Login widget to put the already existing “Social Login” shortcode into? I tried putting it into the “Links” area, but that didn’t work.
    Kind regards/Stefan

    Reply

    1. Something like this would probably work to start: add_action( 'sidebar_login_widget_logged_out_content_start', 'woocommerce_social_login_buttons' ); — you may need a customization if you want to conditionally change login text but that should give you buttons.

      Reply

      1. Worked like a charm! Many thanx, Beka!
        I only changed it to ‘sidebar_login_widget_logged_out_content_end’, to get it beneath the standard login instead. Gonna give the CSS a little more tweaking, but this will clearly work. Thanx again! 🙂

        Reply

Leave a reply

Your email address will not be published. Required fields are marked *