admin管理员组

文章数量:1318569

I have a html/php code as shown below which displays list of links coming from wordpress.

html/php:

<header class="entry-header container grid-flex">
    <div class="flex-item -sm-50">
        <button>Thumbs</button>
    </div>
</header><!-- .entry-header -->
<div class="entry-content">
    <?php
    echo "<pre>"; print_r($all_list); echo "</pre>";   // Line A
    echo "<hr>";
    echo "Active List<br>";
    echo "<pre>"; print_r($active_list); echo "</pre>";   // Line B
    echo "<hr>";
    echo "Passive List<br>";
    echo "<pre>"; print_r($passive_list); echo "</pre>";   // Line C
    // Load the thumbnails view
    get_template_part( 'parts/content-list-thumbs' );     // Line D
    ?>
</div>

Line A displays following list of links:

/



/

/

Line B displays following links:

/


Line C displays following links:

/

/

The code inside content-list-thumbs file coming from Line D is:

html/js code:

<ul id="list-thumbs">
    <?php
    while (have_posts()) : the_post();
        ?>
        <li class="list-grid__thumb list-grid__item">
            <a class="list-grid__img-link" href="<?php echo esc_url(get_the_permalink()); ?>">
                <?php if (has_post_thumbnail()) { ?>
                    <?php
                    $image_id = get_post_thumbnail_id(get_the_ID());
                    CPAC\Images\the_img_fit_figure($image_id, 'list-grid__image', '(min-width: 650px) 50vw, 100vw', false); ?>
                <?php } ?>
            </a>
        </li>
    <?php endwhile; ?>
</ul>

The above html/js code displays list of images associated with Line A.

Problem Statement:

What I want to achieve from the html/js code above is I want to display list of images associated with Line B and Line C with a separator.

Line B images


Line C images

本文标签: separate list of programs in htmljavascript coming from php