dozza

@ddt4ever I get exactly the same as you.

Nice but buggy – they’re beta testing version 2 at the moment.

kyle

This is happening because the plugin is injecting the calendar view and list view into a page but without including the default template’s usual content divs, so the following divs are missing:

<div id="content-top"></div>
<div id="content" class="clearfix">
<div id="content-area">
<div id="breadcrumbs"></div>

Content

</div>
</div>
<div id="content-bottom"></div>

To rectify, you need to start with “>this

So copy these 4 files:

gridview.php
list.php
single.php
events-list-load-widget-display.php

from wp-content/plugins/the-events-calendar/views

and place them in a new folder called ‘events’ which you’ve created within the root of your theme folder, like this:

wp-content/themes/TheProfessional/events

Then edit each of the view files and add back in the missing divs, or the php that pulls them in. I’m still working on it, but have got the grid calendar view working almost:

Original gridview.php

<?php
global $spEvents;
$spEvents->loadDomainStylesScripts();
get_header();
?>
	<div id="tec-content" class="grid">
		<div id='tec-events-calendar-header' class="clearfix">
			<h2 class="tec-cal-title"><?php _e('Calendar of Events', $spEvents->pluginDomain) ?></h2>
			<span class='tec-month-nav'>
				<span class='tec-prev-month'>
					<a href='<?php echo events_get_previous_month_link(); ?>'>
					← <?php echo events_get_previous_month_text(); ?>
					</a>
				</span>

				<?php get_jump_to_date_calendar( "tec-" ); ?>

				<span class='tec-next-month'>
					<a href='<?php echo events_get_next_month_link(); ?>'>
					<?php echo events_get_next_month_text(); ?> →
					</a>
				</span>
			</span>

			<span class='tec-calendar-buttons'>
				<a class='tec-button-off' href='<?php echo events_get_listview_link(); ?>'><?php _e('Event List', $spEvents->pluginDomain)?></a>
				<a class='tec-button-on' href='<?php echo events_get_gridview_link(); ?>'><?php _e('Calendar', $spEvents->pluginDomain)?></a>
			</span>
		</div><!-- tec-events-calendar-header -->
		<?php
		global $wp_query;
		$tecCatObject = get_category( $wp_query->query_vars['cat'])
		?>
		<a class="ical" href="<?php bloginfo('home'); ?>/?ical=<?php echo $tecCatObject->slug; ?>"><?php _e('iCal Import', $spEvents->pluginDomain) ?></a>
		<?php event_grid_view(); // See the plugins/the-events-calendar/views/table.php template for customization ?>
	</div>
<?php /* For custom template builders...
	   * The following init method should be called before any other loop happens.
	   */
$wp_query->init(); ?>
<?php get_footer(); ?>

With added missing template code (this for full width page template)

<?php
global $spEvents;
$spEvents->loadDomainStylesScripts();
get_header();
?>
<div id="content-top" class="top"></div>
<div id="content" class="clearfix">
	<div id="content-area">

	<?php include(TEMPLATEPATH . '/includes/breadcrumbs.php'); ?>

	<div id="tec-content" class="grid">
		<div id='tec-events-calendar-header' class="clearfix">
			<h2 class="tec-cal-title"><?php _e('Calendar of Events', $spEvents->pluginDomain) ?></h2>
			<span class='tec-month-nav'>
				<span class='tec-prev-month'>
					<a href='<?php echo events_get_previous_month_link(); ?>'>
					← <?php echo events_get_previous_month_text(); ?>
					</a>
				</span>

				<?php get_jump_to_date_calendar( "tec-" ); ?>

				<span class='tec-next-month'>
					<a href='<?php echo events_get_next_month_link(); ?>'>
					<?php echo events_get_next_month_text(); ?> →
					</a>
				</span>
			</span>

			<span class='tec-calendar-buttons'>
				<a class='tec-button-off' href='<?php echo events_get_listview_link(); ?>'><?php _e('Event List', $spEvents->pluginDomain)?></a>
				<a class='tec-button-on' href='<?php echo events_get_gridview_link(); ?>'><?php _e('Calendar', $spEvents->pluginDomain)?></a>
			</span>
		</div><!-- tec-events-calendar-header -->
		<?php
		global $wp_query;
		$tecCatObject = get_category( $wp_query->query_vars['cat'])
		?>
		<a class="ical" href="<?php bloginfo('home'); ?>/?ical=<?php echo $tecCatObject->slug; ?>"><?php _e('iCal Import', $spEvents->pluginDomain) ?></a>
		<?php event_grid_view(); // See the plugins/the-events-calendar/views/table.php template for customization ?>
	</div>
</div>
</div>
<div id="content-bottom"></div>

<?php /* For custom template builders...
	   * The following init method should be called before any other loop happens.
	   */
$wp_query->init(); ?>
<?php get_footer(); ?>

If you want the default template with sidebar, replace the first two lines:

<div id="content-top" class="top"></div>
<div id="content" class="clearfix">

with this

<div id="content-top" class="top-alt"></div>
	<div id="content" class="clearfix content-alt">

I have then tweaked the css by adding some margin left and right to

(wp-content/plugins/the-events-calendar/resources/events.css)

#tec-content {font-size: 1.2em;
	margin-left: 40px;
	margin-right: 42px;
}

Hope that helps. Let me know if you improve on this or spot any errors.

Glad it worked out. I may need to use it myself soon so thanks for confirming.