Slide in Panel Wordpress Post

Question

I'm trying to add posts I have in the category to open via Slide Panel without going into a single post how can I do this?

The Demo Slide In Panel can be viewed below:

DEMO SLIDE IN PANEL

I tested it on my website but only the first post appears in every post that clicks.

My code:

<?php
$args = array(
    'meta_key'=> 'ecpt_toparticle',
    'showposts' => 5,
    'category__in' => $cat
);
$sticky_query = new WP_Query( $args );
while ( $sticky_query->have_posts() ) : $sticky_query->the_post();
?>
            <div class="border"> 
            <a href="<?php the_permalink();?>" class="myimages js-cd-panel-trigger" data-panel="main">
            <?php the_post_thumbnail('300x300');?>
            </a>

            <div class="col-10">
            <div class="title"><?php the_title() ?></div>
        </div>
    </div>

    <?php  endwhile; wp_reset_postdata(); ?>

    <div class="cd-panel cd-panel--from-right js-cd-panel-main">
        <header class="cd-panel__header">
        <h1><?php the_title() ?></h1>
        <a href="" class="cd-panel__close js-cd-close">Close</a>
        </header>
        <div class="cd-panel__container">
        <div class="cd-panel__content">
        <div class="myimages">
        <?php the_post_thumbnail('600x350');?>
        </div>
        <p><?php the_content(); ?></p>

        </div> <!-- cd-panel__content -->
    </div> <!-- cd-panel__container -->
</div> <!-- cd-panel -->

You will easily understand it through screenshots:

Answer 1

The reason why your query fails is the following. You are finishing the loop before your cd-panel with

<?php  endwhile; wp_reset_postdata(); ?>

which is correct. However, after that you are simply using

<?php the_title(); ?>, <?php the_content(); ?>

which is just a single template tag, and in your case, outputs the title of the first post of the last category you've queried.

The solution:

• You have to load the post content's via a wp ajax call (on click on that accordeon tab), or

• open up another loop before the cd-panel, get all posts and hide/show them with css

The second is more load heavy, but not that complicated.