1

「ポートフォリオ」カスタム投稿タイプの WP ループをクエリし、返されたポートフォリオ投稿を 3 つのグループに分けたい (つまり、3 つの投稿ごとに div をラップする)。

次に、2 つのグループごとに 3 つのグループを別の div にラップします。

たとえば、合計 11 件のポートフォリオ投稿があった場合、このクエリの目的の html 出力は次のようになります。

// This is the HTML I'd like to generate on my portfolio posts archive page. This is assuming there are a total of 11 posts in the database:

<div id="page_wrap">

<div id="wrap_6_posts">

    <div id="wrap_3_posts" class="top-row">
        <article class="portfolio-post FIRST"> Post 1 </article>
        <article class="portfolio-post"> Post 2 </article>
        <article class="portfolio-post"> Post 3 </article>
    </div>

    <div id="wrap_3_posts" class="bottom-row">
        <article class="portfolio-post FIRST"> Post 4 </article>
        <article class="portfolio-post"> Post 5 </article>
        <article class="portfolio-post"> Post 6 </article>
    </div>

</div>

<div id="wrap_6_posts">

    <div id="wrap_3_posts" class="top-row">
        <article class="portfolio-post FIRST"> Post 7 </article>
        <article class="portfolio-post"> Post 8 </article>
        <article class="portfolio-post"> Post 9 </article>
    </div>

    <div id="wrap_3_posts" class="bottom-row">
        <article class="portfolio-post FIRST"> Post 10 </article>
        <article class="portfolio-post"> Post 11 </article>
    </div>

</div>

私はPHPが初めてなので、他の同様のシナリオからいくつかのコードをつなぎ合わせようとしていますが、特定の問題に対処するスレッドが見つからなかったので、自分がやっていることが正しいかどうかわかりません. 私はかなり迷っています

これが私が試したことです：

<?php
$args = array( 'post_type' => 'portfolio' );
$loop = new WP_Query( $args );
$i = 0;

echo'<div id="page_wrap"><div id="wrap_6_posts"><div id="wrap_3_posts" class="top-row">';

while ( $loop->have_posts() ) : $loop->the_post();

    if ($i % 6 == 0 && $i > 0) {
        echo '</div></div><div id="wrap_6_posts"><div id="wrap_3_posts" class="top-row">';
    } else if ($i % 3 == 0 && $i > 0) {
        echo '</div><div id="wrap_3_posts" class="bottom-row">';
    }
    echo '<article class="portfolio-post' . ($i % 3 == 0 ? ' first' : '') . '">';

?>
        <h2 class="headline portfolio-headlines" rel="bookmark">
            <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
        </h2>
<?php
endwhile;

    echo '</article>';
    $i++;

echo '</div></div></div>';
?>

出力は次のようになります。

<div id="page_wrap">
<div id="wrap_6_posts">
    <div id="wrap_3_posts" class="top-row">
        <article class="portfolio-post first">      
            post 1

        <article class="portfolio-post first">      
            post 2

        <article class="portfolio-post first">      
            post 3

        <article class="portfolio-post first">      
            post 4

        <article class="portfolio-post first">      
            post 5

        <article class="portfolio-post first">      
            post 6

        <article class="portfolio-post first">      
            post 7

        <article class="portfolio-post first">      
            post 8

        <article class="portfolio-post first">      
            post 9

        <article class="portfolio-post first">      
            post 10

        <article class="portfolio-post first">      
            post 11
        </article>

    </div>
</div>

誰でもこれを理解できますか？ロジックは私にとって課題ですが、構文を正しくして、コードが WP と効果的に通信していることを確認するだけでも課題が増えます。

助けてくれてありがとう！

4

2 に答える 2

2

@jothikannan の助けを借りて、ループ$i++内にインクリメント カウンターを含めるという彼の指示に従って、ループ内whileにクロージングを含める必要があることも発見しました。echo '</article>';while

したがって、最終的なコードは次のとおりです。

<?php
$args = array( 'post_type' => 'portfolio' );
$loop = new WP_Query( $args );
$i = 0;

echo'<div id="wrap_6_posts">' . "\n" . '<div id="wrap_3_posts" class="top-row">' . "\n";

while ( $loop->have_posts() ) : $loop->the_post();

    if ($i % 6 == 0 && $i > 0) {
        echo '</div>' . "\n" . '</div>' . "\n" . '<div id="wrap_6_posts">'  . "\n" . '<div id="wrap_3_posts" class="top-row">' . "\n";
    } else if ($i % 3 == 0 && $i > 0) {
        echo '</div>' . "\n" . '<div id="wrap_3_posts" class="bottom-row">' . "\n";
    }

echo '<article class="portfolio-post' . ($i % 3 == 0 ? ' first' : '') . '">' . "\n";

?>
<h2 class="headline portfolio-headlines" rel="bookmark">
    <a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
</h2>
<?php

echo '</article>' . "\n";
$i++;

endwhile;

echo '</div>' . "\n" . '</div>';
?>

これにより、私のポートフォリオ アーカイブ ページの次の html が正常に出力されます (この例では、私のデータベースには 8 つのポートフォリオ投稿しかありません)。

<div id="wrap_6_posts">
<div id="wrap_3_posts" class="top-row">
<article class="portfolio-post first">
<h2 class="headline portfolio-headlines" rel="bookmark">

    <a href="http://example.com/portfolio/post-1/">Post 1</a>

</h2>

</article>
<article class="portfolio-post">
<h2 class="headline portfolio-headlines" rel="bookmark">

    <a href="http://example.com/portfolio/post-2/">Post 2</a>

</h2>

</article>
<article class="portfolio-post">
<h2 class="headline portfolio-headlines" rel="bookmark">

    <a href="http://example.com/portfolio/post-3/">Post 3</a>

</h2>

</article>
</div>
<div id="wrap_3_posts" class="bottom-row">
<article class="portfolio-post first">
<h2 class="headline portfolio-headlines" rel="bookmark">

    <a href="http://example.com/portfolio/post-4/">Post 4</a>

</h2>

</article>
<article class="portfolio-post">
<h2 class="headline portfolio-headlines" rel="bookmark">

    <a href="http://example.com/portfolio/post-5/">Post 5</a>

</h2>

</article>
<article class="portfolio-post">
<h2 class="headline portfolio-headlines" rel="bookmark">

    <a href="http://example.com/portfolio/post-6/">Post 6</a>

</h2>

</article>
</div>
</div>
<div id="wrap_6_posts">
<div id="wrap_3_posts" class="top-row">
<article class="portfolio-post first">
<h2 class="headline portfolio-headlines" rel="bookmark">

    <a href="http://example.com/portfolio/post-7/">Post 7</a>

</h2>

</article>
<article class="portfolio-post">
<h2 class="headline portfolio-headlines" rel="bookmark">

    <a href="http://example.com/portfolio/post-8/">Post 8</a>

</h2>

</article>
</div>
</div>

成功！ありがとうございました！

于 2013-08-08T17:53:09.793 に答える