Add line break after Venue?

[wealthfollowsworth]

Hello. In the List view, is there a way to add a line break after the venue name?

It currently goes like this: Venue, Address, City, +Google Map (in one big long run on sentence)

I want it to go like this:
Venue
Address
City
+Google Map

Can you give me some code for my styles.css file that will fix it?

Thanks!

[wealthfollowsworth]

Here is a screenshot of what I’m trying to do.

[Victor]

Hi Nathan!

Absolutely, that’s totally possible! But, I would suggest overriding the single-event.php template to make that happen. You can learn more about overriding calendar templates in our Themer’s Guide, but it basically boils down to this:

• Make a copy of the single-event.php template. It is located at wp-content/plugins/the-events-calendar/src/views/list/single-event.php
• Make a new folder in your theme called tribe-events
• Make a new folder in that one called list
• Drop your copied single-event.php file in that last folder

Now that the template is in your theme, you can modify it to suit your needs. In this case, modify line 53 to look like the following:

$address_delimiter = empty( $venue_address ) ? ' ' : ', <br>';

Will this work for you? Please let me know. 🙂

Best,
Victor

[wealthfollowsworth]

Thank you for those simplified instructions on theming. I had tried the Themer’s Guide before, but it got too complicated. Yours was easy to implement.

We are close. I was able to update that code in the single-event.php file. However, it is not displaying correctly. See the screenshot.

Is something missing or wrong in that code snippet. We are so close! 🙂

Again, I want it to be:

Venue
Address
City, State, Zip
+ Google Map

Thanks!

[Victor]

Hi Nathan!

It seems there might be something wrong when you copy and pasted the code I sent.

Please try using the following code to fully replace the single-event.php file, which I also modified to show the “+ Google Map” link in another line.

<?php
/**
* List View Single Event
* This file contains one event in the list view
*
* Override this template in your own theme by creating a file at [your-theme]/tribe-events/list/single-event.php
*
* @version 4.6.3
*
*/
if ( ! defined( 'ABSPATH' ) ) {
die( '-1' );
}

// Setup an array of venue details for use later in the template
$venue_details = tribe_get_venue_details();

// The address string via tribe_get_venue_details will often be populated even when there's
// no address, so let's get the address string on its own for a couple of checks below.
$venue_address = tribe_get_address();

// Venue
$has_venue_address = ( ! empty( $venue_details['address'] ) ) ? ' location' : '';

// Organizer
$organizer = tribe_get_organizer();

?>

<!-- Event Title -->
<?php do_action( 'tribe_events_before_the_event_title' ) ?>
<h2 class="tribe-events-list-event-title">
<a class="tribe-event-url" href="<?php echo esc_url( tribe_get_event_link() ); ?>" title="<?php the_title_attribute() ?>" rel="bookmark">
<?php the_title() ?>
</a>
</h2>
<?php do_action( 'tribe_events_after_the_event_title' ) ?>

<!-- Event Meta -->
<?php do_action( 'tribe_events_before_the_meta' ) ?>
<div class="tribe-events-event-meta">
<div class="author <?php echo esc_attr( $has_venue_address ); ?>">

<!-- Schedule & Recurrence Details -->
<div class="tribe-event-schedule-details">
<?php echo tribe_events_event_schedule_details() ?>
</div>

<?php if ( $venue_details ) : ?>
<!-- Venue Display Info -->
<div class="tribe-events-venue-details">
<?php
$address_delimiter = empty( $venue_address ) ? ' ' : ', <br>';

// These details are already escaped in various ways earlier in the process.
echo implode( $address_delimiter, $venue_details );

if ( tribe_show_google_map_link() ) {
echo '<br>' . tribe_get_map_link_html();
}
?>
</div> <!-- .tribe-events-venue-details -->
<?php endif; ?>

</div>
</div><!-- .tribe-events-event-meta -->

<!-- Event Cost -->
<?php if ( tribe_get_cost() ) : ?>
<div class="tribe-events-event-cost">
<span class="ticket-cost"><?php echo tribe_get_cost( null, true ); ?></span>
<?php
/**
* Runs after cost is displayed in list style views
*
* @since 4.5
*/
do_action( 'tribe_events_inside_cost' )
?>
</div>
<?php endif; ?>

<?php do_action( 'tribe_events_after_the_meta' ) ?>

<!-- Event Image -->
<?php echo tribe_event_featured_image( null, 'medium' ); ?>

<!-- Event Content -->
<?php do_action( 'tribe_events_before_the_content' ); ?>
<div class="tribe-events-list-event-description tribe-events-content description entry-summary">
<?php echo tribe_events_get_the_excerpt( null, wp_kses_allowed_html( 'post' ) ); ?>
<a href="<?php echo esc_url( tribe_get_event_link() ); ?>" class="tribe-events-read-more" rel="bookmark"><?php esc_html_e( 'Find out more', 'the-events-calendar' ) ?> &raquo;</a>
</div><!-- .tribe-events-list-event-description -->
<?php
do_action( 'tribe_events_after_the_content' );

I hope that helps. Let me know about it.

Best,
Victor

[wealthfollowsworth]

PERFECT!!!

Thank you so much for the extra CSS help. I know that is extra, and you normally don’t help with that.

Thanks!!

[Victor]

Happy to be of help Nathan 🙂

I’ll close this thread now but don’t hesitate to open a new topic if anything comes up and we’ll be happy to help.

Cheers,

Victor

[Author]

Posts