Advanced WordPress

একাধিক লুপে একাধিক কলামে ওয়ার্ডপ্রেস পোস্ট

ধরেন খুশির ঠেলাই আপনি এমন চাইতেছেন যে,

প্রথম কলামে আপনি ১ থেকে ৫ নম্বর পর্যন্ত ৫টি পোষ্ট দেখাতে চান,
দ্বিতীয় কলামে আপনি ৬ থেকে ১০ নম্বর পর্যন্ত ৫টি পোষ্ট দেখাতে চান, আবার
তৃতীয় কলামে আপনি ১১ থেকে ১৫ নম্বর পর্যন্ত ৫টি পোষ্ট দেখাতে চান।

কিভাবে করবেন কাজটি?
সম্পূর্ণ কোড নিচে দেওয়া হল।

<div class="container">
  <div class="row">
    <div class="col-md-4">
    // FIRST LOOP: display posts 1 thru 5
    <?php query_posts('showposts=5'); ?>
    <?php $posts = get_posts('numberposts=5&offset=0'); foreach ($posts as $post) : start_wp(); ?>
    <?php static $count1 = 0; if ($count1 == "5") { break; } else { ?>
    <h2><?php the_title(); ?></h2>
    <?php the_content(); ?>

    <?php $count1++; } ?>
    <?php endforeach; ?>
    </div>

    <div class="col-md-4">
    // SECOND LOOP: display posts 6 thru 10
    <?php query_posts('showposts=5'); ?>
    <?php $posts = get_posts('numberposts=5&offset=5'); foreach ($posts as $post) : start_wp(); ?>
    <?php static $count2 = 0; if ($count2 == "5") { break; } else { ?>

    <h2><?php the_title(); ?></h2>
    <?php the_content(); ?>

    <?php $count2++; } ?>
    <?php endforeach; ?>

    </div>
    <div class="col-md-4">
    // THIRD LOOP: display posts 11 thru 15
    <?php query_posts('showposts=5'); ?>
    <?php $posts = get_posts('numberposts=5&offset=10'); foreach ($posts as $post) : start_wp(); ?>
    <?php static $count3 = 0; if ($count3 == "5") { break; } else { ?>

    <h2><?php the_title(); ?></h2>
    <?php the_content(); ?>

    <?php $count3++; } ?>
    <?php endforeach; ?>	
    </div>
  </div>
</div>

 

উপরের কোড টা সঠিক কাজ করতে আপনার ওয়ার্ডপ্রেসে অবশ্যই বুটস্ট্রাপ কল করতে হবে।

আপনি বুটস্ট্রাপ ছাড়া কাজ টি করতে চাইলে নিচের কোড টি আপনার জন্য।

<div class="column_wrap">
  <div class="column_01">
  // FIRST LOOP: display posts 1 thru 5
  <?php query_posts('showposts=5'); ?>
  <?php $posts = get_posts('numberposts=5&offset=0'); foreach ($posts as $post) : start_wp(); ?>
  <?php static $count1 = 0; if ($count1 == "5") { break; } else { ?>
  <h2><?php the_title(); ?></h2>
  <?php the_content(); ?>

  <?php $count1++; } ?>
  <?php endforeach; ?>
  </div>

  <div class="column_01">
  // SECOND LOOP: display posts 6 thru 10
  <?php query_posts('showposts=5'); ?>
  <?php $posts = get_posts('numberposts=5&offset=5'); foreach ($posts as $post) : start_wp(); ?>
  <?php static $count2 = 0; if ($count2 == "5") { break; } else { ?>

  <h2><?php the_title(); ?></h2>
  <?php the_content(); ?>

  <?php $count2++; } ?>
  <?php endforeach; ?>

  </div>
  <div class="column_01">
  // THIRD LOOP: display posts 11 thru 15
  <?php query_posts('showposts=5'); ?>
  <?php $posts = get_posts('numberposts=5&offset=10'); foreach ($posts as $post) : start_wp(); ?>
  <?php static $count3 = 0; if ($count3 == "5") { break; } else { ?>

  <h2><?php the_title(); ?></h2>
  <?php the_content(); ?>

  <?php $count3++; } ?>
  <?php endforeach; ?>	
  </div>
</div>

সিএসএস দিয়ে কলাম স্টাইলিং

/* three column layout */
div.column_01 {
  float: left;
  clear: none;
  width: 33%;
}
div.column_02 {
  float: left;
  clear: none;
  width: 33%;
}
div.column_03 {
  float: right;
  clear: none;
  width: 33%;
}

 

 

No Comments

    Leave a Reply