Modified Tooltip for The Events Calendar Pro WordPress
- SOLVED
I am looking to modify the tooltip that pops up on [[LINK href="http://wordpress.org/extend/plugins/the-events-calendar/"]]The Events Calendar[[/LINK]]'s Calendar Widget (for those with the plugin the file is views/table-mini.php). Essentially, I am just looking to pull in the code from the tooltip that appears on the main calendar page (table.php). The big part what I want is to pull in the starttime-endtime part.
After sorting through the code I believe this is the code for the tooltip on the Widget, which displays just the title and a link:
function tribe_mini_display_day( $day, $monthView ) {
$return = "<div class='daynum tribe-events-event' id='daynum_$day'>";
$return .= ( count($monthView[$day]) ) ? "<a class='tribe-events-mini-has-event'>$day</a>" : $day;
$return .= "<div id='tooltip_day_$day' class='tribe-events-tooltip' style='display:none;'>";
for( $i = 0; $i < count( $monthView[$day] ); $i++ ) {
$post = $monthView[$day][$i];
setup_postdata( $post );
$return .= '<h5 class="tribe-events-event-title-mini"><a href="'. tribe_get_event_link($post) .'">' . $post->post_title . '</a></h5>';
}
$return .= '<span class="tribe-events-arrow"></span>';
$return .= '</div>';
$return .= "</div>";
return $return;
}
And I believe this is the code for the tooltip on the calendar:
function display_day( $day, $monthView ) {
global $post;
$output = '';
$posts_per_page = tribe_get_option( 'postsPerPage', 10 );
for ( $i = 0; $i < count( $monthView[$day] ); $i++ ) {
$post = $monthView[$day][$i];
setup_postdata( $post );
$eventId = $post->ID.'-'.$day;
$start = tribe_get_start_date( $post->ID, false, 'U' );
$end = tribe_get_end_date( $post->ID, false, 'U' );
$cost = tribe_get_cost( $post->ID );
?>
<div id='event_<?php echo $eventId; ?>' <?php post_class('tribe-events-event tribe-events-real-event') ?>>
<a href="<?php tribe_event_link(); ?>"><?php the_title(); ?></a>
<div id='tooltip_<?php echo $eventId; ?>' class="tribe-events-tooltip" style="display:none;">
<h5 class="tribe-events-event-title"><?php the_title();?></h5>
<div class="tribe-events-event-body">
<div class="tribe-events-event-date">
<?php if ( !empty( $start ) ) echo date_i18n( get_option('date_format', 'F j, Y'), $start);
if ( !tribe_get_event_meta($post->ID, '_EventAllDay', true) )
echo ' ' . date_i18n( get_option('time_format', 'g:i a'), $start); ?>
<?php if ( !empty( $end ) && $start !== $end ) {
if ( date_i18n( 'Y-m-d', $start ) == date_i18n( 'Y-m-d', $end ) ) {
$time_format = get_option( 'time_format', 'g:i a' );
if ( !tribe_get_event_meta($post->ID, '_EventAllDay', true) )
echo " – " . date_i18n( $time_format, $end );
} else {
echo " – " . date_i18n( get_option('date_format', 'F j, Y'), $end);
if ( !tribe_get_event_meta($post->ID, '_EventAllDay', true) )
echo ' ' . date_i18n( get_option('time_format', 'g:i a'), $end) . '<br />';
}
} ?>
</div>
<?php if ( function_exists('has_post_thumbnail') && has_post_thumbnail() ) { ?>
<div class="tribe-events-event-thumb"><?php the_post_thumbnail( array(75,75));?></div>
<?php } ?>
<?php echo has_excerpt() ? TribeEvents::truncate($post->post_excerpt) : TribeEvents::truncate(get_the_content(), 30); ?>
</div>
<span class="tribe-events-arrow"></span>
</div>
</div>
<?php
if( $i < count( $monthView[$day] ) - 1 ) {
echo "<hr />";
}
}
}
?>
Answers (4)
Arnav Joy answers:
can you please explain what you want to get..
Arnav Joy comments:
try this function
function tribe_mini_display_day( $day, $monthView ) {
$return = "<div class='daynum tribe-events-event' id='daynum_$day'>";
$return .= ( count($monthView[$day]) ) ? "<a class='tribe-events-mini-has-event'>$day</a>" : $day;
$return .= "<div id='tooltip_day_$day' class='tribe-events-tooltip' style='display:none;'>";
for( $i = 0; $i < count( $monthView[$day] ); $i++ ) {
$post = $monthView[$day][$i];
setup_postdata( $post );
$eventId = $post->ID.'-'.$day;
$start = tribe_get_start_date( $post->ID, false, 'U' );
$end = tribe_get_end_date( $post->ID, false, 'U' );
$cost = tribe_get_cost( $post->ID );
$return .= '<h5 class="tribe-events-event-title-mini"><a href="'. tribe_get_event_link($post) .'">' . $post->post_title . '</a></h5>';
}
$return .= '<span class="tribe-events-arrow"></span>';
$return.='<div class="tribe-events-event-body">';
$return.='<div class="tribe-events-event-date">';
if ( !empty( $start ) )
$return.=date_i18n( get_option('date_format', 'F j, Y'), $start);
if ( !tribe_get_event_meta($post->ID, '_EventAllDay', true) )
$return.=' ' . date_i18n( get_option('time_format', 'g:i a'), $start);
if ( !empty( $end ) && $start !== $end ) {
if ( date_i18n( 'Y-m-d', $start ) == date_i18n( 'Y-m-d', $end ) ) {
$time_format = get_option( 'time_format', 'g:i a' );
if ( !tribe_get_event_meta($post->ID, '_EventAllDay', true) )
$return.=' – ' . date_i18n( $time_format, $end );
} else {
$return.=' – ' . date_i18n( get_option('date_format', 'F j, Y'), $end);
if ( !tribe_get_event_meta($post->ID, '_EventAllDay', true) )
$return.=' ' . date_i18n( get_option('time_format', 'g:i a'), $end) . '<br />';
}
}
$return.='</div>';
$return.=$post->post_excerpt;
$return.='</div>';
$return .= '</div>';
$return .= "</div>";
return $return;
}
Kyle comments:
That worked! Thanks
I had one other small request. The hyphen between the starttime and endtime is appearing very weird ([[LINK href="http://imgur.com/jrR0L"]]Link to Image[[/LINK]]) is there a way to make it just a normal " - "?
Kyle comments:
Nevermind, fixed it. Thanks Arnav!
Gabriel Reguly answers:
Hi,
Please try this
function tribe_mini_display_day( $day, $monthView ) {
$return = "<div class='daynum tribe-events-event' id='daynum_$day'>";
$return .= ( count($monthView[$day]) ) ? "<a class='tribe-events-mini-has-event'>$day</a>" : $day;
$return .= "<div id='tooltip_day_$day' class='tribe-events-tooltip' style='display:none;'>";
for( $i = 0; $i < count( $monthView[$day] ); $i++ ) {
$post = $monthView[$day][$i];
setup_postdata( $post );
$start = tribe_get_start_date( $post->ID, false, 'U' );
$end = tribe_get_end_date( $post->ID, false, 'U' );
$return .= '<h5 class="tribe-events-event-title-mini"><a href="'. tribe_get_event_link($post) .'">' . $post->post_title;
if ( !empty( $start ) ) {
$return .= date_i18n( get_option('date_format', 'F j, Y'), $start);
if ( !tribe_get_event_meta($post->ID, '_EventAllDay', true) )
$return .= ' ' . date_i18n( get_option('time_format', 'g:i a'), $start); ?>
<?php if ( !empty( $end ) && $start !== $end ) {
if ( date_i18n( 'Y-m-d', $start ) == date_i18n( 'Y-m-d', $end ) ) {
$time_format = get_option( 'time_format', 'g:i a' );
if ( !tribe_get_event_meta($post->ID, '_EventAllDay', true) )
$return .= " – " . date_i18n( $time_format, $end );
} else {
$return .= " – " . date_i18n( get_option('date_format', 'F j, Y'), $end);
if ( !tribe_get_event_meta($post->ID, '_EventAllDay', true) )
$return .= ' ' . date_i18n( get_option('time_format', 'g:i a'), $end) . '<br />';
}
}
$return .= ' '. '</a></h5>';
}
$return .= '<span class="tribe-events-arrow"></span>';
$return .= '</div>';
$return .= "</div>";
return $return;
}
Kyle comments:
It broke the calendar and displayed nothing. Here is the sample page if that helps: http://hookahi.com/guideprofile/ . Also you were missing a closing } at the end
Plugarized answers:
Hi, I am running the basic version of this plugin, on my client's page http://n1bar.com/events/ what is it that you want to acomplish, what are you planning to do with the code
Kyle comments:
I want to add additional information to the popup tooltip that appears on the widget version of the calendar. The full size calendar version has a tooltip that displays more information so I want to pull in that code. Here are two pics that show the two popups. Current widget popup: http://imgur.com/jJAjA , and the normal calendar popup: http://imgur.com/s9Bdg
