Код ниже позволяет список записей/постов/новостей в WordPress разбить на 2 столбца. К примеру, если на странице выводится 9 записей, то первые 5 будут находится в первом столбце, а оставшиеся 4 — во втором.
Суть кода, добавленного к стандартному коду поста, заключается в том, чтобы в определенных местах вставить html-теги, с помощью которых через CSS оформить посты в столбцы.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 |
<?php if (have_posts()) { ?> <?php $i = 0; ?> <?php $per_column = ceil($posts_per_page / 2); ?> <?php if ($wp_query->post_count <= $posts_per_page) $per_column = ceil($wp_query->post_count / 2); ?> <div class="column"> <?php while (have_posts()) { the_post(); $i++; ?> <div class="post"> <h2><a href="<?php the_permalink() ?>" rel="bookmark"><?php the_title(); ?></a></h2> <div class="date"><?php the_time('d.m.Y') ?></div> <div class="entry"> <?php the_excerpt(); ?> </div> </div><!-- .post --> <?php if ($i == $per_column) { ?> </div><!-- .column --> <div class="column right"> <?php } ?> <?php } ?> </div><!-- .column --> <div class="clear"></div> <div class="navigation"> <div class="alignleft"><?php previous_posts_link('Следующие записи') ?></div> <div class="alignright"><?php next_posts_link('Предыдущие записи') ?></div> </div> <?php } ?> |
Ну и CSS-код, который нужно добавить в свой файл стилей:
|
1 2 3 4 5 6 7 8 9 10 11 12 |
.column { float: left; width: 48%; } .column.right { float: right; } .clear { clear: both; height: 0; overflow: hidden; } |
