Welcome to the Treehouse Community
The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.
Enyel Cuadro12,884 Points
Add different class to the div?
What if I have different type of portfolio and I want to add different class to a div to make it as a tag e.g. photo and video
loop that used in this video Creating a Portfolio Landing Page is
<?php $portfolio = array( 'post_type' => 'portfolio' ); $the_query = new WP_Query ( $portfolio ); ?> <?php if ( have_posts() ) : while ( $the_query->have_posts() ) : $the_query->the_post(); ?> <div class="col-md-4 col-sm-6"> <?php the_title(); ?> </div> <?php endwhile; endif; ?>
what I want to see when going to have on my portfolio post
<div class="col-sm-6 photo"> photo </div> <div class="col-sm-6 video"> video </div> <div class="col-sm-6 photo"> photo </div> <div class="col-sm-6 video"> video </div>
To get the desired effect it is a two step process.
Step one, create a category for each post, add the corresponding category i.e. photo or video.
Step two, add the WordPress function post_class() inside of the looped div. Please note that this function creates a HTML class structure so you do NOT want to have class="<?php post_class(); ?>"; what you need to do is <div <?php post_class(); ?> and that should echo out the category names into the correct div.
If you have any questions please feel free to ask.
PS to keep the bootstrap classes add then as arguments to the post_class('col-sm-6'); this will include that class as well as the category name class.