List view layout

[Susa]

Thank you for the excellent plugin! Is it possible to edit the layout of list view? I am dreaming that time slot would be before the event name and also that list item would be single line. Like that:

• 10.00-10.30 Aerobics
• 10.30-11.00 Kettlebell

[J. Davis]

Hi Susa,

Yes you can do that. But you’ll need to remove action mptt_shortcode_template_content_responsive_table and add your own modifying list layout and put time before the title. Your code would look like:

remove_action('mptt_shortcode_template_content', 'mptt_shortcode_template_content_responsive_table', 30 );
 add_action('mptt_shortcode_template_content', 'custom_mptt_shortcode_template_content_responsive_table', 30);
 function custom_mptt_shortcode_template_content_responsive_table() {
	global $mptt_shortcode_data;
	if ($mptt_shortcode_data[ 'params' ][ 'responsive' ]) { ?>
		<div class="<?php echo apply_filters('mptt_shortcode_list_view_class', 'mptt-shortcode-list') . ' ' . $mptt_shortcode_data[ 'params' ][ 'custom_class' ] ?>">
			<?php if (!empty($mptt_shortcode_data[ 'events_data' ])):
				foreach ($mptt_shortcode_data[ 'events_data' ][ 'column' ] as $column): ?>
					<div class="mptt-column">
						<h3 class="mptt-column-title"><?php echo $column->post_title ?></h3>
						<ul class="mptt-events-list">
							<?php if (!empty($mptt_shortcode_data[ 'events_data' ][ 'column_events' ][ $column->ID ])):
								foreach ($mptt_shortcode_data[ 'events_data' ][ 'column_events' ][ $column->ID ] as $event) : ?>
									<li class="mptt-list-event" data-event-id="<?php echo $event->post->post_name ?>"
										<?php
										if (!empty($event->post->color)) {
											echo 'style="border-left-color:' . $event->post->color . ';"';
										} ?>>
										<?php if ($mptt_shortcode_data[ 'params' ][ 'time' ]): ?>
											<p class="timeslot">
												<time datetime="<?php echo $event->event_start; ?>" class="timeslot-start"><?php echo date(get_option('time_format'), strtotime($event->event_start)); ?></time>
												<span class="timeslot-delimiter"><?php echo apply_filters('mptt_timeslot_delimiter', ' - '); ?></span>
												<time datetime="<?php echo $event->event_end; ?>" class="timeslot-end"><?php echo date(get_option('time_format'), strtotime($event->event_end)); ?></time>
											</p>
										<?php endif;
										 if ($mptt_shortcode_data[ 'params' ][ 'title' ]):
											$disable_url = (bool)$event->post->timetable_disable_url || (bool)$mptt_shortcode_data[ 'params' ][ 'disable_event_url' ];
											if (!$disable_url) { ?>
												<a title="<?php echo $event->post->post_title; ?>"
												href="<?php echo ($event->post->timetable_custom_url != "") ? $event->post->timetable_custom_url : get_permalink($event->event_id); ?>"
												class="mptt-event-title">
											<?php }
											echo $event->post->post_title;
											
											if (!$disable_url) { ?>
												</a>
											<?php }
										
										endif;
										if ($mptt_shortcode_data[ 'params' ][ 'description' ]): ?>
											<p class="event-description">
												<?php echo $event->description ?>
											</p>
										<?php endif;
										if ($mptt_shortcode_data[ 'params' ][ 'user' ] && ($event->user_id != '-1')): ?>
											<p class="event-user"><?php $user_info = get_userdata($event->user_id);
												if ($user_info) {
													echo get_avatar($event->user_id, apply_filters('mptt-event-user-avatar-size', 24), '', $user_info->data->display_name) . ' ';
													echo $user_info->data->display_name;
												} ?></p>
										<?php endif; ?>
									</li>
								<?php endforeach;
							endif; ?>
						</ul>
					</div>
				<?php endforeach;
			endif; ?>
		</div>
	<?php }
}

You can add it to your functions.php file of your theme or create as individual plugin.
Then you’ll need to edit style to make event inline.
In case you need our assistance with this you can get Extended Support offer and we’ll do this for you.

Best regards,
John

[Author]

Posts