Easier examples of integration

i’am trying to display events by putting the code in a diffrent template files like this.

<?php $args = array(
        'post_type' => 'am_event',
        'post_status' => 'publish',
    );

$the_query = new WP_Query($args); ?>

But nothing seams to work, no matter how i try do do it. I’am using theme “Self – A Responsive vCard WordPress Theme” from themeforest.

The code you posted seems ok, but it only creates the query. To display the event posts, you need to use $the_query to loop through and display all of them.

So you need to add something like this below:

if ($the_query->have_posts()) {
	while ($the_query->have_posts()) {
		$the_query->the_post();

		$postId = $post->ID;

		// GET EVENT DATA 

		$startDate = am_get_the_startdate('Y-m-d H:i:s');
		$endDate = am_get_the_enddate('Y-m-d H:i:s');
		$venues = am_get_the_venue( $postId );
		$eventCategories = am_get_the_category( $postId );

		// DISPLAY EVENT CONTENT

		the_title();

		echo '<p>' . $startDate . '</p>';
		echo '<p>' . $endDate . '</p>';

		// echo the first venue
		echo '<p>' . $venues[0]->cat_name . '</p>';

		// echo list of all event categories with template tag
		am_the_event_category();

		the_content();

	}
}

You also need to make sure you put the code in the right template file, like a custom page template.

Hope this helps. I’ll probably write more examples or an easier tutorial later this week.

Notice also that I added template tags in version 1.3.0, which makes it easier to get and display event data (dates, venues and categories).

I should also add that what you probably need is a child theme with a custom page template. That would allow you to update your theme without losing any modifications.

I’ve created a simple working child theme for Twenty Twelve, with three custom page templates that can be assigned to any page. You could modify them to suit your own theme. Download here.

Hey there, I have just come across your wonderful event plugin. It is ideal for my running club’s training events.

I downloaded your demo files, but I have to confess to not being very good with code. Are you able to tell me where your demo code goes the the page template below please? I was looking at the page-event-blog file. Essentially, I just want a page to show all upcoming events.

<?php
/**
 * The template used for displaying page content in page.php
 *
 */
?>

<!-- Titlebar
    ================================================== -->
    <section id="titlebar">
        <!-- Container -->
        <div class="container">

            <div class="eight columns">

                <h2><?php the_title(); ?> <?php $subtitle = get_post_meta($post->ID, 'pp_subtitle', true); if($subtitle)  echo "<span>".$subtitle."</span>";?>
                    <?php edit_post_link( __( 'Edit', 'purepress' ), '<span class="edit-link">', '</span>' ); ?>
                </h2>
            </div>
            <div class="eight columns">
                <?php if(ot_get_option('pp_breadcrumbs') != 'no') echo dimox_breadcrumbs(); ?>

            </div>

        </div>
        <!-- Container / End -->
    </section>
<!-- Content
    ================================================== -->

    <!-- Container -->
    <div  id="post-<?php the_ID(); ?>" <?php post_class('container'); ?> >
        <div class="twelve alt columns" >
            <?php the_content(); ?>
            <?php wp_link_pages( array( 'before' => '<div class="page-links">' . __( 'Pages:', 'purepress' ), 'after' => '</div>' ) ); ?>
              <?php
            // If comments are open or we have at least one comment, load up the comment template
        if ( comments_open() || '0' != get_comments_number() ) {
        echo '<div class="page-comments">';
            comments_template( '', true );
        echo '</div>';
    } ?>
        </div>
          <?php  get_sidebar(); ?>
    </div>
    <!-- Page Content / End -->

I appreciate any help.

Thank you,
Karl

Generally you would want to replace the page’s content with the content generated by the wp_query or simply add the query after the content.

In your example, you could add the wp_query right after <?php the_content() ?>. If you need to enable comments for the events, you should also move all the comments stuff inside the query.

Keep in mind that the page-event-blog example contains a lot of features that you may not need, like thumbnail, comments or featured posts. The bare minimum you need to loop through and display all posts is this:

<?php $args = array(
        'post_type' => 'am_event',
    );

$the_query = new WP_Query($args); ?>

if ($the_query->have_posts()) {
	while ($the_query->have_posts()) {
		$the_query->the_post();

		the_title();
                the_content();
	}
}

Thank you Atte.

I tried the code you posted, but it isn’t working for me. Please see below my bare minimum code template.

What actual code do I paste after my ‘event code here’ note?

<?php
/**
 * Template Name: Runner Events
 *
 * A custom page template without sidebar.
 *
 * The "Template Name:" bit above allows this to be selectable
 * from a dropdown menu on the edit page screen.
 *
 * @package WordPress
 * @subpackage purepress
 * @since purepress 1.0
 */

$htype = ot_get_option('pp_header_menu');
get_header($htype);

wp_reset_query(); ?>

<!-- Titlebar
    ================================================== -->
    <section id="titlebar">
        <!-- Container -->
        <div class="container">

        <div class="eight columns">

        <h2><?php the_title(); ?> <?php $subtitle = get_post_meta($post->ID, 'pp_subtitle', true); if($subtitle)  echo "<span>".$subtitle."</span>";?>
            <?php edit_post_link( __( 'Edit', 'purepress' ), '<span class="edit-link">', '</span>' ); ?>
            </h2>
            </div>

        <div class="eight columns">
            <?php if(ot_get_option('pp_breadcrumbs') != 'no') echo dimox_breadcrumbs(); ?>
            </div>

        	</div><!-- Container / End -->
    </section>

<!-- Content
    ================================================== -->
    <?php $layout = ot_get_option('pp_blog_layout'); ?>
    <!-- Container -->
    <div class="container <?php if($layout == 'left-sidebar') { echo "page-left"; }?>">
    <div class="twelve <?php if($layout == 'left-sidebar') { echo "alt2"; } else { echo "alt"; } ?> columns">

<!-- Event Code To Go Here
    ================================================== -->

	</div>

<!-- Sidebar
    ================================================== -->
<?php get_sidebar(); ?>

</div>
<!-- Container / End -->
<?php wp_reset_query();  get_footer(); ?>

Thank you so much for any additional guidance ??

Karl

The code in my previous post should work just fine and seems like you are putting it in the right place.

Are you sure the custom page template is actually being used? Also make sure the plugin is enabled and that you have created one or more events that can be shown. Does the page show any errors or does it just create a page with no events?

Managed it myself. Just needed belief ??

Just realised. The list is showing later dates first, how do I show nearest dates first?

<?php $args = array(
        'post_type' => 'am_event',
        'post_status' => 'publish',
    	);

		$the_query = new WP_Query($args); 

        if ($the_query->have_posts()) {
		while ($the_query->have_posts()) {
		$the_query->the_post();

		$postId = $post->ID;

		// GET EVENT DATA 

		$startDate = am_get_the_startdate('l j F');

		// DISPLAY EVENT CONTENT

		echo '<strong>' . $startDate . '</strong>';
		the_title( '<h3 style="color:red;">', '</h3>' );
		the_content();

		}
		}

		?>

Many thanls,
Karl

Just replace

$args = array(
        'post_type' => 'am_event',
        'post_status' => 'publish',
    	);

with

$args = array(
	'post_type' => 'am_event',
	'post_status' => 'publish',
	'orderby' => 'meta_value',
	'meta_key' => 'am_startdate',
	'order' => 'ASC',
	'meta_query' => array(
		array(
			'key' => 'am_enddate',
			'value' => date('Y-m-d H:i:s', time()),
			'compare' => ">",
		),
	),
);

This will show only ongoing and upcoming events ordered by date from newest to latest

Thanks for that Atte,

I tried the code but there appears to be something missing as the code doesn’t work.

I really appreciate the support you have given ??

Hmm, it should be working, as I copied it straight from the page-event-blog example, which I have tested.

Could you provide any additional information on how it doesn’t work? What version of wordpress and php are you using?

My bad. Realised I didn’t put the PHP start tag at the beginning.

For some reason though I am only getting 2 results. For instance it is omitting today’s events. How do I show them?

It should show all events which haven’t ended yet.

You can fiddle with the time() function to change how long ago the events are shown. You could for example replace time() with time() – (24 * 60 * 60) to show events with an end time greater than 24h before the current time.