【WordPressループ】offsetを使いつつページ送りさせる方法を教えてください

Question

前提・実現したいこと

WordPressでサイトを構築中ですが、
TOPページの記事の表示を、

【　１　】【　２　】←大きめに表示
【３】　←３件目以降は小さめに表示
【４】　
【５】
・
・
・
というレイアウトにし、ページ送りも設置しようと考えています。
１・２件目を一つ目のループ
３件目以降を二つ目のループで分けて作っています。

二つ目のループは下記の通り記述しました。
(こちらを参考にしました：https://tuono034s.com/web-entry/1975/)

<?php if (have_posts()) : ?>
		<?php
$paged = get_query_var('paged') ? get_query_var('paged') : 1 ;
$perpage = 8;
$perpage = get_option('posts_per_page');
$offset = ($paged - 1) * $perpage + 2;
query_posts('offset=' . $offset)
?>		
<?php while (have_posts()) : the_post(); ?>
				   
      <li>記事内容</li>

<?php endwhile; endif; ?>
<?php wp_pagenavi(); ?>

offsetは変数にしているので影響ないかと思うのですが、
query_postsを使っているためかページ送りがうまく機能しません。
どのような書き方に直すとよろしいでしょうか？
ご教授よろしくお願いします。

ちなみにページ送りはプラグインのWP-PageNaviを使用しています。

Answer 1

そもそもCSSで処理できそうな気がします。

<ul>
<li>記事内容</li>
<li>記事内容</li>
<li>記事内容</li>
<li>記事内容</li>
<li>記事内容</li>
<li>記事内容</li>
</ul>

li:nth-of-type(1),
li:nth-of-type(2) {
    color:red;
}
```**動くサンプル：**[https://jsfiddle.net/q4veg6n0/](https://jsfiddle.net/q4veg6n0/)

---

**追記：**

そもそもデフォルトのループで。
```PHP
<?php 
if ( get_query_var('paged') ) { $paged = get_query_var('paged'); }
elseif ( get_query_var('page') ) { $paged = get_query_var('page'); }
else { $paged = 1; }
$my_count = 0;
if (have_posts()) : while ( have_posts() ) : the_post();
      if ( $paged === 1 && $my_count < 2 ) : ?>
      <li>記事内容</li><?php 
      else: ?>
      <li>記事内容</li><?php 
      endif;
      $my_count++;
endwhile; endif;
wp_pagenavi(); ?>

【[wordpress] get_query_var(‘page’)でページ数を取得できない | BlueBear I/O】
http://blue-bear.jp/kb/wordpress-get_query_varpageでページ数を取得できない/

【WordPressの投稿ループの中で連番をカウントする方法｜株式会社ゼロワンアース】
https://01earth.jp/web-create/wordpress/count-in-loop-in-wp/

Comments

[kudo_a]

ご回答とご提案どうもありがとうございます！
cssも具体的に教えていただきありがとうございました。
有効な手段かと思いますので検討いたします。

欲を言えば２ページ目以降は
【11】←２ページ目１件目の記事
【12】　
【13】
・
・
・
というように１ページ目の横並びで大きく見せるレイアウトを
継承しない方法で作りたかったので、できればPHPで解決したかったのですが
あまり一般的な方法ではないのかもしれませんね…。

offsetを使いつつページ送りさせる方法、引き続き回答を募集しております。
識者の方どうぞよろしくお願い致します。

[kudo_a]

度々ご丁寧にありがとうございます！
実装できました！