Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

WordPress

Sara Rasmussen
Sara Rasmussen
393 Points

Custom Post Types: How to display different custom content within different templates?

Hello, I am relatively new to both Treehouse and WordPress. I am building a WordPress website that uses Custom Post Types, following what Zac Gordon teaches in the build a WP website project.

Much like the "Testimonials", I have an "Infographics" Custom Post Type that displays at the bottom of several templates - the home page, among others.

However, I do not want to randomize what shows where. I would like to be able to determine which custom content displays within which template.

The homepage infographics should display on the homepage, and the "about" infographics should display on the about page, etc.

My first thought was that if there was a custom field that asks the person inputting the custom content "which page should this display on?" then somehow there would be a way to make that work in the code, so that they could be correctly assigned. But now I am not sure how to accomplish that.

Does anyone have any suggestions on how to make this work?

4 Answers

You could use categories to manage this. Basically filtering the custom content that would appear on the page by the category it's assigned to. Depending on how you want to display it you may have to get your hands dirty with tweaking some of the php in your templates.

John Locke
John Locke
15,479 Points

If you are working with Custom Post Types, you can add a Custom Field, something like a radio button or checkbox that displays on the editing area of your Custom Post Type. You can use the plug in Advanced Custom Fields to make this easy. http://www.advancedcustomfields.com/

If you want just 'Homepage' info graphics to appear on the home page, set your home.php template to look for just infographics that have that value for the particular custom field. I usually run a new WP Query with post_type set to whatever the custom post type is and the_field() set to my custom select box in the args.

There are some links to get you going in the right direction: http://blog.teamtreehouse.com/adding-custom-fields-to-a-custom-post-type-the-right-way http://www.codeforest.net/wordpress-how-to-make-custom-post-field-using-advanced-custom-fields-plugin http://www.advancedcustomfields.com/resources/getting-started/code-examples/ http://stackoverflow.com/questions/tagged/custom-post-type

Sara Rasmussen
Sara Rasmussen
393 Points

Thank you John and Lisa.

John - that's exactly what I was thinking might be possible. I'm just not sure what the exact syntax is to have the template look for infographics that have that value for the particular custom field.

I found this in the ACF support docs: http://www.advancedcustomfields.com/resources/how-to/how-to-query-posts-filtered-by-custom-field-values/

I think this is the right thing to do. My follow-up question is that originally, since "infographics" appears in multiple different templates, I was going to put it in a content-infographics.php file, and then call that file with get_template_part().

How do I do this when I already have another WP_Query on my homepage.php?

So I know I need to use one of the reset tags, although I am not certain what to do. What I have right now is not working. Above the query for the infographic, I have another query which I close thus:

            <?php endwhile; ?>

            <?php wp_reset_postdata(); ?>

            <?php endif; ?>

And then here is the one for the infographic:

    <?php 

        $args = array(
            'post_type' => 'infographic',
            'posts_per_page' => 3,
            'meta_key' => 'category',
            'meta_value' => 'Home'

        );

        $the_query = new WP_Query( $args );

    ?>

            <?php get_template_part( 'content', 'infographic' ); ?>

And here is what is inside the Infographic include:

<div class="infographicsContainer">

    <?php if ( have_posts() ) : while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
        <div class="infographic">
        <img src="<?php the_field( 'image' ); ?>" alt="<?php the_title(); ?> Infographic">
        <h3 class="entry-title">
            <?php the_title(); ?>
        </h3>
        <p>
            <?php the_field( 'description' ); ?>
        </p>
    </div>


    <?php endwhile; ?>

    <?php wp_reset_postdata(); ?>

    <?php endif; ?>

</div>

Thank you again for your help.

John Locke
John Locke
15,479 Points

Try adding $the_query-> to have_posts and see if that works. You have to add the query name to all three parts of the Loop: if have posts, while have posts, and the post.

http://codex.wordpress.org/Class_Reference/WP_Query