questions

Shortcode Appearing at top of content

Rate this post

I am currently trying to add a shortcode to my WordPress site but at the moment it is showing at the top of the page instead of the position I placed it at.

Everything is working well apart from this issue.

// function that runs when shortcode is called
    function testimonial_short() { 
        if( get_query_var( 'page' ) ) { 
            $page = get_query_var( 'page' ); 
        } else { 
            $page = 1; 
        }
        $args = array(
            'post_type' => 'drivers',
            'posts_per_page' => 4,
            'paged' => $page
        );
        $products = new WP_Query( $args );
        ?>
        <div class="owl-carousel owl-theme">
        <div class="testimonial-outer">
                <div class="image-col">
                <img class="testimonial-img" src="<?php echo get_field('image');?>">
                </div>
                <!-- image-col -->
                <div class="text-col">
                <h4>
                    <?php echo get_field('name');?>
                </h4>
                <p>
                    <?php echo get_field('testimonial');?>
                </p>
                </div>
                <!-- text-col -->
            </div>
            <!-- testimonial-outer -->
        </div>
        <?php
    } 
    // register shortcode
    add_shortcode('testimonial', 'testimonial_short');

 

✔️Solution:

Your testimonial_short function is not returning the HTML but immediately outputting it. That leads to it appearing on top of the page since the shortcode gets evaluated while nothing was sent yet.

Try:

function testimonial_short(){
    ...
    return "<div>my html</div>";
}

Leave a Reply

Your email address will not be published.

Back to top button