当ブログの最新記事のお知らせはAtomフィードで配信しています。いままでサムネイル画像が表示されていなかったと思いますが、この度サムネイル画像を表示させるようにしてみました。
いまどきRSSリーダーを使ってブログの最新記事を追いかけている人がどれほどいるのか分かりませんが、僕は「Feedly」に気になるブログを登録し、それを「Reeder 5」というアプリを使ってiPhoneやiPadでみています。
昔はRSSリーダーで記事の一覧を表示してもサムネイル画像なんてものは表示されていなかったように記憶しているのですが、いつの頃からかサムネイル画像が表示されるようになっていました。もうずっと昔のことです。
ウチのブログはというと、何もしていないのでサムネイル画像は表示されていなかったわけですが、なんとなく表示させてみたかったのでいろいろ調べてみました。
が、Movable Typeに関する情報って、ほんとになくて、出てくるのはWordPressのことばかり。
話が脱線しますが、ブログを始めるとき、Movable TypeかWordPressかどちらのCMSを使うか悩んだのですが、その時はMovable Typeの利用者が多かったような気がしたのでMovable Typeを選びました。しかし時代変わっていまとなってはWordPressのシェアが圧倒的です。正直WordPressにしておけばよかった…と思わんでもない最近です。
話しを戻してAtomフィードにサムネイル画像を表示させる方法ですが、よく考えるとMovable TypeだWordPressだの話ではなくて単にAtomフォーマットの話なので、ChatGPTに聞いたら何か答えてくれるかなと思って聞いてみたところちゃんと答えてくれました。
https://chat.openai.com/share/33602454-ff44-461a-8e2d-1022510b991cAtomフィード（atom.xml）にサムネイル画像を含めるには、<entry> 要素内に <media:thumbnail> などのメディア関連の要素を追加することが一般的です。以下は、サムネイル画像を含むAtomフィードのサンプルコードです。この例では、各 <entry> 要素内に <media:thumbnail> を追加しています。
ChatGPTはサンプルコードまで提示してくれました。ということで、<media:thumbnail> を追加するのですが、 <media:thumbnail>はhttp://search.yahoo.com/mrssに定義されているので、こちらをまず追加します。（なぜYahoo？）
※「最新記事のフィード」（atom.xml）のテンプレートに追加します。
<feed xmlns="http://www.w3.org/2005/Atom" xmlns:media="http://search.yahoo.com/mrss/"> <!-- xmlns:mediaの記述を追加 -->
そのうえで、<summary></summary>の下あたりに<media:thumbnail>を追加します。ごちゃごちゃ長いのは、こちらの記事で書いたサムネイル画像を表示するためのコードそのものだからです。
※当時とちょっと変わっていますが概ね同じです。
1.サムネイル画像があればそれを、2.サムネイル画像がなければ@SITE_ICONに指定されてる画像を、3.それら以外は固定の画像を、といった動きになります。
<summary><$mt:EntryExcerpt remove_html="1" encode_xml="1"$></summary>
<!-- サムネイル画像追加 -->
<media:thumbnail url="
<mt:EntryAssets type="image" limit="1" sort_order="ascend">
<$mt:AssetThumbnailURL height="640" square="0" encode_html="1"$>
<mt:Else>
<mt:Assets type="image" tag="@SITE_ICON" limit="1">
<$mt:AssetThumbnailURL height="640" square="0" encode_html="1"$>
<mt:Else>
<$mt:SupportDirectoryURL with_domain="1" encode_html="1"$>theme_static/rainier/img/siteicon-sample.png
</mt:Assets>
</mt:EntryAssets>">
<!-- -->
これでAtomフィードでサムネイル画像が表示されるようになりました。
コメント