Adding a “BOOK NOW” button to each event on the event view list

Hi there,

This can be achieved with a template override of the List Event template.

You may override this template in your own theme by creating a file at [your-theme]/tribe/events/v2/list/event.php

Then insert the “book now button” code after the </header> as follows:

<div class="book-now-button">
	<a class="book-now-button__link tribe-common-c-btn" href="<?php echo esc_url( $event->permalink ); ?>">Book Now</a>
</div>

Full example can be found here: https://gist.github.com/lelandf/99068384b3a4fd9ef077318c04c1d67a

Keep an eye out for the “CUSTOMIZATION [STARTS OR ENDS] HERE” comments to get an idea of what exactly is added.

Our documentation about overriding templates is here: https://evnt.is/1aiy

Hope this is helpful. Let us know how it goes!

Best regards,
Leland

• This reply was modified 2 years, 8 months ago by Leland Fiegel. Reason: appended semicolon to esc_url function reference

Leland… all I can say is THANK YOU! Fantastic support for a great plugin!

All the best
Owen

Hi Owen,

Thank you for the kind words.

I’ll go ahead and mark this topic as resolved. Feel free to start a new topic if you have any other questions and we can take a look.

Best regards,
Leland

Hi Leland.

Further to the query above, is it possible to replace the web link for the booking on the event page with a button as well?

Hi Owen,

It’s probably possible somehow. The template override system provides for substantial flexibility.

With that said, after looking at your site, I’m not quite sure what you mean.

When you say “the event page” do you mean a page like this? https://www.takingcareofelvis.co.uk/event/wyvern-theatre-swindon-2022/

I looked at the page and see a “BOOK TICKETS >>” link already stylized as a button (yellow-ish background).

I was wondering if you’ve already figured this one out? Or are you referring to something else?

If so, would you mind clarifying? Information like the link of an example page you are referring to, with an annotated screenshot indicating precisely which link you would like stylized as a button would be immensely helpful.

Best regards,
Leland