AN(tcd014)の固定ページにアイキャッチを入れる方法

AN(tcd014)の固定ページにアイキャッチを入れる方法

AN(tcd014)では、投稿ページにのみアイキャッチを設定できます。固定ページにも、アイキャッチを入れたい場合は、phpファイルをカスタマイズする必要があります。

カスタマイズをする場合の注意
必ずバックアップを取って自己責任でお願いします。もし何らかのトラブル等がおこっても、私は一切の責任を負えませんのでご了承ください。

変更するphpファイルは、固定ページテンプレート(page.php)です。

記事タイトルの次の行に、次の1行を追加します。

<?php if ( has_post_thumbnail() and $page=='1') { if ($options['show_thumbnail']) : ?><div id="post_image"><?php the_post_thumbnail('large'); ?></div><?php endif; }; ?>

この1行は、single.phpの46行目あたりに書いてあるものと一緒ですので、single.phpからコピーするといいと思います。

変更前

<div class="post" id="page">
  <h2 class="page_headline"><?php the_title(); ?></h2>
  <?php the_content(__('Read more', 'tcd-w')); ?>
  <?php wp_link_pages(); ?>
 </div><!-- END .post -->

変更後

<div class="post" id="page">
  <h2 class="page_headline"><?php the_title(); ?></h2>
  <?php if ( has_post_thumbnail() and $page=='1') { if ($options['show_thumbnail']) : ?><div id="post_image"><?php the_post_thumbnail('large'); ?></div><?php endif; }; ?>
  <?php the_content(__('Read more', 'tcd-w')); ?>
  <?php wp_link_pages(); ?>
 </div><!-- END .post -->

表示されるアイキャッチ画像のサイズなのですが、CSSで max-width:618px; が指定されています。

#post_image img { background:#ebebeb; padding:10px; max-width:618px; }

ですから基本的には、横幅が618px以下の画像を選択した場合はそのままの大きさで表示され、横幅が618pxを超える大きさの画像を選択した場合は、画像の縦横の比率を保ったまま、横幅が最大618PXになるように縮小されて表示される、と考えてもらえればいいと思います。

もし、記事内に表示されるアイキャッチ画像をもう少し小さくしたいという場合には、max-width の値を450pxや300pxなど、お好みで小さくするといいです。

関連記事

コメント

  • トラックバックは利用できません。
  • コメント (4)
    • やまもとみつひろ
    • 2015年 6月 03日

    こんにちは!私はOpinionを使っています。
    こちらの会社の方にカスタマイズの質問をしていたら、
    まりーさんのサイトを紹介してもらいました。
    ANもOpinionも基本的には構造はそんなに変わらないらしいです。

    僕としては、スマホで見た時もタイトルロゴを画像表示させたいなーと思っていますが、
    もしその方法を御存知であれば教えてください!

      • まりー
      • 2015年 6月 03日

      やまもとみつひろさん、コメントありがとうございます。

      スマホで見た時にも、ロゴ画像を表示させる方法は、
      以下の記事で紹介しています。
      http://marie08.net/tcdan/tcdan-headerlogo/

      記事は、ANのCSSですのでご注意ください。
      基本的な構造は変わらないということは、たぶんですが、
      opinionのCSSにも、#logo img { display:none;} のような記述があると思います。

      その部分を修正してみてくださいね。
      何かわかりづらいところがあれば、
      またお声かけください。

    • rinne
    • 2015年 12月 02日

    はじめまして。最近TCDテンプレに変えたばかりなので
    とても参考にさせてもらっています。

    質問があるのですが
    文章の最後にアドセンスコードを設置したいのですが
    単一記事の投稿のどの部分に
    設置したらよいでしょうか。

    他のTCDテンプレだと の
    後に設置するだけで良かったのですが014も同じように設置すると
    どうしても点線の下になってしまいます。

    教えていただけたら助かります。

      • まりー
      • 2015年 12月 02日

      rinneさん、こんにちは。
      コメントありがとうございます。

      記事下に広告をいれるなら、テーマオプションを使われてはどうでしょうか。

      「詳細記事の広告」の「詳細記事ページ下部に表示する広告」
      ここに、アドセンスコードを張ると、点線より上に表示されるはずです。

      一度、試してみてくださいね。

      もし、sigle.php に直接コードを張る場合は、
      </div><!– END .post –> のすぐ上に張るといいと思います。

サイト内検索

おすすめ記事

ページ上部へ戻る