0

I have this shortcode which works fine with posts but I need to modify it to take arguments for custom post type and custom taxonomy.

<?php
// [blog_posts]
function shortcode_latest_from_blog($atts, $content = null) {
    $sliderrandomid = rand();
    extract(shortcode_atts(array(
        "posts" => '8',
        "columns" => '4',
        "category" => '',
        "style" => 'text-normal',
        "image_height" => 'auto',
        "show_date" => 'true',
        "excerpt" => 'true',
    ), $atts));
    ob_start();
    ?>

        <div class="row column-slider">
            <div id="slider_<?php echo $sliderrandomid ?>" class="iosSlider blog-posts <?php if($style  == 'text-overlay') { ?>slider-center-arrows<?php } ?>" style="min-height:<?php echo $image_height; ?>;height:<?php echo $image_height; ?>;">
                <ul class="slider large-block-grid-<?php echo $columns ?> small-block-grid-2">

                    <?php
                    $args = array(
                        'post_status' => 'publish',
                        'post_type' => 'post',
                        'category_name' => $category,
                        'posts_per_page' => $posts
                    );

                    $recentPosts = new WP_Query( $args );

                    if ( $recentPosts->have_posts() ) : ?>

                        <?php while ( $recentPosts->have_posts() ) : $recentPosts->the_post(); ?>

                        <li class="ux-box text-center post-item ux-<?php echo $style; ?>">
                            <div class="inner">
                              <div class="inner-wrap">
                                <a href="<?php the_permalink() ?>">
                                  <div class="ux-box-image">
                                        <div class="entry-image-attachment" style="max-height:<?php echo  $image_height; ?>;overflow:hidden;">
                                            <?php the_post_thumbnail('medium'); ?>
                                        </div>
                                  </div><!-- .ux-box-image -->
                                  <div class="ux-box-text text-vertical-center">
                                        <h3 class="from_the_blog_title"><?php the_title(); ?></h3>
                                        <div class="tx-div small"></div>
                                        <?php if($excerpt != 'false') { ?>
                                            <p class="from_the_blog_excerpt small-font show-next"><?php
                                                $excerpt = get_the_excerpt();
                                                echo string_limit_words($excerpt,15) . '[...]';
                                            ?>
                                           </p>
                                         <?php } ?>

                                     </div><!-- .post_shortcode_text -->
                                </a>

                                   <?php if($show_date != 'false') {?>
                                                        <div class="post-date">
                                                                <span class="post-date-day"><?php echo get_the_time('d', get_the_ID()); ?></span>
                                                                <span class="post-date-month"><?php echo get_the_time('M', get_the_ID()); ?></span>
                                                         </div>
                                    <?php } ?>
                                </div><!-- .inner-wrap -->
                            </div><!-- .inner -->
                        </li><!-- .blog-item -->

                        <?php endwhile; // end of the loop. ?>

                    <?php

                    endif;
                    wp_reset_query();

                    ?>
                </ul>   <!-- .slider -->

                <div class="sliderControlls dark">
                    <div class="sliderNav small hide-for-small">
                    <a href="javascript:void(0)" class="nextSlide prev_<?php echo $sliderrandomid ?>"><span class="icon-angle-left"></span></a>
                    <a href="javascript:void(0)" class="prevSlide next_<?php echo $sliderrandomid ?>"><span class="icon-angle-right"></span></a>
                    </div>
                </div><!-- .sliderControlls -->
        </div> <!-- .iOsslider -->
    </div><!-- .row .column-slider -->


    <?php
    $content = ob_get_contents();
    ob_end_clean();
    return $content;
}

function string_limit_words($string, $word_limit) {
    $words = explode(' ', $string, ($word_limit + 1));
    if(count($words) > $word_limit)
    array_pop($words);
    return implode(' ', $words);
}

add_shortcode("blog_posts", "shortcode_latest_from_blog");
  • Do you want to show multiple post types at once? or be able to pass a different post type via the shortcode? – gdaniel Feb 13 '15 at 22:15
  • I want to be able to pass a different post type via the shortcode. I prefer not to show multiple post types in order to make the query faster... – Joanna Mikalai Feb 13 '15 at 22:32
1

This part of the code is what defines the arguments that can be passed with the shortcode:

extract(shortcode_atts(array(
        "posts" => '8',
        "columns" => '4',
        "category" => '',
        "style" => 'text-normal',
        "image_height" => 'auto',
        "show_date" => 'true',
        "excerpt" => 'true',
    ), $atts));

This allows you to later on use this values as $posts, $columns and so forth. If no value is passed in the shortcode, the default value will be used. In this case $posts = 8 (number posts to show)

This is the query that gets the posts based on the values passed:

$args = array(
     'post_status' => 'publish',
     'post_type' => 'post',
     'category_name' => $category,
     'posts_per_page' => $posts
);

So, if you want to be able to pick the post type, by passing it via the shortcode, you do something like:

extract(shortcode_atts(array(
            "post_type" => 'post',
            "posts" => '8',
            "columns" => '4',
            "category" => '',
            "style" => 'text-normal',
            "image_height" => 'auto',
            "show_date" => 'true',
            "excerpt" => 'true',
        ), $atts));

You can modify the query to use that value:

$args = array(
     'post_status' => 'publish',
     'post_type' => $post_type,
     'category_name' => $category,
     'posts_per_page' => $posts
);

When writing the shortcode you can do [blog_posts post_type="my_custom_post_type"]

The same idea can be done with the custom taxonomy. If you are only using one custom post type and that will never change, then you can skip the first step and just change the query directly. Also check out the codex to understand how wp_query works, and what values it expects:

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

  • thanks that makes a lot of sense. For the taxonomies, I want to make this a bit more complicated. I want to pass the taxonomy title as a variable on the shortcode. Then the shortcode should look into the category of the current post and display posts in the same category within the taxonomy. Could you help on this one? – Joanna Mikalai Feb 14 '15 at 0:10
  • I am not 100% sure of what you're asking. Are you mixing taxonomies and categories? Can you give an example? – gdaniel Feb 14 '15 at 2:49
  • No. My custom post type has 4 taxonomies. And within those taxonomies are categories (if I am using the right term). I want to specify the name of the taxonomy on the shortcode. Then the shortcode should list posts from the same category (within that taxonomy) that the current post is in. So only 1 category and only 1 taxonomy in a nutshell. – Joanna Mikalai Feb 14 '15 at 13:10

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.