0

I've created a WP shortcode to list out pages which has controls to filter via category and also two layout formats. My issue is that the shortcode is not displaying all the pages that I have marked categories against. The 'box' layout is only showing 1 page and then the loop stops. The 'list' layout shows 3/4 pages that have the category applied.

I think my main issue is getting my head around the ob_clean() and ob_start() output buffering methods. I can't seem to figure out what I am doing wrong and I've been pulling my hair out for a few hours (i.e. I've commented out OB on the list format for now).

I'm hoping someone can tell me something obvious that I am doing wrong:

<?php

function display_page_categories() {

    // Create unique taxonomy just for pages
    $tax = array('label' => 'Categories',
        'hierarchical' => true,
        'publicly_queryable' => true,
        'public' => true,
        'show_in_menu' => true, );
    register_taxonomy('pages_category', 'page', $tax);

}
// Initialise cats for pages
add_action( 'init', 'display_page_categories' );

function qut_research_pages_shortcode($atts, $content = null)
{
    $atts = qut_research_subpages_shortcode_atts($atts);

    return qut_research_subpages_shortcode_frontend($atts);
}
\add_shortcode('qut-research-subpages', __NAMESPACE__.'\qut_research_pages_shortcode');

function qut_research_subpages_shortcode_atts($atts)
{
    $defaults = array(
        'sort_by' => 'menu_order',
        'sort_order' => 'asc',
        'layout' => 'boxes',
        'category' => '',
    );

    return array_replace_recursive($defaults, $atts);
}

function qut_research_subpages_shortcode_frontend($atts)
{
    $args = array(
        'post_type' => 'page',
        'posts_per_page' => '-1',
    );

    if (!empty($atts['category'])) {
        $args['pages_category'] = $atts['category'];
    }

    $theme_uri = get_template_directory_uri();

    $loop = new \WP_Query($args);
    $post_featured_image = get_the_post_thumbnail_url($loop->the_post(),'thumbnail');
    $output = '';

    if ( $atts['layout'] == 'boxes' || $atts['layout'] == '' ) {

        ob_start(); ?>
        <div class="row" style="margin-top: 20px">

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

                    <div class="col-xl-2 col-lg-4 col-md-4 col-sm-4 col-xs-6" style="padding: 5px;">
                        <a class="project-subpage" href="<?= the_permalink(); ?>">
                            <figure class="project-box" style="height: 120px; position: relative; background-size: cover; background-image: url(
                            <?php
                            if (get_the_post_thumbnail_url($loop->the_post()) ) {
                                echo get_the_post_thumbnail_url($loop->the_post(),'thumbnail');
                            } else {
                                echo $theme_uri. '/img/qut-logo.svg';
                            }
                            ?>
                                    );">
                                <figcaption style="position: absolute; display: table; height: 35%; width: 100%; background: rgba(0,0,0,0.6); color: white; font-size: 1rem; text-align: center; left: 0; bottom: 0; ">
                                    <div class="site-title" style="display: table-cell; vertical-align: middle; width: 100%; padding: 0px 10px;">
                                        <p style="margin: 0"><?= the_title(); ?></p>
                                    </div>
                                </figcaption>
                            </figure>
                        </a>
                    </div>
        <?php endwhile; ?>
        </div>

    <?php $output .= ob_get_contents();
        ob_end_clean();
        return $output;
        \wp_reset_query();

    } else if ( ($atts['layout'] == 'list') ) {
        //ob_start(); ?>
        <ul style="margin-top:20px">
            <?php while ($loop->have_posts()) : $loop->the_post(); ?>
            <li><a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a></li>
            <?php endwhile; ?>
        </ul>
    <?php }

    \wp_reset_query();
    //ob_end_clean();
 }
0

ob_start() This function will turn output buffering on. While output buffering is active no output is sent from the script (other than headers), instead the output is stored in an internal buffer.

ob_get_clean() Gets the current buffer contents and delete current output buffer.

try this code

function qut_research_subpages_shortcode_frontend($atts)
{
    $args = array(
        'post_type' => 'page',
        'posts_per_page' => '-1',
    );

    if (!empty($atts['category'])) {
        $args['pages_category'] = $atts['category'];
    }

    $theme_uri = get_template_directory_uri();

    $loop = new \WP_Query($args);
    $post_featured_image = get_the_post_thumbnail_url($loop>the_post(),'thumbnail');

    if ( $atts['layout'] == 'boxes' || $atts['layout'] == '' ) {

        ob_start(); ?>
        <div class="row" style="margin-top: 20px">

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

                    <div class="col-xl-2 col-lg-4 col-md-4 col-sm-4 col-xs-6" style="padding: 5px;">
                        <a class="project-subpage" href="<?= the_permalink(); ?>">
                            <figure class="project-box" style="height: 120px; position: relative; background-size: cover; background-image: url(
                            <?php
                            if (get_the_post_thumbnail_url($loop->the_post()) ) {
                                echo get_the_post_thumbnail_url($loop->the_post(),'thumbnail');
                            } else {
                                echo $theme_uri. '/img/qut-logo.svg';
                            }
                            ?>
                                    );">
                                <figcaption style="position: absolute; display: table; height: 35%; width: 100%; background: rgba(0,0,0,0.6); color: white; font-size: 1rem; text-align: center; left: 0; bottom: 0; ">
                                    <div class="site-title" style="display: table-cell; vertical-align: middle; width: 100%; padding: 0px 10px;">
                                        <p style="margin: 0"><?= the_title(); ?></p>
                                    </div>
                                </figcaption>
                            </figure>
                        </a>
                    </div>
        <?php endwhile; ?>
        </div>

    <?php $output = ob_get_clean();
        return $output;
        \wp_reset_query();

    } else if ( ($atts['layout'] == 'list') ) {
        //ob_start(); ?>
        <ul style="margin-top:20px">
            <?php while ($loop->have_posts()) : $loop->the_post(); ?>
            <li><a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a></li>
            <?php endwhile; ?>
        </ul>
    <?php }

    \wp_reset_query();
    //ob_end_clean();
 }
  • Thanks for your help, that did clean up my code quite a bit. My actual problem was the way I was calling the featured images from the page, that was causing all kinds of issues with my code and pointing me in all kinds of false leads... – Ryan Coolwebs Nov 2 '17 at 1:04
0

My actual problem originated from the way I was retrieving the featured image from the page, just the php error reporting wasn't being all that clear about my mistake. Have updated my code within the qut_research_subpages_shortcode_frontend() function to go like:

                    <figure class="project-box" style="height: 120px; position: relative; background-size: cover; background-image: url(
                    <?php
                    if ( has_post_thumbnail() ) {
                        echo get_the_post_thumbnail_url(get_the_ID(),'thumbnail');
                    } else {
                        echo $theme_uri. '/img/qut-logo.svg';
                    }
                    ?>
                        );">

This resolved my issue.

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.