[Helli Meinecke]

This reply is private.

[Helli Meinecke]

This reply is private.

[Helli Meinecke]

Hi Jennifer,

Ahhhhhh, that explains things.

Thanks, I have got this working now.

Cheers for your help.

[Helli Meinecke]

Hi Jennifer,

Thanks for your help.

Actually that also causes the nice green heading box to be lost.

So then I tried a simple test – uploading an exact copy of “single-event.php” file from “/public_html/wp-content/plugins/the-events-calendar/src/views/” into our tribe-events template folder located at “/public_html/wp-content/themes/Avada-Child-Theme/tribe-events/” folder. When I do this we also lose the nice green heading box (and the side bar content is repeated below the content in the LHS column). When I delete the exact copy (so there is no “single-event.php” in the “/public_html/wp-content/themes/Avada-Child-Theme/tribe-events/” folder), the nice green heading box comes back. Something weird is going on. See attached image for a visual.

Any ideas?

Thanks.

[Helli Meinecke]

Thanks Andras.

No worries. Ok thanks, I will do that if we still want to hide the tooltips.

Thanks again for all your help! You are a superstar

[Helli Meinecke]

Hi Andras,

My reply went missing after a couple of edits so including a shorter version.

Thanks for your help and css prompting.

This seemed to do the trick for us as there is some height provided to the empty h3 a in our theme:
#tribe-events .tribe-events-calendar div[id*="tribe-events-event--"] { display: none !important; }

From original post this query still remains…
3. Hover popup
b. Is there a way to disable the hover popup?

Thanks.

[Helli Meinecke]

Hi Andras,

Awesome, thanks!

Thanks. That css helped a lot. In our theme (Avada), a smaller gap was still noticeable presumably due to css settings for the h3 and a tags. But you got me thinking.

I came up with a javascript solution which seems to work fine:

<script>
jQuery(document).ready(function($) {
	//Calendar (Month View): Hide empty div rows
	$('.tribe-events-calendar td > div h3.tribe-events-month-event-title a').each(function(){
		if($.trim($(this).text()) == '' && $(this).children().length == 0){
			$(this).parents('.tribe-events-calendar td > div').hide();
		}
	});
});
</script>

The js is a bit slow to load (Avada is big and the js is in footer) so you’d see the events jump slightly up into position – so I looked for a css solution instead.

After looking in the inspector at some of TEC’s css names I tried this (I never would have worked this out if it wasn’t for the inspector):
#tribe-events .tribe-events-calendar div[id*="tribe-events-event--"] { display: none !important; }

This seems to work because the empty “div rows” have an id like “tribe-events-event–4” (eg tribe-events-event–DAY) whereas events with content have an id with the event id in it like “tribe-events-event-13299-4” (eg tribe-events-event-ID-DAY).

BOOM! Now we’re talking.

Just one query remaining from the original post relating to the calendar event popup…
3. b. Alternatively: is there a way to disable the hover popup? If so, please advise how

Thanks again.

• This reply was modified 8 years, 9 months ago by Helli Meinecke.
• This reply was modified 8 years, 9 months ago by Helli Meinecke.

[Helli Meinecke]

This reply is private.

[Helli Meinecke]

Hi Andras,

Thanks for all your help.

Ah I see.

Thank you for the updated functions code. I have applied that.

Hehe. Drumroll… I think I have got it working:
<?php if ( tribe_event_is_multiday() ) :?> <br/ ><?php echo tribe_format_date(tribe_get_start_date(), false)?> - <?php echo tribe_format_date(tribe_get_end_date(), false)?> <?php endif; ?>

Is that how you would do it?

The full template currently looks like so:

<div id="tribe-events-event-<?php echo esc_attr( $event_id ); ?>" class="<?php tribe_events_event_classes() ?>" data-tribejson='<?php echo esc_attr( tribe_events_template_data( $post ) ); ?>'>
	<h3 class="tribe-events-month-event-title"><a href="<?php echo esc_url( $link ) ?>" class="url">
		<?php echo $title ?>
    	<?php if ( tribe_event_is_multiday() ) :?> <br/ ><?php echo tribe_format_date(tribe_get_start_date(), false)?> - <?php echo tribe_format_date(tribe_get_end_date(), false)?> <?php endif; ?>
    </a></h3>
</div><!-- #tribe-events-event-# -->

One new issue has popped up now that I would really appreciate your help with… Empty h3s which are mucking up the spacing in the calendar. It seems to happen when more than one event occurs per day (but I am not 100% sure as the 18th has one empty h3 (one empty “tribe-events-event…” ‘row’) and the 20th has 2 empty h3’s (two empty “tribe-events-event…” ‘rows’) even though they only have one multi day event each). Screencap is attached which shows has the spacing is off. “Month view events per day” is currently set to 3.

Empty h3 examples from September 4 which has 2 empty “tribe-events-event…” divs

<div id="tribe-events-event--4" class="" data-tribejson='{&quot;i18n&quot;:{&quot;find_out_more&quot;:&quot;Find out more \u00bb&quot;,&quot;for_date&quot;:&quot;Events for&quot;}}'>
	<h3 class="tribe-events-month-event-title"><a href="/" class="url">
		    	    </a></h3>
</div><!-- #tribe-events-event-# -->
	
<div id="tribe-events-event--4" class="" data-tribejson='{&quot;i18n&quot;:{&quot;find_out_more&quot;:&quot;Find out more \u00bb&quot;,&quot;for_date&quot;:&quot;Events for&quot;}}'>
	<h3 class="tribe-events-month-event-title"><a href="/" class="url">
		    	    </a></h3>
</div><!-- #tribe-events-event-# -->

Full day html from September 4 showing all code:

		<td class="tribe-events-thismonth tribe-events-future tribe-events-has-events mobile-trigger tribe-event-day-04"
				data-day="2017-09-04"
				data-tribejson='{"i18n":{"find_out_more":"Find out more \u00bb","for_date":"Events for"},"date_name":"September 4"}'
				>
				
<!-- Day Header -->
<div id="tribe-events-daynum-4">

			<a href="https://our-domain.com/events/2017-09-04/">4</a>
	
</div>

<!-- Events List -->
	
<div id="tribe-events-event--4" class="" data-tribejson='{&quot;i18n&quot;:{&quot;find_out_more&quot;:&quot;Find out more \u00bb&quot;,&quot;for_date&quot;:&quot;Events for&quot;}}'>
	<h3 class="tribe-events-month-event-title"><a href="/" class="url">
		    	    </a></h3>
</div><!-- #tribe-events-event-# -->
	
<div id="tribe-events-event--4" class="" data-tribejson='{&quot;i18n&quot;:{&quot;find_out_more&quot;:&quot;Find out more \u00bb&quot;,&quot;for_date&quot;:&quot;Events for&quot;}}'>
	<h3 class="tribe-events-month-event-title"><a href="/" class="url">
		    	    </a></h3>
</div><!-- #tribe-events-event-# -->
	
<div id="tribe-events-event-13299-4" class="tribe-events-category- post-13299 tribe_events type-tribe_events status-publish hentry tribe-events-venue-13225 tribe-events-last" data-tribejson='{&quot;i18n&quot;:{&quot;find_out_more&quot;:&quot;Find out more \u00bb&quot;,&quot;for_date&quot;:&quot;Events for&quot;},&quot;eventId&quot;:13299,&quot;title&quot;:&quot;14th International Asparagus Symposium | Potsdam, Germany&quot;,&quot;permalink&quot;:&quot;https:\/\/our-domain.com\/event\/14th-international-asparagus-symposium-potsdam-germany-2\/&quot;,&quot;imageSrc&quot;:&quot;&quot;,&quot;dateDisplay&quot;:&quot;September 4 - September 7&quot;,&quot;imageTooltipSrc&quot;:&quot;&quot;,&quot;excerpt&quot;:&quot;<p><\/p>&quot;,&quot;categoryClasses&quot;:&quot;tribe-events-category- post-13299 tribe_events type-tribe_events status-publish hentry tribe-events-venue-13225 tribe-events-last&quot;,&quot;startTime&quot;:&quot;September 4&quot;,&quot;endTime&quot;:&quot;September 7&quot;}'>
	<h3 class="tribe-events-month-event-title"><a href="https://our-domain.com/event/14th-international-asparagus-symposium-potsdam-germany-2/" class="url">
		14th International Asparagus Symposium | Potsdam, Germany    	<br/ > <p>September 4 - September 7</p>     </a></h3>
</div><!-- #tribe-events-event-# -->

<!-- View More -->
	<div class="tribe-events-viewmore">
				<a href="https://our-domain.com/events/2017-09-04/" class="fusion-read-more">View All 4 Events</a>
	</div>
			</td>

Do you have any tricks for overcoming this new related issue Andras?

Thanks so much for your ongoing help.

• This reply was modified 8 years, 9 months ago by Helli Meinecke. Reason: moved the br inside the if statement

[Helli Meinecke]

Thanks for your help Andras.

Do you mean like so?

<p>Test: 
<?php echo tribe_format_date(tribe_get_start_date(), false)?> - <?php echo tribe_format_date(tribe_get_end_date(), false)?>    
</p>

If not, can you please confirm the exact details as we are flying a little blind here.

Not quite sure what you mean by including those 3 functions.

Currently we are using:

<div id="tribe-events-event-<?php echo esc_attr( $event_id ); ?>" class="<?php tribe_events_event_classes() ?>" data-tribejson='<?php echo esc_attr( tribe_events_template_data( $post ) ); ?>'>
	<h3 class="tribe-events-month-event-title"><a href="<?php echo esc_url( $link ) ?>" class="url"><?php echo $title ?></a></h3>
    <p>Test: 
	<?php echo tribe_format_date(tribe_get_start_date(), false)?> - <?php echo tribe_format_date(tribe_get_end_date(), false)?>    
    </p>
</div><!-- #tribe-events-event-# -->

How to handle single day events?
Is it possible to show this (or the equivalent if wrong):
<?php echo tribe_format_date(tribe_get_start_date(), false)?> - <?php echo tribe_format_date(tribe_get_end_date(), false)?>
ONLY if its a multi day event
OTHERWISE if its a single day event don’t show anything?
If so, please advise.

Also, we still have the same issue re the #1 functions code mentioned previously where the date range is included on every day that has an event even though the title is excluded. See attached. Any ideas?

Thanks.

• This reply was modified 8 years, 9 months ago by Helli Meinecke. Reason: typos

[Helli Meinecke]

Hello Andras,

Thanks for the very helpful answer and apologies for the delay in reply. We previously did not have FTP access (I know!) so I moved the site to a new server for the child theme functions.php and month template overrides. Now I have been able to try your suggestions.

#1. Multi-day events

That code works a treat, thanks a lot… Except with the month “single-event.php” template tweak for #2. The new addition (the wrong [[=dateDisplay]] discussed below in #2) is unexpectantly included on every day that has an event even though the corresponding title is no shown due to this function. Any ideas on how to fix that?

#2. include the date range below the event title in month view

Thanks for the tips. I can’t quite get this to work. I have got the child template override happening – The calendar is using the “child template file”. I just don’t know the right “tag” to use for the date range.

I am trying this from the month tooltip below but that returns [[=dateDisplay]] in every day that has an event (even with function from #1)
…

<div id="tribe-events-event-<?php echo esc_attr( $event_id ); ?>" class="<?php tribe_events_event_classes() ?>" data-tribejson='<?php echo esc_attr( tribe_events_template_data( $post ) ); ?>'>
	<h3 class="tribe-events-month-event-title"><a href="<?php echo esc_url( $link ) ?>" class="url"><?php echo $title ?></a></h3>
	<div class="tribe-event-duration"><abbr class="tribe-events-abbr tribe-event-date-start">[[=dateDisplay]]</abbr></div>
</div><!-- #tribe-events-event-# -->

What tag/code do you suggest using to show the date range only if empty – and only on the day when an event is showing (relating to the functions.php code in #1).

#3. Hover popup

Thanks. I think we will leave this for now but appreciate knowing where to do it.

#4. Filter bar button

Perfect, that did it. Thanks.

Thanks for the ongoing support Andras.

• This reply was modified 8 years, 9 months ago by Helli Meinecke. Reason: typo

[Helli Meinecke]

ps just confirming… there aren’t any locations without a venue name. I assigned each location a venue name like so:

• Adelaide, South Australia, Australia
• Austin, Texas, USA

which doesn’t seem the best way to do it – but perhaps is the workaround for our needs?

[Helli Meinecke]

Brilliant thank you!

[Helli Meinecke]

Thanks so much!

[Helli Meinecke]

I added the city/state/country names as venues, imported those, and then re-imported the events. Seems to work fine. Perhaps still confirm if this is the best way to do it. Thanks.

[Author]

Posts