Stop certain elements appearing on all views

[Guildford Institute]

I have been given the task of sorting out styling and functionality issues with a big upgrade from v2 to v4.
I am trying to add a 100% browser full width banner on the main calendar page which works great if I add it to the default-page template in my theme folder but the previous developers were using a version of TEC pro that had two template files for the main page (ecp-page-template.php) and the single events-page (ecp-single-template.php). They had custom banners for the single events and a main banner for the main calendar page (Whats On). I guess this must be something to do with conditional wrappers but I am fairly amateur when it comes to code so could do with some help please. If I add any of the banner code below to the single-event.php page it doesn’t stretch to the full browser width. It just sits within the wrapper. Again if I add the banner code to the photo.php or month.php the banners sit within the fixed width of the wrappers.

CODE THAT WAS ORIGINALLY IN ecp-page-template.php
<?php
/**
* Default Events Template
* This file is the basic wrapper template for all the views if ‘Default Events Template’
* is selected in Events -> Settings -> Template -> Events Template.
*
* Override this template in your own theme by creating a file at [your-theme]/tribe-events/default-template.php
*
* @package TribeEventsCalendar
*
*/

if ( ! defined( ‘ABSPATH’ ) ) {
die( ‘-1’ );
}

get_header();
?>

<section role=”main”>

<div class=”heading-panel-full bg-memberblue”>
<div class=”inner”>
<div class=”heading-panel-text”>

What’s on at the Guildford Institute

Delve into our calendar to find something to spark your imagination

</div>
</div>
</div><?php //.heading-panel-full ?>

<div id=”tribe-events-pg-template”>
<?php tribe_events_before_html(); ?>
<?php tribe_get_view(); ?>
<?php tribe_events_after_html(); ?>
</div> <!– #tribe-events-pg-template –>
<?php
get_footer();

CODE FOR CUSTOM BANNERS THAT WAS IN ecp-single-template.php.

<?php
/**
* If ‘Default Events Template’ is selected in Settings -> The Events Calendar -> Theme Settings -> Events Template,
* then this file loads the page template for all for the individual
* event view. Generally, this setting should only be used if you want to manually
* specify all the shell HTML of your ECP pages in this template file. Use one of the other Theme
* Settings -> Events Template to automatically integrate views into your
* theme.
*
* You can customize this view by putting a replacement file of the same name (ecp-single-template.php) in the events/ directory of your theme.
*/

// Don’t load directly
if ( !defined(‘ABSPATH’) ) { die(‘-1’); }
?>
<?php get_header(); ?>
<?php the_post(); global $post; ?>

<?php
//Get Event Category to decide what colour banner to use
$terms = get_the_terms(get_the_ID(), TribeEvents::TAXONOMY);

if ($terms) {
if (count($terms) > 0) {
$category = array_shift($terms);
$thisCat = $category->name;
}
//echo ‘

‘.$thisCat.’

‘;
if( $thisCat == ‘Talks’ ){ $colorClass = ‘talk-event’; }
elseif( $thisCat == ‘Visits’ ){ $colorClass = ‘visit-event’; }
elseif( $thisCat == ‘Clubs & Societies’ ){ $colorClass = ‘club-event’; }
elseif( $thisCat == ‘Exhibitions’ ){ $colorClass = ‘exhibit-event’; }
elseif( $thisCat == ‘Special Events’ ){ $colorClass = ‘special-event’; }
elseif( $thisCat == ‘Music Recitals’ ){ $colorClass = ‘musicrec-event’; }
else{ $colorClass = ‘libraryblue’; }
}else{
$colorClass = ‘libraryblue’;
}
?>

<section role=”main” id=”post-<?php the_ID(); ?>” <?php post_class(); ?>>
<div class=”heading-panel bg-<?php echo $colorClass; ?>”>
<div class=”inner”>
<div class=”heading-panel-text”>

<?php the_title(); ?>

<?php the_field(‘sub_heading’); ?>

</div>
</div>
<?php
//if this banner has an image
if( get_field(‘banner_image’) ) {
?>
<div class=”overlay bg-<?php echo $colorClass; ?>-opaque”></div>
<?php
//Get banner image as a full size for background
$attachment_id = get_field(‘banner_image’);
$size = “full”;
$image = wp_get_attachment_image_src( $attachment_id, $size );
?>
<div class=”heading-bg-img” style=”background-image: url(‘<?php echo $image[0] ; ?>’)”></div>
<?php } ?>
</div>

<div class=”wrapper”>
<?php include(tribe_get_current_template()); ?>
</div><?php //.wrapper ?>

</section>
<?php get_footer(); ?>

[Guildford Institute]

Sorry it says I have a comment but I can’t see it!

[Nico]

Hi there @guildfordinst,

Thanks for reaching out to us on this! I can help you here… Sorry for the delay in our reply, you thread got somehow out of our radar until now.

Taking a look at the code I’m not sure about your punctual question. I mean it seems to be an html mark-up issue (or CSS) for me. Can you send over the link to a single event with banner image so I can see this in the site?

Also please note that we generally do not support theme specific issues or styling requests, but I’ll try to do my best to help you here…

Please let me know about it,

Best,
Nico

[Support Droid]

This topic has not been active for quite some time and will now be closed.

If you still need assistance please simply open a new topic (linking to this one if necessary)
and one of the team will be only too happy to help.

[Author]

Posts