Product Displays

NOTE: This add-on is available to members on our Super Affiliate plan. If you would like to upgrade to have access to this add-on, you can do so by signing up for the plan here.

Overview

The Product Displays add-on allows you to create beautifully styled and responsive displays. This add-on is primarily intended for affiliate marketers who're using Pretty Links for their affiliate links. With this add-on, you can now bring the products you're promoting to life through displays.

Install the Product Displays Add-on

The first thing you'll want to do is install the Product Displays add-on. The add-on can be installed by visiting the Add-ons page (Wp-Admin -> Pretty Links -> Add-ons). If you don't see this page, then you may need to update Pretty Links to the latest version.

Next, locate the Product Displays add-on and click to install it. If you don't see the add-on listed, try refreshing the add-ons by clicking the “Refresh Add-ons” button near the top of the page.

Adding a New Display

Once the add-on has been installed, you're ready to create your first display. To add a new display, you'll want to either create or edit a pretty link on the Pretty Links page (Wp-Admin -> Pretty Links) and click the “Product Display” tab.

When viewing this tab, you'll see a few different options:

  • Theme – This option is used to change the theme currently used for the display. It'll default to the “Basic” theme.
  • Product Image – This option is used to change the image associated with the product. It'll default to a pre-selected image until it's updated.
  • Description – This option is used to provide a short description of the product you're promoting.
  • Price – This option is used to provide a price for the product you're promoting.
  • Badge Text – This option is used to make the display stand out when inserted into your site's content.
  • Primary Button Text – This option is used to change the text of the primary purchase button used on your display. It'll default to “Buy Now”.
  • Review URL – This option is used to provide a URL for a review about the product you're promoting.
  • Review Button Text – Similar to the Primary Button Text option, this option is used to provide the text of the Review Button. It'll default to “Our Review” for newly created links.

You'll notice that there's no option for the URL of the Primary Button. This is because the URL will be pulled in from your pretty link's Target URL set up in the “Basic” tab. Changing the Target URL will also change the URL used in the Primary button. In most cases, this URL would point to the product you're promoting so users can click the Primary button to purchase it.

With all these options filled out, you can save your pretty link by clicking the “Update” button.

Creating a Display Group

With the Product Displays add-on, you can group one or more links together using Display Groups. To create a Display Group, you'll want to navigate to the Display Groups page (Wp-Admin -> Pretty Links -> Display Groups) and click the “Add New” button.

When creating a Display Group, you'll see a couple of options under the “Group Options” tab:

  • Group Type – This is the type associated with the Display Group. This option is used to determine how the grouped links will be displayed when the Display Group is inserted onto your site. It'll default to the “List” type.
  • Links – This option will be used to add links to your Display Group. This option is a search field; you'll receive suggestions as you search for your links.

Once you've finished creating your Display Group, you can click the “Publish” button to save it.

Inserting a Display

There are a couple of ways to insert your display(s) onto your site, so we'll cover both methods below.

Shortcodes

The first way of inserting a display is using shortcodes. If you're wanting to insert a single display, you'll want to edit the link on the Pretty Links page (Wp-Admin -> Pretty Links), select the “Product Display” tab, and click the “Copy Shortcode” button.

If you're wanting to insert multiple displays grouped together through the Display Group, then you'll want to edit your Display Group on the Display Groups page (Wp-Admin -> Pretty Links -> Display Groups) and click the “Copy Shortcode” button under the “Group Options” tab.

Once you've copied the shortcode, you can edit the page or post where you'd like to use the display and paste in the shortcode.

Blocks

The second way of inserting a display is using blocks. The Product Displays add-on offers a “PL Product Display” block, so if you're using the Block Editor then you can search for this block and click the “Add Display” button. Once this button is clicked, you can select either “Single Link” or “Display Group” and search for the link or Display Group you're wanting to insert.

Configuring Options

The Product Displays add-on offers several different options that allow you to change how the displays appear. To configure these options, you'll want to navigate to the Pretty Links Options page (Wp-Admin -> Pretty Links -> Options) and click the “Product Display” tab.

Under this tab, you'll see the following options:

  • Button Background Color – This option is used to change the background color of the two buttons shown in the display. It'll default to a dark blue color.
  • Button Text Color – This option is used to change the text color of the two buttons shown in the display. It'll default to a white color.
  • Button Hover Background Color – This option is used to change the background color of the two buttons shown in the display when they're hovered over. It'll default to a light blue color.
  • Button Hover Text Color – This option is used to change the text color of the two buttons shown in the display when they're hovered over. It'll default to a white color.
  • Affiliate Disclosure – This option is used to add a disclosure to your displays. Most of the time this is a message letting the user know you'll receive some sort of compensation for each sale made through the primary/purchase button.

Displays in Action

Below are a few screenshots of how the displays will look on the front end of your site:

Single Display using the Sharp theme
List Display
Grid Display

Still Have Questions?

We'd be happy to help with any questions you may have! Just contact us through our support page, and we'll do our very best to help you out.

Was this article helpful?

Related Articles