D
D
Denis2021-09-19 11:35:33
WordPress
Denis, 2021-09-19 11:35:33

How to show a post in a modal window on button click?

There is a slider that displays all the posts of the taxonomy:

<div class="swiper-wrapper">
    <?php
    global $wp_query;

    $wp_query = new WP_Query(array(
        'post_type' => 'our_team',
        'posts_per_page' => '100',
    ));

    while( have_posts() ){
        the_post();

        ?>
        <div class="swiper-slide">
            <div class="a-card">
                <button data-toggle="modal" data-target="#personal-1" type="button" post_id="<?php the_ID(); ?>" id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
                    <?php the_post_thumbnail(array(318, 250)); ?>
                    <div class="a-card__content">
                        <h3><?php the_title(); ?></h3>
                        <p><?php the_field('a-home-subtitle'); ?></p>
                    </div>
                </button>
            </div>
        </div>

        <?php
    }
    wp_reset_query();
    ?>
    <!-- End --> 
</div>

Posts go as links, each with its own ID, the question is:

When you click, a modal window opens made on bootstrap 4, how to display all posts from the category by the id that we clicked, just by id I displayed it like this:

<div class="swiper-wrapper">
    <?php
                                    // параметры по умолчанию
    $posts = get_posts( array(
        'numberposts' => 1000,
        'category'    => 2,
        'orderby'     => 'date',
        'order'       => 'DESC',
        'post_type'   => 'post',
        'suppress_filters' => true,
    ) );

    foreach( $posts as $post ){
        setup_postdata($post);
        ?>
        <div class="swiper-slide">
            <article class="article-card">
                <div class="article-thumb">
                    <?php if ( has_post_thumbnail()) { ?>
                       <a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>" >
                        <?php the_post_thumbnail(array(320, 250)); ?>
                    </a>
                <?php } ?>
            </div>
            <div class="article-card__content">
                <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                <?php the_excerpt(); ?>
            </div>
            <div class="article-footer">
                <div class="date"><?php echo get_the_date(); ?></div>
                <a href="<?php the_permalink(); ?>" class="more-link">Подробнее</a>
            </div>
        </article>
    </div>
    <?php
}

wp_reset_postdata();
?>
</div>

Where can I read about a possible solution to this problem? Or an example would be great.

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question