Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

List items from a determined custom post type WordPress

  • SOLVED

We are tweaking a single-customposttype.php template aiming to create a sidebar menu where all items belonging the custom post type in question are listed with the actual (active) item being highlighted on the list (menu) with a special css class.

STRUCTURAL EXAMPLE

Custom Post Type = "Services"
User acesssing = "Service 2"

HTML code outputed by single-services.php (sidebar menu):


<ul class="post-type-items">
<li>Service 1</li>
<li class="current-item">Service 2</li>
<li>Service 3</li>
<li>Service 4</li>
</ul>



Looking forward for the code snippet that need to be placed on single-customposttype.php template.

Thanks in advance.

Answers (5)

2012-01-07

Arnav Joy answers:

if you are creating sidebar then why do you want to create single-custom.php?


Arnav Joy comments:

you can use:-

<?php
query_posts('post_type=survices&showposts=-1');
if(have_posts())
while(have_posts()):the_post();
?>
<li <?php if(get_the_ID() == $post->ID) { ?> class="current" <?php } ?>><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
<?php endwhile;endif;?>


Liantas comments:

I'm not registering a new wordpress sidebar.

This is a sidebar hardcoded on custom post type single template.

Sorry for the misunderstanding and thanks for your attention.


Arnav Joy comments:

try this

<ul class="post-type-items">
<?php
wp_reset_query();
query_posts('post_type=survices&showposts=-1');
if(have_posts()):
while(have_posts()):the_post();
?>
<li <?php if(get_the_ID() == $post->ID) { ?> class="current-item" <?php } ?>><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
<?php endwhile;endif; wp_reset_query();?>
</ul>


Arnav Joy comments:

try this as previous code was missplled with custom post type services

try this this will work for you

<ul class="post-type-items">
<?php
wp_reset_query();
query_posts('post_type=Services&showposts=-1');
if(have_posts()):
while(have_posts()):the_post();
?>
<li <?php if(get_the_ID() == $post->ID) { ?> class="current-item" <?php } ?>><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
<?php endwhile;endif; wp_reset_query();?>
</ul>


Liantas comments:

Arnav,

Your last code is outputting "current item" class for all CPT items listed!

Thanks


Arnav Joy comments:

did you test my code?


Liantas comments:

Yes Arnav... Like I said all items are being listed as "current-item". Do u know how to fix it?


Arnav Joy comments:

try this

<ul class="post-type-items">
<?php
$id = get_the_ID();
wp_reset_query();
query_posts('post_type=Services&showposts=-1');
if(have_posts()):
while(have_posts()):the_post();
?>
<li <?php if($id == $post->ID) { ?> class="current-item" <?php } ?>><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
<?php endwhile;endif; wp_reset_query();?>
</ul>


Arnav Joy comments:

this is your full fele

<?php
$id = get_the_ID();
?>

<div id="content-containers" class="leftside">



<?php if ( have_posts() ) while ( have_posts() ) : the_post(); ?>



<div id="narrow-container" class="make-shadow global-radius">



<div id="narrow-content" class="global-radius">



<div id="sidebar">



<ul class="post-type-items">
<?php
wp_reset_query();
query_posts('post_type=Services&showposts=-1');
if(have_posts()):
while(have_posts()):the_post();
?>
<li <?php if($id == $post->ID) { ?> class="current-item" <?php } ?>><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></li>
<?php endwhile;endif; wp_reset_query();?>
</ul>



</div> <!-- /#sidebar -->



</div><!-- /#narrow-content -->



</div><!-- /#narrow-container -->



<div id="withsidebar-container" class="make-shadow global-radius">



<div id="withsidebar-content" class="global-radius">



<div id="page-<?php the_ID(); ?>" <?php post_class('content'); ?>>



<?php the_content(); wp_reset_postdata();?>



<?php //if ( comments_open() && cloudfw_comments_open() ) {echo '<div class="sector"></div>' ;comments_template();} ?>



</div><!-- /.content -->



</div><!-- /#withsidebar-content -->



</div><!-- /#withsidebar-container -->



<div class="cf"></div>



<?php endwhile; ?>

(...)


Arnav Joy comments:

if you can talk to me then ping me at

skype: arnav.joy

i will make that work for you


Liantas comments:

Same situation!
All listed items still being marked as "current item".


Arnav Joy comments:

can you provide me access to your file I can do it.


Liantas comments:

Arnav solved the issue for us by Skype!
Thanks

2012-01-07

Milan Petrovic answers:

WordPress wp_list_pages and get_pages functions can be used with post types:


<ul class="post-type-items">
<?php wp_list_pages(array("post_type" => "services", "title_li" => "")); ?>
</ul>


Liantas comments:

What about active item highlighting?
<li class="current-item">Service 2</li>

Thanks


Milan Petrovic comments:

It should work fine, but the highlight class is: current_page_item. It can be modified, but would require a big walker php class changes, so better adjust your CSS styling to work with this CSS instead.


Liantas comments:

Not working Milan.

Your code applicated to page single-services.php template:


(...)
<div id="content-containers" class="leftside">

<?php if ( have_posts() ) while ( have_posts() ) : the_post(); ?>

<div id="narrow-container" class="make-shadow global-radius">

<div id="narrow-content" class="global-radius">

<div id="sidebar">

<ul class="post-type-items">
<?php wp_list_pages(array("post_type" => "services", "title_li" => "")); ?>
</ul>

</div> <!-- /#sidebar -->

</div><!-- /#narrow-content -->

</div><!-- /#narrow-container -->

<div id="withsidebar-container" class="make-shadow global-radius">

<div id="withsidebar-content" class="global-radius">

<div id="page-<?php the_ID(); ?>" <?php post_class('content'); ?>>

<?php the_content(); wp_reset_postdata();?>

<?php //if ( comments_open() && cloudfw_comments_open() ) {echo '<div class="sector"></div>' ;comments_template();} ?>

</div><!-- /.content -->

</div><!-- /#withsidebar-content -->

</div><!-- /#withsidebar-container -->

<div class="cf"></div>

<?php endwhile; ?>
(...)



Thanks!


Milan Petrovic comments:

Stupid get_pages function used by wp_list_pages works only if the post type is hierarchical. You need to use some manual display code some other people suggested here.

2012-01-07

Manoj Raj answers:

your question is not clear at least to me. What do you want to list in the sidebar?

posts of custom post type? or categories(custom taxonomy) of custom post type?

2012-01-07

Reland Pigte answers:


<?php $custom_page = get_pages( array( 'post_type' => 'Services', 'sort_column' => 'post_title', 'sort_order' => 'ASC' ) ); ?>
<?php global $post; ?>

<ul class="post-type-items">
<?php foreach( $custom_page as $pages ) : ?>
<li <?php echo ($post->ID == $pages->ID)? 'class="current-item"':''; ?>><?php echo $pages->post_title; ?></li>
<?php endforeach; ?>
</ul>


Please try the code above.

Cheers,


Reland Pigte comments:

sure the code I provided above should work. :)


Liantas comments:

Hello Reland,

Your code isn't working!


Reland Pigte comments:

Maybe you should try changing the post_type, I tested it on my local server 'post_type' => 'page' and it worked perfect like the output that you wanted.

If you wish to let me do it to your site you can contact me on skype (relandpigte)

cheers,

2012-01-07

Francisco Javier Carazo Gil answers:

Hi Liantas,

As Milan says, you can use wp_list_pages and later use a <script> with jQuery to change class depends on active service.


<script>
$('a[hreflang|="<?php echo get_permalink(); ?>"]').addClass("current-item");
</script>