Different images for each ticket type within a single event

[Raymond Gillespie]

Hello,

I currently have several different ticket types for most of my events. For example, one may include parking and one may include food, with each ticket type available for the single event in question. I can add an image to all tickets within an event, but I would like to add a different image for each type of ticket within an event. Can this be done?

[Nico]

Hi there Raymond,

Thanks for getting in touch with us! I can help you here 🙂

Can you please let me know which tickets type your site is using (RSVP, Woo, EDD, etc)? This can be done but will require a template override (more details on this on our themer’s guide) and some work from your side.

Please let me know about it and I’ll continue to help you out,
Best,
Nico

[Raymond Gillespie]

Hi Nico, thanks for the reply. We’re using WooCommerce for the tickets. Let me know if you need any more info.

Thank you.

[Nico]

Thanks for following up Raymond 🙂

I’ve looked into this and it turned out to be pretty easy to make this work! You’ll need to create a template override for the woo tickets form in our plugin. The template file is located at ‘wp-content/plugins/event-tickets-plus/src/views/wootickets/tickets.php’, the process to create the override is described in our themer’s guide. Once you have the copy of the template in your theme folder, just add the following line:


// line 121
echo '<td class="tickets_description">' . $ticket->description . '</td>';
// add the line below to the file and save
echo '<td class="tickets_image">' . $product->get_image() . '</td>';
....


With that in place, just go to ‘WP-Admin > Products’ and edit the products related to the ticket to add them a featured image.

Please let me know if this works for you,
Best,
Nico

[Raymond Gillespie]

Cheers Nico, I will let you know how I get on!

[Raymond Gillespie]

Hello,

I’ve made this change and I’ve added a featured image to the ticket type in question. This has shown up on the shopping basket screen but it doesn’t show on the ticket email that comes through once the order is marked as complete (see attached).

Can you offer any further advice?

Thank you.

[Nico]

Thanks for following up Raymond!

The template override sent in my previous reply should show the image in the tickets form. It’s shown in the cart because that’s the default behaviour of WooCommerce.

To show it in the tickets email as well, you’ll need to perform another override. This time the file to override is ‘wp-content/plugins/event-tickets/src/views/tickets/email.php’. Once the override is in place, add the following lines after line 356:

...

Image get_image(); } ?>

That will include the product image in the ticket email as well.

Please let me know if this works for you,
Best,
Nico

[Raymond Gillespie]

Hi Nico,

Is there anywhere in particular after line 356 I need to add this? Line 356 is an opening PHP tag, so the code breaks if I insert it there. I tried inserting it later in the code but the following two lines don’t appear to be valid PHP:

if( isset( $ticket[’product_id’] ) || class_exists( ‘WooCommerce’ ) ) {
if ( $product = new WC_Product( $ticket[’product_id’] ) ) echo $product->get_image();

Specifically, it’s all the code from the #91 reference onwards.

Can you help?

[Nico]

Sure let’s go a step back!

I see the first part which was displaying the image in the tickets form is not ready, so let’s look into that customization first before we jump into the email one.

The template file is located at ‘wp-content/plugins/event-tickets-plus/src/views/wootickets/tickets.php’, the process to create the override is described in our themer’s guide. Once you have the copy of the template in your theme folder, just add the following line:


// line 121
echo '<td class="tickets_description">' . $ticket->description . '</td>';
// add the line below to the file and save
echo '<td class="tickets_image">' . $product->get_image() . '</td>';
....


Could you do this? Was there a template override by the theme? Are you using a custom theme or working on a child theme + an existing theme?

Please let me know about it,
Best,
Nico

[Raymond Gillespie]

Hi Nico,

Yes, the first set of code works fine, it’s just that my text editor highlighted these two sections as invalid:

[’product_id’] ) || class_exists( ‘WooCommerce’ ) ) {
[’product_id’] ) ) echo $product->get_image();

I think it has a problem with the ampersand.

We’re using the Eventica theme, but the as a child theme.

[Raymond Gillespie]

Just a quick update to say I have this sorted – there was some raw HTML copied into your code. I converted this back to square brackets and it works fine, thank you.

Is there any simple way to convert the image from 180px x 180px to a wider image?

[Nico]

Thanks for the update Raymond. Stocked to hear you could implement the script!

Sorry for the bad encoded chars, sometimes copying/pasting to a plain text editor solves this! Good catch 😉

Is there any simple way to convert the image from 180px x 180px to a wider image?

You mean the product image in the email? It uses a default size defined by Woo, but you can pass another size as the first parameter. Take a look at this thread going over this same question → https://wordpress.org/support/topic/image-size-get_image/

Please let me know if that helps,
Best,
Nico

[Raymond Gillespie]

Thanks Nico, that should be pretty straightforward – I will let you know how I get on.

[Raymond Gillespie]

Hi Nico,

That works great, and it all looks fine thank you. However, there is one further issue I’m not sure how to resolve. All tickets now have this ‘image section’ showing on the ticket, even if there is no image assigned (they just use the standard WooCommerce placeholder). Is there any way to only show the image section if an image has been assigned to a ticket?

[Nico]

Stocked to hear you could sort the size issue out Raymond 🙂

Regarding this last questions, that sounds as possible yeah. You can prevent the placeholder from showing but you’ll need the column in place to maintain the table structure (it’s possible to remove the column but it would certainly be complicated an outside the scope of the support we can provide here). If this is implemented in the site, can you please send me a link where I can see this? Maybe just a CSS snippet can do the trick of hiding the placeholder image.

Best,
Nico

[Author]

Posts