Create a Custom Template for your Sitewide Sale using Memberlite

In a previous article, we demonstrated the five default templates included in the Sitewide Sales Add On for Paid Memberships Pro. This post shows you how to insert a custom template name you can then target via your child theme’s style.css or a plugin for Memberlite Customizations.

The recipe leverages the pmpro_sws_landing_page_templates filter hook in the Sitewide Sales Add On for Paid Memberships Pro.


The Code Recipe


Adding the recipe to your website

Copy and paste this code recipe into a helper Memberlite Customizations plugin.


Styling your Custom Template.

Once you have inserted the new template name, you’ll need to edit or create a new Sitewide Sale and set the “Landing Page Template” and “Banner Template” (if desired) to your new value.

The selection will allow you to target the sale via the following CSS selectors (replace templatename with your template’s key name):

/* Added to the  tag */
body.pmpro-sitewide-sale-landing-page-templatename { }

/* Wraps the entire output of the [pmpro_sws] shortcode */
#pmpro_sitewide_sale_landing_page_template-templatename { } 

/* Wraps the entire display of the banner (if selected) */
.pmpro_sws_banner_template-templatename { }

We’ll be adding default templates over time, so if you have a favorite landing page design share a link to the page in the comments below.

Templates for Landing Pages and Sitewide Sales on Membership

Sample landing page using the Scroll templateIf you’re using the Sitewide Sales Add On for Paid Memberships Pro, check out these specialty templates that Memberlite theme users can leverage for their promotions. Below are screenshots of the included templates and some sample content to get your template started.


About the Sitewide Sales Add On

The Sitewide Sales Add On makes it easier for membership sites to create, manage, and view advanced reports for a sitewide or flash sale. Some common sale types include sales based on a holiday or event, such as Black Friday or Cyber Monday, as well as a sale surrounding a big announcement or feature release. You can simplify the effort of launching your sale by using the Sitewide Sales Add On.

Some features of a Sitewide Sale include specifying a start and end date, associating discount code, creating a custom landing page and notification banners, as well as a detailed report on sale performance.

View the Add On

Using Memberlite? We’ve made it even easier.

Sites that are using the Memberlite Theme can leverage five built-in Landing Page templates. Below is a sample of each template, link to view the template on our Memberlite Demo Site, as well as the sample text you can use to get your sale up and running.

Note that for these demos, you must be using the Memberlite theme and the following list of required plugins:

If you’re using a different theme, it is quite possible these templates will work for your site as well. I’ve tested the templates with many of the “Popular” themes found on the WordPress.org Theme Directory and everything is pretty close to the Memberlite demos. To enable templates for your site, navigate to Memberships > Advanced Settings and check the box labeled “Use the templates included in the Sitewide Sales Add On”.

The templates are designed to work best on a fluid-width, header, menu, and footer-free layout (sometimes called a “Blank” template in your theme). If your theme doesn’t have a template like this or the ability to toggle elements via the Edit Page admin, check out this “Blank Slate” plugin by Aaron Reimann. The plugin inserts a “Blank Slate” template option you can use to get the desired appearance.


Gradient Template

This template offers an animated background gradient section and a fun striped main form area.

Gradient Template Demo

Sample landing page using the Gradient template

Here’s the sample content for the template.

To use this template, create a new Sitewide Sale under Memberships > Sitewide Sales. Set the “Template” to “Gradient”. Then, copy and paste the demo text in the recipe into the “Sale Content” field on the “Edit Sitewide Sale” page. When you edit the page assigned as the sale’s “Landing Page,” simply set the page to use the “Blank” page template and add the [pmpro_sws] shortcode to the post editor.


Neon Template

This template offers the often-requested “dark” color scheme and the use of flashing titles and color remind me of a retro neon shop sign.

Neon Template Demo

Sample landing page using the Neon template

Here’s the sample content for the template.

To use this template, create a new Sitewide Sale under Memberships > Sitewide Sales. Set the “Template” to “Neon”. Then, copy and paste the demo text in the recipe into the “Sale Content” field on the “Edit Sitewide Sale” page. When you edit the page assigned as the sale’s “Landing Page,” simply set the page to use the “Blank” page template and add the [pmpro_sws] shortcode to the post editor.


Ocean Template

This is the template Paid Memberships Pro used for their recent Summer Sale and has a fresh, nautical color scheme and “waves” background image.

Ocean Template Demo

Sample landing page using the Ocean template

Here’s the sample content for the template.

To use this template, create a new Sitewide Sale under Memberships > Sitewide Sales. Set the “Template” to “Ocean”. Then, copy and paste the demo text in the recipe into the “Sale Content” field on the “Edit Sitewide Sale” page. When you edit the page assigned as the sale’s “Landing Page,” simply set the page to use the “Blank” page template and add the [pmpro_sws] shortcode to the post editor.


Photo Template

They say a picture is worth a thousand words—so find an image that perfectly reflects your membership, subscription, or relates to your sale and give this special template a whirl.

Photo Template Demo

Sample landing page using the Photo template

Here’s the sample content for the template.

To use this template, create a new Sitewide Sale under Memberships > Sitewide Sales. Set the “Template” to “Photo”. Then, copy and paste the demo text in the recipe into the “Sale Content” field on the “Edit Sitewide Sale” page. When you edit the page assigned as the sale’s “Landing Page,” simply set the page to use the “Blank” page template and add the [pmpro_sws] shortcode to the post editor. The photo is set by the page’s “Featured Image”, so be sure to assign the image before leaving the “Edit Page” admin screen for your Landing Page.


Scroll Template

This landing page takes the “Photo” template a bit farther and loads the text overlay in a light background box with some subtle animation.

Scroll Template Demo

Sample landing page using the Scroll template

Here’s the sample content for the template.

To use this template, create a new Sitewide Sale under Memberships > Sitewide Sales. Set the “Template” to “Scroll”. Then, copy and paste the demo text in the recipe into the “Sale Content” field on the “Edit Sitewide Sale” page. When you edit the page assigned as the sale’s “Landing Page,” simply set the page to use the “Blank” page template and add the [pmpro_sws] shortcode to the post editor. The photo is set by the page’s “Featured Image”, so be sure to assign the image before leaving the “Edit Page” admin screen for your Landing Page.

Memberlite Now Available in the WordPress Theme Directory

Memberlite is a theme we designed exclusively for membership sites and it is tightly integrated for use with Paid Memberships Pro. If you don’t already have Memberlite, you can now install it directly via your WordPress Dashboard. To install, go to Appearance > Themes > Add New and search for “Memberlite”.

View the Theme Directory Listing

 

Memberlite


This has been a long journey.

Two years ago, we made the decision to work to release Memberlite in the WordPress.org Theme Directory. It hasn’t been an easy or quick path. The Theme Directory has incredibly high standards and a sizable queue of themes to be reviewed.

After a 6-month wait, one unsuccessful review, an in-depth paid review by themereview.co, another 3-month wait, and this latest review from the WordPress Theme Review team, Memberlite is now available through your WordPress dashboard.

View the Theme Directory Listing

I have a huge amount of respect for the theme review process and the volunteers who regularly review themes for WordPress.org.

Along the review process, we made several passes over the entire code base of Memberlite and learned a lot along the way. Over the past two years, I watched as the standards got higher, the tools got better, and the process got faster. The themes available for free from WordPress.org are some of the best, most well-vetted themes available for WordPress. Memberlite is better for having gone through this process. All of our code is better for having gone through this process.


Regarding Updates

We just released the latest version of Memberlite (v4.2) to both our own upgrade server and the WordPress.org Theme Directory. You should see a notice to update to version 4.2 in your dashboard under Dashboard > Updates.

All users should be able to safely update to the latest version of the theme. If you have an older version of Memberlite, please check that you have installed and activated the Memberlite Shortcodes and Memberlite Elements plugins. These plugins replace some functionality that had to be moved out of the theme itself as part of the review process. Backing up before updating is always a good idea.

This version 4.2 update may come from our servers or via the WordPress.org update server. In both cases, your Memberlite theme will be using the same code. After this upgrade, all future theme updates will be delivered directly through the WordPress.org servers.

Memberlite Theme in Customizer


A special note for our support-level members:

If you are a premium member of this site or for Paid Memberships Pro, thank you for your support.

There is no required change with your account. You will continue to receive updates for Memberlite and the related plugins. You will still receive support from us through the support area on this site. We are currently working on releasing new child themes for Memberlite, which will be made available only to support-level members via this site. If you have any questions at all, feel free to reach out to us here.


Please Review our Theme

If you’re pleased with how Memberlite has been working on your site, we would appreciate you taking the time to add a review in the theme repository.

A higher rating will help others find Memberlite, and the more users the theme has, the more support we will have in maintaining the theme.

Thanks!

Enhance the Theme My Login Widget for Members

Modified appearance of the Theme My Login WidgetIf you’re using Theme My Login for adding an enhanced member login process on your site, check out the tutorial below to modify the plugin’s included widget feature. This recipe includes code to enhance the widget’s title and customize the displayed list of user links to match your site’s Members menu.

Adding this helpful widget with quick links to important areas of the membership is the perfect way to improve the members experience on your site.


How it Works

This recipe includes three separate functions that each handle a unique piece of the customization process. The first function modify_tml_widget_title modifies the widget’s title. The recipe replaces the default title “Welcome” to include the user’s display name a link to their Membership Account page (if you are using Paid Memberships Pro) or the user profile.

The second function, hide_tml_widget_user_links, is used to remove all of the default links that Theme My Login adds to the widget. You can read more about this filter at the Theme My Login documentation site. Note that if you’d like to keep the default links, just remove that section of the recipe.

show_member_menu_tml_widget_user_panel is the third and final function in the recipe, which is used to insert the “Members” navigation menu into the widget. You can use similar logic to insert another named menu if you would like to add alternative links. We can help you with inserting a custom menu as part of a Memberlite Support membership—just open a topic on our forums.


The Code Recipe


Adding the recipe to your website

Copy and paste this code recipe into a helper Memberlite Customizations plugin.


Screenshots

Before
Default appearance of the Theme My Login Widget
After
Modified appearance of the Theme My Login Widget

Create a Plugin for Customizations to Your Memberlite Site

Many of our articles and code recipes include instructions on how to “customize and add this code to a plugin for customizations”. In addition, our support team may provide you with customizations to add to your site via this method.

This tutorial explains how to create and edit a custom plugin for all of your tweaks to the theme.


But can’t I just edit my theme?

We strongly recommend using the customization plugin method for a variety of reasons. To be clear, the file functions.php within Memberlite or your child theme (if applicable) performs like a plugin in that it can execute php code. While adding code to your active theme’s functions.php file is often quicker than building a plugin, the downside is that as we update Memberlite, you’ll lose the custom functionality that was added. Code in a plugin will persist.

In addition, the use of a customizations plugin helps your developers and our support team know exactly WHERE the custom code is located as it relates to your Memberlite setup.


First, figure out how to FTP into your Website

Your web host should have provided you with FTP or SFTP credentials. To properly log in to your web server you will need the:

  • FTP (or SFTP) address
  • Username
  • Password
  • (possibly) a port number and root directory

If you don’t know how to use FTP, this guide on the WordPress Codex provides some background on FTP and options for FTP clients, you can also refer to your web host’s FAQs and guides.


Creating Your Customizations Plugin

  1. Create a folder called memberlite-customizations in the wp-content/plugins folder of your site.
  2. Create a file called memberlite-customizations.php in the folder you just created.
  3. Edit the memberlite-customizations.php file and paste this block of code into the file:

  4. Save the file.
  5. Upload the plugin via FTP to your website.
  6. Activate the plugin via the Plugins page of your WordPress Admin.

Editing Your Customizations Plugin

  1. Connect to your web server via FTP.
  2. Navigate to the /wp-content/plugins/memberlite-customizations/ folder.
  3. Download the latest copy of the memberlite-customizations.php file.
  4. Open the file in your preferred editor.
  5. Add the code for the recipe or code shared via your support forum thread at the bottom of memberlite-customizations.php.
  6. Save the File and upload the folder and file to your website via FTP.

This Makes Me Nervous.

We understand that you may not be completely comfortable working “in the code”. Our support team can put minor code tweaks in place for you if you share FTP information in a private thread.

If you are updating the customizations on your own and an update to the customizations plugin completely breaks your site, don’t fret.

These steps should repair your site:

  1. Connect to your website via FTP and navigate to the wp-content/plugins folder.
  2. Rename the folder memberlite-customizations to anything else (I generally rename it to memberlite-customizations-off.
  3. Now, visit your site. WordPress will automatically deactivate the plugin and, in doing do, your site should be restored.
  4. You can then repair any broken code in the file and rename the folder to the original memberlite-customizations.
  5. Upload the updated file and reactivate the plugin via the ‘Plugins’ dashboard page.

Memberlite Update v4.0

We’re excited to announce a new phase in the Memberlite theme lifecycle plus the release of the Memberlite Elements plugin.

Memberlite v4.0

This update prepares Memberlite further for submission to the WordPress.org theme repository. One requirement for this is that some functionality needed to be moved into plugins. Functionality around banners, sidebars, and widgets have been moved into the Memberlite Elements plugin. After upgrading to Memberlite 4.0, you will need to install the new Memberlite Elements plugin. Use the steps below to upgrade Memberlite and install the new required plugin.

As soon as the theme is accepted into the WordPress.org theme repository, we will push out a minor update to tell the theme to update through WordPress.org going forward.

To find out more about Memberlite 4.0, you can now browse the demo site of the entire Memberlite Theme or read the theme documentation.


Adhering to WordPress theme standards and best practices.

In preparation for the theme’s submission to the WordPress.org Themes Repository we’ve updated the code to fully adhere to WordPress’ standards and guidelines as outlined in the Theme Check plugin. We also purchased a theme review from Justin Tadlock at ThemeReview.co, which prompted additional updates to harden up our code base and make it more reliable and secure for all users.

In Memberlite v3.0 all shortocdes were extracted to a separate plugin: Memberlite Shortcodes. For Memberlite v4.0, some other functionality around banners, sidebars, and widgets have now been moved to a new plugin Memberlite Elements.


Style Updates

Memberlite v4.0 has a few relatively minor, but impactful, style updates.

  • The default font size has been increased for improved readability. This should look fine on most sites, but you may need to tweak some content and styles on your site to get things to fit with the new sizing.
  • We are now including some web safe fonts (Arial, Helvetica, Times, etc.) in addition to the Google Fonts previously available.
  • Font Awesome has been updated to version 5.2, offering new icons and icon styles (regular, solid and brand).
  • Buttons have been given a hover effect to grab the attention of your users.
  • A new [memberlite_accordion] shortcode has been added to Memberlite Shortcodes.
  • Additional theme Hooks and Filters have been added to support individual site customization as well as child theme development.

Already using the Memberlite Theme?

Below are the step-by-step directions for upgrading to the new version and installing the companion Memberlite Shortcodes plugin. Before beginning this process we recommend taking a backup of your WordPress site.

  1. Back up your site files and database [instructions]
  2. Install and activate the Memberlite Elements plugin.
  3. Upgrade your theme via the WordPress Updates admin page, or download the theme and upload it to your /wp-content/themes/ folder.
  4. If you haven’t already, consider installing the Memberlite Shortcodes plugin.
  5. If you are using a caching plugin, delete and rebuild your cache.

Memberlite Support members can get support for this upgrade process via the Members Forum. Just open a topic and we will schedule a time to perform your upgrade.

Memberlite Shortcodes Update v1.1

v1.1 of the Memberlite Shortcodes plugin has just launched. The update adds some new features to included shortcodes, as well as improvements to page speed for loaded plugin assets (CSS, JS).


How to Update

Please update Memberlite Shortcodes from the Dashboard > Updates page of your WordPress admin. You can also get the latest version of Memberlite Shortcodes here.


The full list of updates is below.

  • BUG: Fixed warning and deprecated function for get_the_author_meta().
  • BUG: Now checking that PMPro is active before requiring [memberlite_signup] shortcode.
  • ENHANCEMENT: More attributes for recent posts shortcode to display posts by author or select post type (CPT). [docs]
  • ENHANCEMENT: Added a 'icon_position' attribute to the [memberlite_btn] shortcode. [docs]
  • ENHANCEMENT: Added a 'class' attribute to the [memberlite_btn] shortcode. [docs]
  • ENHANCEMENT: Now only loading CSS/JS resources when needed.

Memberlite Update v3.0.4

Version 3.0.4 of Memberlite theme is out with few security/bug fixes. This update also maintains the theme’s compatibility with v1.9.4 of Paid Memberships Pro – where certain plugin pages were improved for frontend display across devices using a div-based HTML layout in place of tables.


About the Update

Memberlite is still free to download and update, and we still plan to move the plugin into the WordPress.org repository. This update is an interim release to add compatibility with the newest release of Paid Memberships Pro. We will be shortly releasing another larger update to meet additional rules of the theme repository.

In an effort to improve the display and responsive layout of default plugin pages, v1.9.4 of Paid Memberships Pro has migrated to a “table-free” layout for selected frontend pages. Affected pages include those pages using the following shortcodes: [pmpro_checkout], [pmpro_confirmation], and [pmpro_billing]. The CSS in Memberlite v3.0.4 has been updated to support this div-based HTML layout.


How to Update

Please update Memberlite from the Dashboard > Updates page of your WordPress admin. You can also get the latest version of Memberlite here.


The full list of updates is below.

  • SECURITY/BUG FIX/ENHANCEMENT: Added sanitization and escaping to the banner metabox on the edit post page, fixed the cropping settings for the uploaded images, and refactored the code to make it more readable. (Thanks, Massimo Marazzi)
  • ENHANCEMENT: Improved checkout template to work with the div-based layout now used in PMPro 1.9.4+. Read more about this update here.

Memberlite Update v3.0.3

Version 3.0.3 of Memberlite theme is out with a handful of bug fixes and enhancements. We also fixed a bug with our update server that was causing issues with automatic updates. So if you were having trouble updating before, it may work now.


About the Update

Memberlite is still free to download and update, and we still plan to move the plugin into the WordPress.org repository. Many of the bug fixes in this update were part of the theme repository review process, however there is still work to be done before we can do that. The theme repository has strict rules on what kinds of functionality can be included in themes and what kinds of functionality are “plugin territory”.

The custom sidebars and post banner functions of Memberlite need to be moved into their own plugins. The bad news is that this will take some time and force Memberlite users at some point to install and activate those plugins, although we’ll do our best to make installing those plugins as easy as possible. The good news is that users of other themes will be able to take advantage of that functionality.


If you are running an edited version of Memberlite or Memberlite with a child theme, please update the theme from the updates page of your WordPress dashboard. You can also get the latest version of Memberlite here.


The full list of updates is below.

  • SECURITY: Escaping login/logout URLs, account/profile URLs, landing page level URL, home_url.
  • BUG FIX: Fixed float for Full Width and Narrow Width page templates when default pages layout set to left sidebar.
  • BUG/ENHANCEMENT: Wrapping welcome text in header and a few other strings for translation.
  • BUG/ENHANCEMENT: Added comment support to pages.
  • BUG/ENHANCEMENT: Fixed abbr and heading tag use on PMPro checkout page.
  • BUG/ENHANCEMENT: Fixed text link color issue for cancel button.
  • BUG/ENHANCEMENT: Setting the content width on after_setup_theme hook now.
  • BUG/ENHANCEMENT: No longer enqueuing jQuery directly. It is set as a dependency for our JS files.
  • NOTE: Added Copyright section to the readme.
  • NOTE: The get_the_content_before_more and get_the_content_after_more functions are now prefixed, memberlite_get_the_content_before_more() and memberlite_get_the_content_after_more().
  • NOTE/ENHACEMENT: Now only showing the post meta generated by memberlite_get_entry_meta() on the post CPT.
  • NOTE/ENHANCEMENT: Now only showing the footer widgets primary background stripe if there are active widgets in the area.
  • ENHANCEMENT: Added CSS for JetPack contact form submission/results blockquote.
  • ENHANCEMENT: Improved breadcrumbs for custom post type archives and custom taxonomies
  • ENHANCEMENT: Improved page title for custom post type archives and custom taxonomies
  • ENHANCEMENT: Updated bbPress single forum topic title output.

Add a Call to Action or Additional Content Using Page Bottom Banners

Memberlite adds a new “Memberlite Options” metabox to the “Edit Page” screen in your WordPress admin. Here you can add additional content that spans the fluid width of your page.

This post provides a few example ideas for your page’s bottom banner.


Show Recent Posts

Show recently posted articles either overall or for a category that relates to the page. This recipe uses the [memberlite_recent_posts] shortcode


Add a CTA for Visitors to Call or Email You

If you are a consulting team or individual, this sample concept displays a button for visitors to call or email you. It’s a good way to stop page abandonment and give your reader a “next step” after reading your awesome content.


Add a Dynamic List of Related Pages for Continued Reading

Once a visitor has read your page of content, what are they going to read next? This recipe adds a list of subpages using the [memberlite_subpagelist] shortcode


All banners span the entire page width, so if you would like to show content in columns, use the [row] and [col] shortcodes [docs]. The banner automatically uses your site’s “secondary” background color as defined in Appearance > Colors > Secondary [docs].

View Page Bottom Banner Documentation
 


Need to set the same “Page Bottom Banner” to multiple pages/posts?

If you would like to set a Page Bottom Banner for several pages, or conditionally based on whether the user is logged in or a member of a specific level, use the before_footer hook. Here is an example that uses this hook to set a sitewide membership signup banner.