スマートダディ目指して修行中。>アイキャッチ画像をRSSで表示できるようにWordPressをちょっとカスタマイズしてみる。2015/02/05RSSフィードリーダ(Feedly)でアイキャッチ画像が表示されなかったり、記事中の別の画像が表示されたりします。したら、RSS(更新情報)へアイキャッチ画像情報を入れていないのが原因かもしれないということで、試しに入れてみることにしました。RSSリーダでアイキャッチ画像が表示されないのねSiSO-LABのウィットなアイキャッチ画像が残念なことにSiSO-LABにて記事を書くときは、なるべく記事の冒頭には内容がザクっとわかるようなポンチ絵っぽいイラストを入れています。「ウィットな」と自分で書いてしまうと、「うーん、気が利いているような、利いていないような...でも、時々、我ながら名作っぽいのもあるかな」という感じでちょっと恥ずかしくなりますが、語感が良かったのでちょっと使ってみました。RSSフィードリーダはFeedlyを使っていますが、自分のブログも登録しています。登録しておくと、登録数が見れるのでちょっとうれしかったり...。そんなわけでSiSO-LABの更新情報も見えますが、前々から不思議なことが。違う画像が表示されたり表示されなかったりRSSフィードリーダで自分のブログの更新情報を見ていると、アイキャッチ画像とか記事冒頭にある画像とは違う画像が表示されたりします。実際の記事は、以下のようにいつものポンチ絵がアイキャッチ画像として登録してありますし、レイアウトも先頭になっています。他にも、画像がまったく表示されないことがあったり、さらには、ちゃんとアイキャッチ画像が表示されることもあります。アイキャッチ画像表示とRSSフィード「抜粋のみを表示」ネットでざくっと調べてみたところ、アイキャッチ画像をRSS情報として出力しているかどうかが関係あるようでした。SiSO-LABでは、「RSS/Atomフィードでの各投稿の表示」は「抜粋のみを表示」としています。「抜粋のみを表示」とすると記事の冒頭部分だけ(「続き」より前というわけでもないようですが)がRSSに出力されます。SiSO的事情ですが、RSSフィードリーダでガンガン記事を読んでいくときに、全文がドバっと表示されるとびっくりしてしまいます。あ、いや、一気に次の記事情報が下に下がってしまいスクロールがめんどくさいと感じるので、短めに表示されるのがうれしいかな、と。そんなわけで、まずは自分から?ということでこのようにしています。自分のブログはどんなRSS情報を出力しているのか確認カスタマイズテスト環境用のデータでRSSデータの表示させていますので、内容はちょっと古いですが、こんな感じの情報が出力されます。ブログのURLの後ろに、「/feed/」とか、「/?feed=rss2」とか付け加えると表示されます。なんか、サーバ環境だと前者、ローカル環境だと後者じゃないとRSS情報にアクセスできないのがちょっと不思議。勉強不足なので、これもボチボチっと調べていこうと思います。先人の方々がいろいろなやり方で解決してくださっていたので、その中から、いつものごとくプラグインは使わず、WordPress(テーマ)のコードをカスタマイズすることで対応することにしました。そんなに多機能なものは不要なので、それよりはコンパクトで負荷の少なくて楽しそうな方法ということで、コードのカスタマイズします。参考情報もう、しっかりとほぼそのままコピペすればいいぐらいのコードが公開されていました。JUMP-UP.INFO「私はできるだけプラグインを多用してfunctions.phpは汚したくない派」だそうですが、確かにプラグインを多用した方がテーマの切り替えやバージョンアップが簡単ですよね。プラグインに詳しくなってきたら、なるべくプラグインでやるようにしようかなぁ。ソースコードは以下のようになります。functions.phpの最後に追加すればOKです。functions.phpはテーマがインストールされているディレクトリ内にあります。ローカル環境でXAMPP以下にWordPressをインストールしている場合は、「C:\xampp\htdocs\wp-content\themes\gush」になります(「gush」はテーマ名です)。'rss_post_thumbnail');さて、表示結果ですが、こんな感じでRSS情報に画像が入ってくれます。実は、一番上に表示されている記事だけ、テスト用にアイキャッチ画像を定義していません。これもちょっと手を加えてみようと思います。アイキャッチ画像が無かったらno-img.pngを表示するよう改造アイキャッチ画像が記事に設定されていない場合、そのサイトで指定している「画像なしファイル」を表示する方が望ましいと思います。そんなわけで、has_post_thumbnail($post->ID)にてサムネイル(昔はアイキャッチ画像のこともサムネイルと呼んでいたそうです)を確認した時に、もし、アイキャッチ画像が設定されていなかったら、「images」ディレクトリ内の「no-img.png」を表示するようにしてみました。以前、gushのheader.phpを編集してヘッダー画像を表示するようにした時に覚えた関数ですが、「get_template_directory_uri()」を使うと、「テーマ(テンプレート)のURI」を取得することができます。そのまま実行するとURIの文字列が得られますので、「/images/ファイル名」と連結してIMGタグを完成させます。'rss_post_thumbnail');本当は画像表示する時にwidth等の他のパラメータも指定した方がいいと思いますので、必要に応じて追加してください。これでアイキャッチ画像が設定されていない記事は、「no-img.png」が表示されるようになります。いわけか、ここ最近のブログ更新情報、Feedlyではちゃんとアイキャッチに設定した画像が表示されているので、本当に効果があったのかは微妙ですが...しばらく注意してして見ることにします。しまくるメンドイ細かな理由はまだはっきりと知りませんが、キャッシュ系プラグインの有り無しには関係なく、WordPress内でRSS情報をキャッシュ?しているみたいです。ブラウザのキャッシュをマメにクリアしてやれば、だいたい期待通りになります(ならない部分もあります)。今回の研究題材、実はRSSフィードリーダで表示する時に画像が表示されなくて、ということ以外にもう1つ理由があります。現在、新しいWordPressのサイトを準備中ですが、その中で、「他のブログの更新情報を別のブログで表示する」という機能を実装する予定です。兄弟サイトなので、お互いの更新情報が少しぐらい表示されていた方が楽しいかな?と思います。表示方法も、他の「新着記事」や「人気記事」と同じ書式で表示させる予定です。現在のSiSO-LABが、新着記事も人気記事も画像入りで表示させているので、これに合わせるため楽しく試行錯誤してました。メドが付いたのでグイグイっと記事をアップしていきます。WordPressで画像付きRSSを出して別ブログで更新情報を表示!複数のブログを運用していると、お互いのブログで更新情報を表示したくなります。本当はWordPressのネットーワーク機能(マルチサイト)を使えばスマートにできる予感がするのですが、まだまだスキルが足りないので、画像付きのRSSを出力するようにして、別ブログに新着情報として表示できるように頑張ってみました。アイキャッチ画像をRSSで表示できるようにWordPressをちょっとカスタマイズしてみる。WordPressをカスタマイズして、外部ブログのRSS情報をアイキャッチ画像付きで自分のブログに更新情報を表示。WordPressで外部ブログのRSSを表示したら日付が1日ずれちゃう。LINKTweetPocket関連前後記事PREV:WordPress初心者がブログを作るよ♪ローカル環境のためのWordPressの初期設定変更NEXT:WordPressをカスタマイズして、外部ブログのRSS情報を画像付きで更新情報をブログに表示。関連記事2014.05.11やっぱり簡単だった!無料で透過マルチアイコンを作る方法。サイトにFaviconつけてゴキゲン。2014.06.06WordPressで記事のカテゴリやタグを一括で追加する方法~そういえばカテゴリを追加するのを忘れていました。2014.10.22WordPressでカテゴリ別のRSS(フィード情報)を取得する方法。プラグイン不要でさすがWordPress!な気分。...」で失敗する場合の対処方法。アイキャッチ画像をRSSで表示できるようにWordPressをちょっとカスタマイズしてみる。03:56SiSOさん、お久しぶりです。m(__)m以前以下の記事にコメントさせて頂きましたizuと申します。http://siso-lab.net/wp-ss-ins-post-to-post/今回もこちらの記事を拝見させて頂きました。当ブログにてこちらの記事を紹介させて頂いています。http://izu.wpblog.jp/post-3800/もし、何か不都合や修正点などがありましたらご連絡頂けましたら幸いです。05:55izuさん>コメントありがとございます。以前はあまりお役にたてなくてすいませんでした。この記事は、姉妹サイトにて相互に更新情報を掲載するためにあれこれやったものです。BAR」の更新情報が表示されていますが、これは画像付きのRSSを使って表示させています。複数ブログ運営されるようなことがあれば、こちらも参考にしていただければと思います。コメントをキャンセルメールアドレスが公開されることはありません。*サイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。date*PREV:WordPress初心者がブログを作るよ♪ローカル環境のためのWordPressの初期設定変更NEXT:WordPressをカスタマイズして、外部ブログのRSS情報を画像付きで更新情報をブログに表示。PROFILESiSO-LAB所長兼研究員のSiSOです。あ、趣味のサイトなので実体はありませんけど...。「結果は大事だけど、やっぱり経過を楽しみたいよね!」ということで、雑多な内容で紆余曲折試行錯誤している様子を楽しんで頂ければ幸いです。「たいせつなともだち」ピアノ譜アレンジ中。譜面はベネッセで無料プレゼントしています。「たいせつなともだち」ピアノ譜アレンジ中。譜面はベネッセで無料プレゼントしています。「たいせつなともだち」ピアノ譜アレンジ中。譜面はベネッセで無料プレゼントしています。「たいせつなともだち」ピアノ譜アレンジ中。譜面はベネッセで無料プレゼントしています。「たいせつなともだち」ピアノ譜アレンジ中。譜面はベネッセで無料プレゼントしています。関連人気記事WordPressの画像ファイル保存先ってどうなっているの?保存先の変更方法とか。投稿されたFFFTPでメディアファイルを一括ダウンロードできない?設定変更で回避する方法とか。投稿されたやっぱり簡単だった!無料で透過マルチアイコンを作る方法。サイトにFaviconつけてゴキゲン。投稿されたWordPressで記事引用を簡単に表示しちゃう方法...WordPress4.4から埋め込み(embed)機能に対応していたのね。投稿されたWordPressのoEmbed、表示されない時があって不安定?なのでプラグインPz-LinkCardにしてみたよ。投稿されたローカル環境にセットアップしたWordPress(XAMPP上)の表示確認を、他のパソコンやスマホからアクセスする方法とか。投稿されたWordPressをカスタマイズして、外部ブログのRSS情報を画像付きで更新情報をブログに表示。ネットオウル関連新着記事ネットオウル(レンタルサーバー)のWordPressへ海外からログインする方法。海外から実験してみました。2018.03.07WordPressのoEmbed、表示されない時があって不安定?なのでプラグインPz-LinkCardにしてみたよ。2017.10.21WordPressで記事引用を簡単に表示しちゃう方法...WordPress4.4から埋め込み(embed)機能に対応していたのね。2017.03.17WordPress、サイトのアイコン表示は標準機能だけで設定できるのね...小さな画像でも大丈夫。2016.04.18新しいWordPressブログを準備中。カスタマイズ向き国産テンプレートGush2と定番プラグインの話とか。2016.03.07WordPressローカル環境を簡単に2クリックだけでインストールする方法。2016.03.05多趣味なブログ運営は分けるべき?サブドメインがいい?ディレクトリがいい?方針検討中。プラグインでWordPress記事のパーマリンクを別サイトのURLに設定する方法。PC百均浪漫/SiSO-LAB更新情報ダイソー光沢紙のはがき(郵便番号枠入り)インクジェットプリンタ、4年経ってもパッケージ変わらずの定番商品。2019.10.01なんと3個で100円!(税抜)、煮豚風煮たまご、お買い得だね!おつまみ、ラーメンのチョイ足しに。タイマーとかってLR44ばかりじゃないのね。2019.09.06ポイントカード等の整理に便利かな。