Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I have created a custom portfolio post type for my wordpress theme, and I have made a shortcode for it too. But when I create a page and use the shortcode to display limited number of my portfolio items, no matter where in the page I insert my shortcode, the portfolio items always stay on top of other contents, I took a look at the source code of the page and for no reason this shortcode is process before any other code is processed on the page.

I even tested it on a post, when the post is viewed on the main blog archive page, the shortcode is processed where I want it to be, but when the article is being viewed as a single article again the shortcode is processed and displayed on top of all the contents of that article or page.

here is the code I used for the shortcode:

    add_shortcode( 'portfolios', 'ub_portfolios_sc' );
    function ub_portfolios_sc ( $atts ) {
    global $post;
    $default = array(
        'type'         => 'post',
        'post_type'    => 'portfolios',
        'limit'        => 12,
        'order'        => 'ASC',
        'orderby'      => 'date',
        'status'       => 'publish',
        'post_columns' => 'three'
    );
    $r = shortcode_atts( $default, $atts );
    extract( $r );

    if( empty($post_type) )
    $post_type = $type;

    $post_type_ob = get_post_type_object( $post_type );
    if( !$post_type_ob )
    return '<div class="warning"><p>No such post type <em>' . $post_type . '</em> found.</p></div>';

    $args = array(
        'post_type'    => $post_type,
        'numberposts'  => $limit,
        'post_status'  => $status,
        'post_columns' => $post_columns,
        'order'        => $order,
        'orderby'      => $orderby
    );
    $posts = get_posts( $args );
    if( count($posts) ):
        echo '<ul id="portfolio-grid" class="portfolio-grid unstyled '.$post_columns.'-cols">';
        foreach( $posts as $post ) : setup_postdata( $post );
        ?>
        <li>
            <a href="<?php the_permalink(); ?>" data-largesrc="<?php if ( has_post_thumbnail() ) { echo ub_featured_img_url('portfolio-fullsize'); } else { ?>http://placehold.it/600&text=<?php _e('No Thumbnails', 'une_boutique'); } ?>" data-title="<?php the_title() ?>" data-button="<?php _e('View Project', 'une_boutique'); ?>" data-description="<?php the_excerpt() ?>">
                <?php if ( has_post_thumbnail() ) { the_post_thumbnail(); } else { ?>
                <img src="http://placehold.it/320&text=<?php _e('No Thumbnails', 'une_boutique'); ?>" alt="no thumbnails">
                <?php } ?>
            <span class="item-title"><span class="arrow-shape-up"></span><?php the_title() ?></span>
            </a>
        </li>
        <?php
        endforeach; wp_reset_postdata();
        echo '</ul>';
    endif;
}

and here is how I created the custom post type in the first place:

add_action('init', 'portfolio_register', 0);

function portfolio_register() {

$labels = array(
    'name' => _x('Portfolios', 'post type general name'),
    'singular_name' => _x('Portfolio Item', 'post type singular name'),
    'add_new' => _x('Add New', 'portfolio item'),
    'add_new_item' => __('Add New Portfolio Item'),
    'edit_item' => __('Edit Portfolio Item'),
    'new_item' => __('New Portfolio Item'),
    'view_item' => __('View Portfolio Item'),
    'search_items' => __('Search Portfolio'),
    'not_found' =>  __('Nothing found'),
    'not_found_in_trash' => __('Nothing found in Trash'),
    'parent_item_colon' => ''
);

$args = array(
    'labels' => $labels,
    'public' => true,
    'publicly_queryable' => true,
    'show_ui' => true,
    'query_var' => true,
    'menu_icon' => get_template_directory_uri() . '/images/sofa.png',
    'rewrite' => true,
    'capability_type' => 'post',
    'hierarchical' => false,
    'menu_position' => null,
    'supports' => array('title','editor','thumbnail','excerpt'),
    'taxonomies' => array('post_tag')
  ); 

register_post_type( 'portfolios' , $args );
flush_rewrite_rules();

set_post_thumbnail_size( 600, 600, true );
}

register_taxonomy("Categories",
array("portfolios"),
    array(
        "hierarchical" => true,
        "label" => __('Categories', 'une_boutique'),
        "singular_label" => __('Category', 'une_boutique'),
        "rewrite" => true
    )
);

add_action("admin_init", "admin_init", 10);

function admin_init(){
add_meta_box("project_date-meta", __('Project Date', 'une_boutique'), "project_date", "portfolios", "side", "low");
add_meta_box("project_client-meta", __('Project Client', 'une_boutique'), "project_client", "portfolios", "side", "low");
add_meta_box("project_link-meta", __('Project Link', 'une_boutique'), "project_link", "portfolios", "side", "low");
}

function project_date(){
global $post;
$custom = get_post_custom($post->ID);
$project_date = $custom["project_date"][0];
?>
<label for="project-date"><?php __('Year:', 'une_boutique') ?></label><br />
<input id="project-date" name="project_date" value="<?php echo $project_date; ?>" size="42" />
<?php
}

function project_client(){
global $post;
$custom = get_post_custom($post->ID);
$project_client = $custom["project_client"][0];
?>
<label for="project_client"><?php __('Project Client:', 'une_boutique') ?></label><br />
<input id="project_client" name="project_client" value="<?php echo $project_client; ?>" size="42" />
<?php
 }

function project_link(){
global $post;
$custom = get_post_custom($post->ID);
$project_link = $custom["project_link"][0];
?>
<label for="project_link"><?php __('Project Link:', 'une_boutique') ?></label><br />
<input id="project_link" name="project_link" value="<?php echo $project_link; ?>" size="42" />
<?php
}

add_action('save_post', 'save_portfolio_details');
function save_portfolio_details() {
global $post;

update_post_meta($post->ID, "project_date", $_POST["project_date"]);
update_post_meta($post->ID, "project_client", $_POST["project_client"]);
update_post_meta($post->ID, "project_link", $_POST["project_link"]);
 }

add_action("manage_posts_custom_column",  "portfolios_custom_columns");
add_filter("manage_edit-portfolios_columns", "portfolios_edit_columns");

function portfolios_edit_columns($columns){
$columns = array(
    "cb" => "<input type=\"checkbox\" />",
    "title" => __('Item Title', 'une_boutique'),
    "year" => __('Project Date', 'une_boutique'),
    "Categories" => __('Categories', 'une_boutique'),
    "thumbnail" => __('Item Preview', 'une_boutique'),
);

return $columns;
 }

// GET FEATURED IMAGE for it's column
function ub_get_featured_image($post_ID) {
$post_thumbnail_id = get_post_thumbnail_id($post_ID);
if ($post_thumbnail_id) {
    $post_thumbnail_img = wp_get_attachment_image_src($post_thumbnail_id, 'thumbnail');
    return $post_thumbnail_img[0];
}
}

function portfolios_custom_columns($column){
  global $post;

  switch ($column) {
case "year":
    $custom = get_post_custom();
    echo $custom["project_date"][0];
break;
case "Categories":
    echo get_the_term_list($post->ID, 'Categories', '', ', ','');
break;
case "thumbnail":
    global $post_ID;
    $post_featured_image = ub_get_featured_image($post_ID);
    if ($post_featured_image) {
        echo '<img src="' . $post_featured_image . '" width="50" height="50" />';
    }
break;
  }
}

Can any tell which part I'm doing wrong?

share|improve this question

1 Answer 1

up vote 1 down vote accepted

You have this code in your shortcode function:

if( count($posts) ):
        echo '<ul id="portfolio-grid" class="portfolio-grid unstyled '.$post_columns.'-cols">';
        foreach( $posts as $post ) : setup_postdata( $post );
        ?>
        <li>
            <a href="<?php the_permalink(); ?>" data-largesrc="<?php if ( has_post_thumbnail() ) { echo ub_featured_img_url('portfolio-fullsize'); } else { ?>http://placehold.it/600&text=<?php _e('No Thumbnails', 'une_boutique'); } ?>" data-title="<?php the_title() ?>" data-button="<?php _e('View Project', 'une_boutique'); ?>" data-description="<?php the_excerpt() ?>">
                <?php if ( has_post_thumbnail() ) { the_post_thumbnail(); } else { ?>
                <img src="http://placehold.it/320&text=<?php _e('No Thumbnails', 'une_boutique'); ?>" alt="no thumbnails">
                <?php } ?>
            <span class="item-title"><span class="arrow-shape-up"></span><?php the_title() ?></span>
            </a>
        </li>
        <?php
        endforeach; wp_reset_postdata();
        echo '</ul>';
    endif;

Shortcodes should return their content.
Change this part into something like this:

if( count($posts) ):
  ob_start();

  echo '<ul id="portfolio-grid" class="portfolio-grid unstyled '.$post_columns.'-cols">';
        foreach( $posts as $post ) : setup_postdata( $post );
        ?>
        <li>
            <a href="<?php the_permalink(); ?>" data-largesrc="<?php if ( has_post_thumbnail() ) { echo ub_featured_img_url('portfolio-fullsize'); } else { ?>http://placehold.it/600&text=<?php _e('No Thumbnails', 'une_boutique'); } ?>" data-title="<?php the_title() ?>" data-button="<?php _e('View Project', 'une_boutique'); ?>" data-description="<?php the_excerpt() ?>">
                <?php if ( has_post_thumbnail() ) { the_post_thumbnail(); } else { ?>
                <img src="http://placehold.it/320&text=<?php _e('No Thumbnails', 'une_boutique'); ?>" alt="no thumbnails">
                <?php } ?>
            <span class="item-title"><span class="arrow-shape-up"></span><?php the_title() ?></span>
            </a>
        </li>
        <?php
        endforeach; wp_reset_postdata();
        echo '</ul>';

  return ob_get_clean();
endif;
share|improve this answer
    
WOW, Thanks, that did solve the problem. Thank you very much –  CapitalH Jun 24 '13 at 9:26
    
Can you explain me what ob_start(); and ob_get_clean(); actually does? I tend to see them a lot lately. –  CapitalH Jun 24 '13 at 9:53
1  
Here are some phptutorial.info reference pages: ob_start and ob_get_clean. –  Mike Madern Jun 24 '13 at 9:56

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

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