Skip to content

Instantly share code, notes, and snippets.

@lorenzocaum
Last active August 29, 2015 14:16
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save lorenzocaum/4b98d284b4432332eab1 to your computer and use it in GitHub Desktop.
Save lorenzocaum/4b98d284b4432332eab1 to your computer and use it in GitHub Desktop.
Handling partner discounts in Event Espresso 4

This tutorial will explain how to handle partner discounts in Event Espresso 4.

Note: this tutorial will be out of date in a few weeks when the promotions add-on is released along with Event Espresso 4.8.x.

There are two parts to the tutorial. In the first, we'll locate a unique CSS class for the ticket option that we would like to hide. In the second part, we'll create a new page to show the ticket selector with all ticket / pricing options.

Step 1 - Create your ticket options

Go ahead and create your ticket options including the ticket option that you would like to hide through the event editor and save changes.

Then go to your single event page for this event.

Look at the following screenshot:

http://cl.ly/image/342m213a2J1R

The last ticket option is called Partner Ticket. Below that area in Safari developer tools, you'll see a CSS class highlighted in blue:

ee-ticket-partner-ticket

We'll attach that CSS class to display none to hide it but before we can do that, we'll need to add an additional CSS class to make it more specific.

The single event page has a page ID that is added to the body class. This will be the event ID. For example, if our event ID was 567, then our body class would be:

postid-567

Now that we have that information, we can update our sample CSS:

/* Hide a ticket called Partner Ticket for an event with an ID of 567 */
.postid-567 .ee-ticket-partner-ticket {display:none}

You can add new the styling to your child theme's stylesheet or through a plugin like Reaktiv CSS builder or My Custom CSS.

Be sure to update 567 to your actual event ID and also update partner-ticket to the equivalent for your ticket name. Here are some additional examples so you can get an understanding of how the body classes + ticket CSS classes work:

/* Hide a ticket called VIP Ticket for an event with an ID of 890 */
.postid-890 .ee-ticket-vip-ticket {display:none}
/* Hide a ticket called My Awesome Ticket for an event with an ID of 150 */
.postid-150 .ee-ticket-my-awesome-ticket {display:none}

Step 2 - Create a new WP page for your ticket selector shortcode

Now go back to the event editor with your event and look towards the event URL. You'll see a button called Shortcode near there. Click on it and you'll see a pop-up with a shortcode. Copy that shortcode.

Then go to Pages. Create a new WordPress page and add your shortcode and save changes.

That completes the steps.

Here is how the flow will work:

Public registrants/attendees will not see the ticket that was hidden on the single event page. This is because it is being hidden with some specific CSS that will only apply to that single event page.

You can then share the link to the WP page with the shortcode for partners. They will see all ticket / pricing options since none are being hidden on that page.