WordPressテーマTCDのカスタマイズを研究するサイト

トップページのブログ一覧とお知らせ一覧の位置を入れ替える

Q.トップページのブログ一覧とお知らせ一覧の左右の位置を反対に表示したい

トップページの中腹に表示されるブログ記事一覧とお知らせ記事一覧の左右を入れ替えることはできますか?また、スマホ表示の際の上下の表示順も入れ替えをしたいです。

A.下記のphpファイルの該当箇所を編集します

①PC表示の際の左右の表示入れ替え

編集するファイル:index.php
編集する箇所:

①NEWSの位置を左から右へ変更

  <?php
       $index_news_num = $options['index_news_num'];
       $args = array('post_type' => 'news', 'ignore_sticky_posts' => 1, 'posts_per_page' => $index_news_num);
       $index_news_list = get_posts($args);
       if ($index_news_list) {
  ?>
  <div class="left">

※最終行の”left”を”right”へ変更します。

②BLOGの位置を右から左へ変更

  <?php
       $index_blog_num = $options['index_blog_num'];
       $args = array('post_type' => 'post', 'ignore_sticky_posts' => 1, 'posts_per_page' => $index_blog_num);
       $index_blog_list = get_posts($args);
       if ($index_blog_list) {
  ?>
  <div class="right">

※最終行の”right”を”left”へ変更します。

②スマホ表示の際の上下の表示順入れ替え

1.下記ファイルの該当箇所をカット(Ctrl+X)します
編集するファイル:mobile/index.php
(ワードプレス管理画面からは直接参照できないファイルなのでFTP等を使用し、編集をする必要があります)
切り取る箇所:

       $index_blog_num = $options['index_blog_num'];
       $args = array('post_type' => 'post', 'ignore_sticky_posts' => 1, 'posts_per_page' => $index_blog_num);
       $index_blog_list = get_posts($args);
       if ($index_blog_list) {
  ?>
  <div id="index_blog">
   <h3 class="headline"><?php echo $options['index_blog_headline']; ?></h3>
   <ol>
    <?php
         foreach ($index_blog_list as $post) : setup_postdata ($post);
    ?>
    <li class="clearfix">
     <a class="image" href="<?php the_permalink() ?>"><?php the_post_thumbnail('size1'); ?></a>
     <?php if ($options['show_date']){ ?><p class="date"><time class="entry-date updated" datetime="<?php the_modified_time('c'); ?>"><?php the_time('Y.n.j'); ?></time></p><?php }; ?>
     <a class="title" href="<?php the_permalink() ?>"><?php the_title(); ?></a>
    </li>
    <?php endforeach; wp_reset_query(); ?>
   </ol>
   <?php if($options['show_index_blog_button'] == 1) { ?>
   <div class="link_button_wrap">
    <div class="link_button"><?php next_posts_link($options['index_blog_button']) ?></div>
   </div>
   <?php }; ?>
  </div>
  <?php }; ?>

2.同ファイル上、下記コードの直上部にペースト(Ctrl+V)します

  <?php
       $index_news_num = $options['index_news_num'];
       $args = array('post_type' => 'news', 'ignore_sticky_posts' => 1, 'posts_per_page' => $index_news_num);
       $index_news_list = get_posts($args);
       if ($index_news_list) {
  ?>
(以下省略)

関連記事

TCD LABO ご利用上の注意

TCD LABO(ティーシーディー・ラボ)に掲載しているTCDテーマのカスタマイズ情報のご利用にあたっては、必ずカスタマイズするファイルのバックアップをご用意の上、ご利用者様責任において実施していただきますようお願いいたします。

カスタマイズの実施により生じたいかなる不具合等についてもTCD LABOはその責任を負いかねます。
何卒ご理解、ご了承の上、当サイトをご活用いただけますようお願い申し上げます。

お問合せ・ご要望

TCDLaboへのお問合せやご要望は
ご連絡フォーム をご利用ください。