TwentyTwelveのアイキャッチ画像サイズをページごとに変える

今回はTwentyTwelveのアイキャッチ画像サイズをページごとに変えるカスタマイズです。個別記事なら大きなアイキャッチ画像を使用してトップページやカテゴリー等の記事一覧ページでは小さいアイキャッチ画像を使用するというカスタマイズです。

ついでに記事一覧ページでは抜粋記事にしてます。見てもらった方が早いかな?私のトップページやカテゴリーページではアイキャッチ画像がこのように表示されてます(現在は抜粋にはしてません)。

アイキャッチ画像-3

小さなアイキャッチ画像と記事の抜粋になっているでしょ?そして個別記事を表示するとこのように大きなアイキャッチ画像が表示されます。

アイキャッチ画像-4

このように表示するページによってアイキャッチ画像のサイズを変えるカスタマイズをしていきます。ちなみに前回までの記事でアイキャッチ画像のサイズを決めて、記事下に表示するカスタマイズをしました。

さらに記事一覧ページでは抜粋記事にして「続きを読む」を設置できたと思います。

今回はその続きになりますので前回までのカスタマイズをまだしてない方は先にやっておく事をおすすめします。

この3つのカスタマイズの内、アイキャッチ画像の位置を記事下にするカスタマイズだけは必ずやっておいて下さい。今回のカスタマイズは記事下にアイキャッチ画像を設定している前提でのカスタマイズです。

さて、これまでのカスタマイズで記事一覧ページを抜粋記事にしたのですが、設定したアイキャッチ画像が表示されていません。

アイキャッチ画像-6

この抜粋記事の左にサムネイルサイズのアイキャッチ画像を表示できるようにカスタマイズしていきます。

スポンサーリンク

事前にサムネイル画像のサイズを確認しておく

最初に説明しておきますが、トップページや記事一覧ページの画像のサイズはサムネイルサイズというサイズです。これはWordPressの管理画面から「設定」⇒「メディア」で設定したサムネイルのサイズです。これをまず確認しておきます。

アイキャッチ画像-5

私の場合は100pxというサイズに設定しています。初期状態では150pxだったのですが、若干大きいと感じたので少し小さめにしてます。

このサイズを100pxにしておくと抜粋記事の文字量とちょうどいいと思いますが、これは好みの問題ですので、150pxのままでも良いです。一度カスタマイズしてみて大きいと感じたら変更してみて下さい。

それから個別記事で表示するアイキャッチ画像のサイズは前回の記事で設定したのでOKですよね。この2種類のサイズを把握しておいて下さい。これを把握しておくのはカスタマイズ後にサイズが気にいらない時に変更できるようにしておくためです。

ページごとにアイキャッチ画像のサイズを変更する

普通の個別記事では大きいサイズのアイキャッチ画像を表示させ、それ以外の記事一覧ページではサムネイル画像を表示されていきます。今回使うファイルは「content.php」です。前回までのカスタマイズで使ったファイルですので、子テーマには追加されてますよね。

トップページやアーカイブページの記事一覧ページを抜粋記事にするカスタマイズでこのコードを変更しました。

<?php if ( is_search() ) : // Only display Excerpts for Search ?>

これをこのように変更して抜粋記事にしましたよね。

<?php if ( is_search() || is_home() || is_archive() ) : // Only display Excerpts for Search ?>

ここまでは出来ていると思いますので、このコードのすぐ下に次のコードを足します。

<div class="entry-post-thumbnail">
<?php the_post_thumbnail('thumbnail'); ?>
</div>

これで記事一覧ページにメディア設定で設定されている「サムネイルサイズ」のアイキャッチ画像が表示できるようになります。

また、ここのサイズに関しては次のような書き方でサイズを指定する事もできます。

<?php the_post_thumbnail(array(100, 100)); ?>

表示を確認してみると設定したアイキャッチ画像は表示されているのですが、本文がアイキャッチ画像の下から表示されてます。これを画像の右に持ってきたいのです。

アイキャッチ画像-7

この抜粋記事をアイキャッチ画像の右に持ってくるために今度は子テーマのスタイルシート(style.css) に次の記述を付け加えます。

div.entry-post-thumbnail {
float: left;
margin: 0 10px 10px 0;}

これでアイキャッチ画像の右側に抜粋記事が表示されるはずです。完成形は私のブログのようになってます。

記事抜粋-1

もしここで表示されるアイキャッチ画像が正方形でない場合はメディア設定で「サムネイルを実寸法にトリミングする」にチェックを入れてないのが原因だと思われます。その場合はWordPressの管理画面から「設定」⇒「メディア」と進み、「サムネイルを実寸法にトリミングする」にチェックを入れて下さい。

アイキャッチ画像-8

その後改めて画像をアップロードし、再びアイキャッチ画像に設定してみて下さいね。一括でリサイズできるプラグインもありますので、使ってみてもいいかもしれません。

それでは次回はフッター部分のカスタマイズをしていきます。

サイトのアクセスアップや稼ぐためにおすすめの無料レポート

個人的にアクセスアップや検索上位表示に役立った無料レポートです。登録にメールアドレスが必要ですが、フリーメールでもOKです。

ブログの更新はこちらから

TwentyTwelveのアイキャッチ画像サイズをページごとに変える”に48件のコメントがあります。

コメントの反映には時間がかかる場合があります。

内容に問題なければ、下記の「コメントを送信する」ボタンを押してください。

  1. しげぞう 投稿作成者

    サマー様

    返信ありがとうございます。まず、サイトを表示させてリロード(再読み込み)をして下さい。それで反映されていない場合にはCSSをチェックしていきます。「 } 」とか「 ; 」とか1つでも抜けていると反映されないことが多いです。

    また、今回追加した記述よりも前のコードに上記のような「抜け」があるとそれ以降の記述が反映されませんので、これまで追加している記述のチェックも必要かと思います。もし原因を特定できない場合にはサイトのURL教えて下さい。コメント公開時にはURLは削除します。

    それから続きを読むの文言の変更ですが、functions.phpに追加したコード記述の中に「続きを読む」とテキストで書かれている部分があります。その部分を好きな文言に変更して下さい。ただ、functon.phpはちょっとしたミスでサイトが真っ白になってしまう事があります。という訳なので先に現在のfunctons.phpをコピーしておいてから変更して下さい。

    もしミスで真っ白になった場合にはFTPからfunctons.phpを一度元に戻して下さい。

  2. サマー

    しげぞうさま

    度々失礼いたします。

    続きを読む、からの一連のカスタマイズをしているのですが、サムネイルの真横に文章を持ってくる、ができません。style.cssに追記をしても、何も変わりません。

    この一連以外の文字の変更や、リンクの色の変更などのカスタマイズも、style.cssに追記ですよね?こちらもなんとも変わりません。style.cssに何か問題があるのでしょうか?

    それと、「続きを読む」を「read」に変えたいのですができますか??

    宜しくお願いします!

  3. しげぞう 投稿作成者

    pen-chi様

    コメントありがとうございます。サムネイルの位置がずれる問題ですが、これは実際にサイトを見てチェックしないと原因が特定できません。なので、もし良かったら一度サイトのURLを教えて下さいませ。もちろんコメント公開時にはURLは削除しますのでどうぞよろしくお願い致します。

  4. pen-chi

    しげぞう様
    いつもしげぞう様のサイトで勉強させていただいています。
    自分もWordpressをさわり始めたのですが、『サムネイルの表示位置』がずれる現象に困っています。疑わしい部分のヒントをいただけないでしょうか?

    現象は以下の通りです。
    ■記事一覧ページのサムネイル画像の位置が右にずれる
    1.記事一覧ページに抜粋記事を作成する。
     この時点ではサムネイルの表示を設定していないときは、「抜粋記事一覧」の記事の位置は適正です。
    2.記事一覧にサムネイルを表示させる。
     本サイトの通り、以下のコードをの直下に張り付けました。

     するとアイキャッチ画像を設定している記事にはサムネイルの表示はされましたが、サムネイル画像の配置が右にずれてしまいます。
    ※ちょうどサムネイル画像1個分のスペースが挿入されているイメージです。
     また、アイキャッチ画像を設定していない記事は、記事の先頭文字にスペースが挿入されたみたいな表示になります。
    ■サイドバーの人気記事一覧のサムネイルが右にずれる。
    1.popular postsを使って人気記事一覧を表示させています。
    すると『人気記事一覧』のタイトル枠の左端と『サムネイル画像』の左端一致しません。『サムネイル画像』が右にずれてしまいます。

    どうぞよろしくお願いいたします。

  5. しげぞう 投稿作成者

    りっきのすけ様

    返信ありがとうございます。上手く解決されたようで良かったです。

    さて、カテゴリーの最新記事だけ全文表示という方法はこちらの記事で書いてますので、一度試して見て下さい。
    ⇒https://affiliate150.com/new-article-no-excerpt

  6. りっきのすけ

    しげぞう様

    いつも拝見させて頂いております。
    さっそくですが、1つ質問させて下さい。

    ・抜本記事の設定は、おかげ様で上手くできたのですが
     表示されるのがすべて抜本記事になっているので
     トップページだけ抜本記事にならないようにできますか?

     理想は、本サイトのように、カテゴリーのトップページがあり
     下に抜本記事がくるようなイメージです。

    素人の質問で申し訳ないのですが
    ご回答の程よろしくお願いいたします。

  7. Okingatarashi

    しげぞう様

    こんばんは!
    スゴイ。。。今、サイトを確認してみたんです。
    昨日、子テーマ記述をして、反映されず、一度、エクスプローラー閉じてもう一度、見てもダメでリロードして、それでもだめで、コメントに来たのですね。

    PC切る前にしげぞう様のコードをもう一度コピペして
    確認したけどまだ駄目だったんですが今、サイトを見ると反映されています。
    サイトの左上隅にコードが出てしまってはいたのですが。

    頂いたコードを今、コピペしてみたら、
    左角のコードも消えて適度な文字数150字にしたら

    解決です!
    ありがとうございました。ほんとにすごい!!
    そして、ポンコツでごめんなさい。

  8. しげぞう 投稿作成者

    Okingatarashi様

    返信ありがとうございます。子テーマのfunctions.phpはこの記述以外は何もないですよね?それなら一度子テーマのfunctions.phpの中身を全部コピーしておいて元に戻せるようにしておき、コピーできたらfunctons.phpの中身を削除して保存して下さい。functions.phpのファイルだけある感じにしてみて下さい。

    それで、WordPressの管理画面から「外観」⇒「テーマの編集」⇒「functions.php」と進み、以下のコードを追加して保存。

    <?php
    
    //抜粋文の文字数
    function custom_excerpt_length( $length ) {
         return 200; 
    }       
    add_filter( 'excerpt_length', 'custom_excerpt_length', 999 );
    
    ?>

    これで反映されるか試して見て下さい。

    それで反映されない場合ですが、考えられる原因がありまして、既に親テーマの方に抜粋分の文字数を変更する記述があるかもしれません。その場合には親テーマの方を変更する必要があるかな?と思いますので、また連絡下さい。ちなみに使っているテーマは何でしたっけ?それ一緒に教えてもらえると助かります。

  9. Okingatarashi

    しげぞう様

    こんばんは!お世話になります。
    下の↓~↑は xserverのWebFTPからコピーしてきました。
    サイトの左角に 
    //抜粋文の文字数変更function custom_excerpt_length( $length ) { return 200;}add_filter( ‘excerpt_length’, ‘custom_excerpt_length’, 999 );

    って、一列に小さい字で出ちゃうので // の部分を/* */ に変えてみましたがサイト出ないけど
    状況が変わりません。


    [ ファイルの編集 ] – functions.php

    //抜粋文の文字数変更
    function custom_excerpt_length( $length ) {
    return 200;
    }
    add_filter( ‘excerpt_length’, ‘custom_excerpt_length’, 999 );

    保存文字コード Shift_JIS EUC-JP UTF-8 JIS

     

    WebFTP Version 1.3.4  Copyright(C) 2006 BET,Inc.


    面倒なHELP!ごめんなさい。

  10. しげぞう 投稿作成者

    Okingatarashi様

    返信ありがとうございます。fuctions.phpは子テーマに追加する場合には内容を書かずに追加して以下のように書く必要があります。

    <?php
    
    //ここに処理を記述していきます
    
    ?>

    まずはこれが書かれているか確認をしてみて下さい。またそれでもダメな場合には再度コメント下さい。

  11. Okingatarashi

    しげぞう様
    お世話になります。ここ2日程用事があって出かけていました。
    ご返信いただいたのに、返信しなくてごめんなさい。

    functions.php の子テーマ追加の失敗で、真っ白事件を起こしていました。
    真っ白事件に全くビビらずやり直す自分のポンコツさ…気になります…
    子テーマにファイルの追加で「functions.phpは無地」だ。を忘れてました。がっかり。

    無地のファイルを追加して、頂いたコードをコピペしたけどダメでした。
    いっそ100字くらいなら差が分かりやすい。かもと思って100に変えたのですがダメでした。

    ご迷惑様です。宜しくお願いします。

  12. しげぞう 投稿作成者

    Okingatarashi様

    コメントありがとうございます。抜粋文の文字数を変更するという事でいいでしょうか?

    今回はfunctions.phpなんですが、以下の記述を追加です。

    //抜粋文の文字数変更
    function custom_excerpt_length( $length ) {
         return 200; 
    }       
    add_filter( 'excerpt_length', 'custom_excerpt_length', 999 );

    この200という部分が文字数になりますので、数値を変更しながら調整をしてみると良いと思います。

    functions.phpの記述はミスするとブログが真っ白になるので、その場合はFTPからfunctions.phpの記述を元に戻して下さい。もし反映されない場合には再度コメント下さい。

  13. Okingatarashi

    しげぞう様
    こんにちは!毎度!お世話になります。
    HELP!お願いします。下のURLですが、例による「抜けてる」については最初に見るのですが...見過ぎて分らない。。。のでごめんなさい。
    いいはず...ですが全文表示?位表示されてしまいます。

    「 content.php 」の記述

    「 Stylesheet (style.css) 」の記述
    /*一覧表示のカスタマイズ*/
    div.entry-post-thumbnail {
    float: left;
    margin: 0 10px 10px 0;}

    アイキャッチ画像のサイズも大丈夫なんです。文章の量がへんてこです。
    ご教授を宜しくお願いします。

  14. しげぞう 投稿作成者

    もやし様

    コメントありがとうございます。スタイルシートが反映されないのは幾つか原因が考えられます。例えばスタイルシートの記述の途中で「 } 」が1つ抜けているだけでもその後のスタイルは反映されません。特にWordPressの場合は条件分岐のタグでちょっと複雑になっている部分もあるため、「 } 」の閉じ忘れなどが結構あります。

    もし良かったらブログのURLを教えて下さい。タグチェックなどもできますし、原因の特定もできると思います。コメント公開時にはURLは削除しますので、どうぞよろしくお願い致します。

  15. もやし

    初めて投稿します。
    上記の抜枠記事にサムネイル画像を入れて文字を横に配置する方法ですがサムネイル画像まではできましたが最後の記事をサムネイル画像の横に配置するCSSの記述を子テーマのstyle.cssに打ち込んでも反映されずに困っています。
    何故反映されないのでしょうか?

  16. okinagatarashi

    しげぞう様
    こんにちは!重大なミスがありました。
    投稿の編集にアイキャッチ画像を指定するところがありません。
    って、事は…一覧表示にアイキャッチ画像設定のやりようがないですよね?
    一度、テーマのサポートで聞いてみます。
    本当に、ごめんなさい。
    きっと一生懸命考えて下さったと思います。
    私のミスです。本当にごめんなさい。

  17. okinagatarashi

    しげぞう様
    こんにちは。サーバー引っ越しの質問と平行でうるさい感じ…ごめんなさい。
    何もしないで、抜粋記事の一覧表示はされていますが、画像が無くて画像が表示されるようにするにはどうすればいいのでしょうか…

    もし、わかる事があったら是非、教えて下さい。

    下方向中央のStoryの中のbowlをクリックすると出るページです。
    宜しくお願いします。

  18. okinagatarashi

    しげぞう様

    こんにちは!!いつもお世話になっています。
    本当にいつもありがとうございます。

    何がどうなってるのかよく理解できませんが、ちょっとした事だったりするんだね。
    って、理解する事にしたのですが、もう一度、「一覧表示にする」、マシーン語を入れなおしてみました。ら!何と!戻りました!この間のコピペミスってるだっけだポンコツ!事件と同じ?
    お騒がせしました。本当にごめんなさい。
    ただ、やり直してもダメだったから…?は、残りますが、それもつもり事件かもしれません。
    今は、正常みたいなので、又、おかしくなったらHELP!します。
    呆れておいでと思いますが、これからも宜しくお願いします。

  19. しげぞう 投稿作成者

    okinagatarashi様

    コメントありがとうございます。抜粋文の文字数の変更はできるのですが、初期状態のままだと抜粋文は元々文字数が決まっています。なので、ブログの幅によって2行になったり3行になったりします。

    まずは「WP Multibyte Patch」というプラグインが有効化されているか確認をしてみて下さい。それで再度カスタマイズをしてみて反映されるかを確かめてみて下さい。決まった文字数が抜粋文に表示されると思います。それが確認できて文字数の変更をしたいという場合には再度コメント下さい。

    また、それでも反映されない場合もコメントで知らせて頂けると助かります。よろしくお願い致します。

  20. okinagatarashi

    しげぞう様
    毎日状況でごめんなさい。
    昨日位から抜粋記事が一部でなく画像を省いた文字部分が丸っと表示されていて変な感じです。
    再度、コピペし直したのですが、ダメみたいです。英語スタイルと日本語スタイルで文章量が違うんですね。設定した後は逆に一行位しか表示されなくて変な感じでした。

    このページを見て貰えると助かります。
    宜しくお願いします。

  21. 乃風

    しげぞうさん、今度こそうまくいきましたーーーーーー! ありがとうございました! なんか、今すごくうれしいです! 今日はなんかいいことがありそう! 本当にありがとうございました。 

  22. しげぞう 投稿作成者

    乃風様

    返信ありがとうございます。それでは先ほどのコードは削除してこちらに書き換えて見てください。

    .related li {
    height: 215px;
    overflow: hidden;
    }

    ここで高さを調整できるかと思います。

  23. 乃風

    しげぞうさんへ

    いつもありがとうございます。早速やってみたのですが、うまくいきませんでした。子テーマのスタイルシートに下記のコードをコピペした後に、その数字を-900まで少しずつ落としていったのですが、全く反応がありませんでした。どうしたらいいでしょうか?

  24. しげぞう 投稿作成者

    乃風様

    コメントありがとうございます。おそらく関連記事の部分だと思いますので、スタイルシートに次のコードを入れて見てください。文字部分の高さを固定して、それを超えるようであれば隠すというスタイルになります。

    .related-entry {
    height: 215px;
    overflow: hidden;
    }

    このheightが高さになりますので、ここはお好みで調整して下さい。

  25. 乃風

    しげぞうさんへ

    こんにちは。いつもお世話になっております。乃風です。サイト内の感じが変わりましたね。なんか優しい感じがしますね。

    「こちらの記事もオススメです」のところで、各画像の下に6行しか文字が入らないのですが、それを7か8行に増やしたいのですが、どのようにしたらいいのでしょうか?

    最近、記事につけるタイトルが長いので、6行だと文字が収まらず、飛び出してしまうことが昨日分かりました。よろしくお願いします。

  26. 佐々木

    ご回答ありがとうございます。
    やはり難しいですか。私もあきらめず色々試してみようと思います。
    お手数おかけしました。

  27. しげぞう 投稿作成者

    佐々木様

    コメントありがとうございます。返信遅れてすみません。抜粋記事にした時に画像の右にタイトルを配置するという部分なのですが、おそらく可能だとは思うのですが、私の知識不足で上手く配置できませんでした。すみません。色々と試したのですが、タイトル自体のCSSを変更する必要があり、これを変更すると他のページにも影響が及んでしまいます。また、それを上手く配置する場合にはもう少し根本的な部分からカスタマイズが必要かと思いますが、上手い方法が思いつきませんでした。またしばらく勉強し、上手く配置できればまた記事にも追記していきます。参考にならず申し訳ありません。

  28. 佐々木

    はじめまして、いつも参考にさせていただいております。
    ひとつ質問なのですが、抜粋記事にしたときサムネ画像の右側にタイトルと本文を配置するにはどうしたら良いでしょうか。できれば抜粋記事のみタイトルのサイズも変更したいと思っています。

    お忙しいところ恐縮ですが、回答いただけたら幸いです。
    よろしくお願いします。

  29. Kita

    ご回答ありがとうございます。
    なるほど、新記事の更新毎に付け足す感じになるんですか。それだとかなり面倒ですね。
    お時間頂きありがとうございます。

  30. しげぞう 投稿作成者

    Kita様

    コメントありがとうございます。抜粋記事のアイキャッチ画像ですが、抜粋の時だけ画像を変更するのはおそらく可能だと思いますが、かなりの手間がかかるような気がします。ちょっと考えてみましたが、今の私のレベルではベストな方法が思いつきません、すみません。

    やるとするなら新たにトップページを作成し、サイドバーで作成したような形のページを作成するような方法かなと思いますが、1つ1つ画像を入れて抜粋文も自分でコピペしてきて作成。それで続きを読むのリンクをその個別ページへリンクさせるという事なら可能かもしれません。記事数が少ない場合はいいですが、記事が増える度にそのトップページに追加していく形になるので非常に面倒です。

  31. Kita

    一つほど質問失礼いたします。
    抜粋記事のアイキャッチ画像を表示させるところは、任意の画像などでは表示させられないのでしょうか?。その記事に設定したアイキャッチ画像でないと表示できないでしょうか?

    つまり、サイドバーの人気記事一覧のように、個々に設定した画像を表示させれればなと思いまして。すいません、よろしくお願い致します。

  32. S

    しげぞう様

    この度は本当にありがとうございました
    すべて解決できました

    アナリティクスのことまでありがとうございました
    またよろしくお願いします

  33. しげぞう 投稿作成者

    s様

    返信ありがとうございます。スタイルシートですが、一番下の方に「script」のコードが入ってます。スクリプトはスタイルシートに入れると上手く反映されませんので、まずはこの「script」コードを削除して下さい。この「script」コードの下に文章を移動させるコードがあるため、反映されてません。

    なので、「script」コードを削除すればその下のコードも反映されると思われます。また、この「script」コードはGoogleアナリティクスかな?と思いますが、これは「header.php」の「head」~「/head」の間に入れて下さい。

  34. S

    しげぞう様

    この度はありがとうございました
    大半は解決しました!
    ですが、アイキャッチの右に文を置くのだけが、できません
    一応もう一度URLを貼ります

    よろしくお願いします

  35. しげぞう 投稿作成者

    S様

    返信ありがとうございます。ブログを見させて頂いたのですが、1記事が2回重複して表示されますね。これはおそらく「single.php」もしくは「content.php」で記述ミスがあると思います。記事の一覧を表示するのにはループ処理をするのですが、それが2回あるため、2回ループされているのではないかと思います。

    一度「singel.php」と「content.php」をメモ帳などにコピーしておいてバックアップをとっておいて下さい。いつでも元に戻せるようにしておきます。

    それでWordPressの管理画面から「外観」⇒「テーマの編集」と進み、右上に「Twenty Twelveのテンプレートを引き継ぎます」という部分の「Twenty Twelve」のリンクをクリックするとTwenty Twelveの親テーマへ移動する事ができます。

    まずは親テーマへ移動して「single.php」をクリックし、その内容をそのままコピーして子テーマに戻り子テーマの「single.php」をそれに張り替えます。つまりは初期化してみて重複が改善するか試して下さい。もし「single.php」で直らない場合は「content.php」を同じ手順で初期化してみて重複をまずは改善してみて下さい。

    また、画像横の文に関してはスタイルシートにコードを追加する事で上手く行くと思いますが、今スタイルシートを見るとこの記述が見当たりません。なので、スタイルシートに横並びにするコードが入っているか確認してみてください。

  36. S

    しげぞう様
    やはり出来ませんurlを貼ります
    僕のブログ

    よろしくお願いいたします

  37. しげぞう 投稿作成者

    S様

    コメントありがとうございます。一度「Ctrl」と「F5」を一緒に押してリロードするか別のブラウザでも確認してみてください。それで反映されていないという場合にはおそらくコードの記述ミスがあると思われますので、ブログのURLを教えて頂けると原因も分かると思います。お手数ですが、どうぞよろしくお願い致します。

  38. S

    こんばんは
    アイキャッチ関連で問題が出たのでお願いします
    アイキャッチの正方形表示はできているのですが、文が横に表示されません
    この説明のやり方でやったつもりなのですが…

    もう一つあって、本文表示された下に、記事一覧が表示されます
    どうしたらよいでしょうか
    よろしくお願いします

  39. りた

    しげぞう様

    迅速なご返信、誠にありがとうございます。
    ①②共に解決することができました!!本当にいつもありがとうございます。
    ②に関しては、私の勉強不足でした。今度は一度検索ツールで確認して、質問したいと思います。

    また何か質問すると思いますが
    何卒、宜しくお願い致します。

  40. しげぞう 投稿作成者

    りた様

    コメントありがとうございます。一応思い当たる部分を書いてみますね。

    1.アイキャッチ画像について

    アイキャッチ画像に関してはブログを書く画面の右下に「アイキャッチ画像を設定」という項目があります。ここで設定した画像が表示されると思います。普通の記事に直接画像を入れても反映されないと思いますので、「アイキャッチ画像を設定」という部分でアイキャッチ画像を設置してみて下さい。

    もしそれで反映されないのであればお手数ですが、URLを教えて頂けると助かります。

    2.内部リンクのタブに関して

    内部リンクで「同じタブ」「新しいタブ」の切り替えに関しては最近質問が多かったので記事にしましたので参考にしてみて下さいませ。
    リンク先を「新しいタブ」「同じタブ」で開く方法と使い分け

  41. りた

    しげぞう様

    りたです。
    先日はどうもありがとうございました。しげぞう様のブログのお陰様で、順調にブログカスタマイズができております。少し行き詰まったので数点ご質問させて下さい。

    ①記事一覧ページにおけるサムネイルサイズのアイキャッチ画像について
    ブログに書いておりますコードを挿入したのですが、画像が表示されません。下記にありますコメントのようにプラグインを停止して、他ブラウザでも確認したのですが表示されませんでした。
    現在、画像を載せている記事が1つで他記事らは画像を載せておりません。もしかして、これが原因なのでしょうか?

    ②内部リンクをクリックした際に、新しいタブを開かないで記事更新するようにするにはどうすれば良いのでしょうか?

    ご多忙中申し訳ございませんが
    何卒宜しくお願い致します。

  42. hokuto

    早速のご教示ありがとうございました。
    ご指導の通り、プラグインを全て停止したところ、正常に表示ましたので、再度プラグインを一つずつ有効化し、問題なく表示されていることも確認できました。

    このまま様子を見ながら継続してサイト構築していきます。
    今後ともどうぞ宜しくお願い致します。m(_ _)m

  43. poko 投稿作成者

    >hokuto様

    コメントありがとうございます。donsuke様の場合はセミコロンが原因だったようなのでそれとは原因が違うという事ですよね。反映されない原因は環境によって様々ですが、まずはプラグインを一時的に全部停止して、「別のブラウザ」から確認して見る事をおすすめします。もし別のブラウザで反映されているのであればブラウザのキャッシュ、もしくはプラグインが原因かと思われます。

    それでも反映されていないようであればお手数ですが、URLを教えて頂けると助かります。コメント公開時にはURLは削除して公開しますのでよろしくお願い致します。

  44. hokuto

    poko様

    初めまして。
    勝手ながら本記事にはいつも大変お世話になってます。

    唐突で恐縮なのですが、
    「アイキャッチ画像の右側に抜粋記事が表示」されません。。。
    ※donsuke様と同様の症状でございます。

    何度も確認は致しましたので、コピー間違いはないものと存じます。
    何か考えられる要因はございますでしょうか・・・?

    どうぞご助力お願いいたします。

  45. poko 投稿作成者

    >donsuke様

    問題解決良かったです!私もそんなミスが多々あります。HTMLやCSS、最近はjavascript等も勉強してますがちょっとした違いで反映されないのでその度に頭を抱えております(笑)また私自身勉強した事をアウトプットしていきますので今後ともよろしくお願い致します。

  46. donsuke

    poko様
    ありがとうございます!
    その後原因を探っていたところ、CSSの最後にセミコロンを打っておらず、
    それが原因でサイトに反映されていなかっただけでしたので、無事解決致しました。。
    私の知識不足でお騒がせしてしまい大変申し訳ありませんでした。。。
    ご丁寧に対応していただき、本当に感謝しております。ありがとうございました!(><)
    今後もこのサイトを見させていただきながら、カスタマイズの勉強をしていこうと思います!
    またコメントさせて頂くことがあるかもしれませんが、その際は何卒よろしくお願い致します!

  47. poko 投稿作成者

    >donsuke様

    コメントありがとうございます。原因特定が難しいのでもしよかったらブログのURLを教えて頂けないでしょうか?コメント公開時にはURLは削除しますので。実際に見ながら原因を探ってみたいと思います。

  48. donsuke

    初めまして。いつも拝見させて頂いています。
    いきなり質問になってしまって大変恐縮なのですが。。。

    抜粋記事を出して’’続きを読む’’まではすんなりできたものの
    ここから先↓
    div.entry-post-thumbnail {
    float: left;
    margin: 0 10px 10px 0;}
    これでアイキャッチ画像の右側に抜粋記事が表示されるはずです。完成形は私のブログのようになってます。

    がどうしても反映されません。子テーマのstyle.css(このブログで読んだ通りに親テーマをインポートする記述です)の一番後ろにミスなく貼り付けたものの、抜粋記事がサムネイル画像の下にあるままで右側にきません。。。

    なにか考えられる原因はありますでしょうか?
    style.cssの子テーマを一度削除してもう一度やってみたのですが、同じです。。