スマートフォン用ニュースキュレーションアプリの大手「SmartNews」ですが、ニュースサイトやブログなどが掲載してもらうために専用の RSS フォーマット「SmartFormat」が以前より用意されていて、それに準拠した RSS を提供することで「SmartNews」に取り上げてもらえる可能性があることをご存知でしょうか。
当ブログもチャレンジしてみたくなり WordPress の「SmartNews」用 RSS「SmartFormat」を作成してみました。しかしそれがかなり厄介で大変だったので、今回の記事を備忘録として残させていただきます。
ちなみに私は昔から HTML や PHP などを学んだことがないド素人です。プロの方にしてみたら超簡単なことかと思いますが、修正やご教授ではない苦言コメントなどはなるべくやめてくださいね。
なぜ大変だったのか
なぜ大変だったかというと、情報が少ない & あっても古かったからです。「SmartFormat」は 2016 年 2 月に、AMP のような爆速表示を実現する「SmartView」を採用した v2.0 の「SmartFormat 2.0」が公開されているのですが、まさにその「SmartFormat 2.0」の情報がネットにほぼありませんでした。探し方が悪かっただけかもしれないですけど。
それ以前のバージョンの情報はちらほらあったのでそれを参考にしつつ、完成に至ったわけです。若干誰かに褒めて欲しくも思っています。
ちなみに「SmartFormat 2.0」に対応させておくと、「SmartFormat 2.0」に対応していない以前のバージョンで掲載されている記事よりも優先的に表示されるようになっているそうです。
「SmartFormat 2.0」用 RSS 作成
「SmartFormat 2.0」に準拠した RSS を作成するにあたって、「SmartNews」が公開しているフォーマット紹介サイト「SmartFormat」のほかに以下の個人サイト（flappe さん）を参考にさせていただきました。
[blogcard url=”https://www.smartnews.com/smartformat/ja/”]
[blogcard url=”http://flappe.guide-book.xyz/column/column-smartnews/”]
途中までは一緒
途中までは flappe さんで紹介されている内容のまんまです。1 から RSS を作成するのではなく、“feed-rss2.php” を基に「SmartFormat 2.0」に合わせてカスタマイズしていく流れとなります。
|
// SmartNews
add_action('do_feed_smartnews', 'do_feed_smartnews');
function do_feed_smartnews() {
$feed_template = get_template_directory().'/smartnews.php';
load_template( $feed_template );
}
※smartnews はリネームした名前を当てはめてくだい
ちなみにfunction.php への追記はテンプレートのアップデートが行われると当然のことながら上書きされて消えてしまうため、スニペット系のプラグインなどを利用して逃がしておいたほうが良いかと思います。私はそうしました。
あとは “smartnews.php” を WordPress の管理画面（外観 → テーマ編集）からいじっていくだけなのですが、先に flappe さんで紹介されている内容のままカスタマイズしてしまうとエラーが出ます。なんせ「SmartFormat 2.0」が公開される以前の情報ですから。
また「SmartFormat 2.0」では不要になっている内容もあります。なので function.php の追記まで終わったら一旦「SmartFormat チェックツール」でチェックを行い、出てくるエラーを 1 つ 1 つ解消していく、という手法でやっていく方が良さ気です。知識のある方にそう助言をいただきました。
[blogcard url=”http://validator.engine.smartnews.be/url”]
「SmartFormat チェックツール」で “Valid” が表示されるまで最低限カスタマイズして、あとはそれに着色していくという流れでいきます。
流れ
まずは flappe さんを参考にした最低限の流れです。
“xmlns:” に 2 行追記
xmlns:media="http://search.yahoo.com/mrss/" xmlns:snf="http://www.smartnews.be/snf"
抜粋表示にしている場合
WordPress の RSS 設定で抜粋表示にしている場合は全文表示になるように以下の部分を変更します。
- 変更前
<?php if (get_option('rss_use_excerpt')) : ?>
<description><![CDATA[<?php the_excerpt_rss(); ?>]]></description>
<?php else : ?>
<description><![CDATA[<?php the_excerpt_rss(); ?>]]></description>
<?php $content = get_the_content_feed('rss2'); ?>
<?php if ( strlen( $content ) > 0 ) : ?>
<content:encoded><![CDATA[<?php echo $content; ?>]]></content:encoded>
<?php else : ?>
<content:encoded><![CDATA[<?php the_excerpt_rss(); ?>]]></content:encoded>
<?php endif; ?>
<?php endif; ?>
↓↓↓
- 変更後
<guid isPermaLink="false"><?php the_guid(); ?></guid>
<?php if (get_option('rss_use_excerpt')) : ?>
<description><![CDATA[<?php echo the_excerpt_rss(); ?>]]></description>
<?php endif; ?>
<?php $content = get_the_content_feed('rss2'); ?>
<content:encoded><![CDATA[<?php echo $content; ?>]]></content:encoded>
面倒な場合は WordPress の RSS 表示を全文表示にするだけで OK。 ※多分（試してません）
またこの時点で「SmartFormat チェックツール」でチェックを行うと、“Invalid” にならないとしても “Warning” となります。
ここが New！！
ここからが公式サイト以外では紹介されていない内容です。上記で “Warning” となる理由は「SmartFormat 2.0」で新たに追加されたアナリティクス要素の <snf:analytics> が不足しているからとなります。以下の方法で追加します。
item 要素内に “analytics（アナリティクス トラッキング コード）” を追加
<content:encoded><![CDATA[<?php echo $content; ?>]]></content:encoded>
の直下に Google アナリティクスなどのアナリティクス トラッキング コードを追加します。CDATA で囲まないといけないそうですが、Google アナリティクスなどで設定されているアナリティクス トラッキング コードをそのまま貼り付けます。アナリティクス トラッキング コードはご自分の物をお使いください。
<analytics> <![CDATA[ アナリティクス トラッキング コード ]]> </analytics>
以上。
ここまでやればとりあえず OK
ここまでやれば “Valid” になるはずです。
ただしアイキャッチ画像や広告が設定されていないので、あくまでも最低限の状態での “Valid” となります。アイキャッチ画像と広告は flappe さんが紹介しているものを参考にすれば OK です。以下で紹介しています。
アイキャッチ画像の設定
アイキャッチ画像は WordPress 側でブログを書くときに常に利用していることを前提としています。 ※アイキャッチ画像を使っていない場合のやり方は、私ではわかりません
<?php the_category_rss(‘rss2’) ?>
の直下に以下を追加します。こちらは flappe さんが公開しているコードだとエラーが出るので注意してください。以下のコードであれば大丈夫です。
<?php $image_id = get_post_thumbnail_id(); $image_url = wp_get_attachment_image_src($image_id, true); ?> <media:thumbnail><?php echo $image_url[0]; ?></media:thumbnail>
広告の設定
アドセンスなどの広告を 1 個掲載することができます。サイズは 300 × 250 固定です。
<slash:comments><?php echo get_comments_number(); ?></slash:comments>
の直下に以下を追加します。広告コードはご自分の物をお使いください。
<snf:advertisement> <snf:adcontent> <![CDATA[ 広告コード ]]> </snf:adcontent> </snf:advertisement>
これでアイキャッチ画像と広告が設定できました。
このほかに「SmartFormat」で紹介されている記事上部のロゴ（snf:logo）や自社広告（snf:sponsoredLink）の設定も場合によって行うと良いかと思います。
逆に flappe さんで紹介されているサイトの URL や 512 × 512 のロゴ画像、コピーライト、関連記事の項目は、“feed-rss2.php” を流用していれば特に追加不要となっています。関連記事については「SmartFormat 2.0」に対応していれば「SmartNews」側で自動生成してくれるみたいです。
あとは申請するのみ
“Valid” になったらあとは申請を行うだけです。ただし今のところ個人ブログの受付は行っていない模様なので、申請しても通らないかもしれません。
[blogcard url=”https://docs.google.com/forms/d/e/1FAIpQLSfoFaNrKwKm4ZOkk7p5c4O0QLTGuNFAby12YWvwKQzwIg_-KA/viewform”]
以上です。ご参考までに。
更新
不要な要素をなくしていったら以下のような内容となりました。下線引いている部分をご自身の内容に変更すれば、ほぼコピペでいけるはずです。
<?php
/**
* RSS2 Feed Template for displaying RSS2 Posts feed.
*
* @package SmartNews
*/
do_action( 'rss_tag_pre', 'rss2' );
?>
<rss version="2.0"
xmlns:content="http://purl.org/rss/1.0/modules/content/"
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:media="http://search.yahoo.com/mrss/"
xmlns:snf="http://www.smartnews.be/snf"
>
<channel>
<title><?php wp_title_rss(); ?></title>
<snf:logo><url>ロゴ画像アップロード先の URL</url></snf:logo>
<link><?php bloginfo_rss('url') ?></link>
<description><?php bloginfo_rss("description") ?></description>
<language><?php bloginfo_rss( 'language' ); ?></language>
<copyright>© コピーライト</copyright>
<ttl>5</ttl>
<?php while( have_posts()) : the_post(); ?>
<item>
<title><?php the_title_rss() ?></title>
<link><?php the_permalink_rss() ?></link>
<pubDate><?php echo mysql2date('D, d M Y H:i:s +0000', get_post_time('Y-m-d H:i:s', true), false); ?></pubDate>
<category>任意</category>
<?php
$image_id = get_post_thumbnail_id();
$image_url = wp_get_attachment_image_src($image_id, true);
?>
<media:thumbnail><?php echo $image_url[0]; ?></media:thumbnail>
<?php $content = get_the_content_feed('rss2'); ?>
<content:encoded><![CDATA[<?php echo $content; ?>]]></content:encoded>
<snf:advertisement>
<snf:sponsoredLink link="A" advertiser="B" title="C"thumbnail="D"/>
<snf:sponsoredLink link="A" advertiser="B" title="C"thumbnail="D"/>
<snf:adcontent>
<![CDATA[
アドセンスなどの広告コード
]]>
</snf:adcontent>
</snf:advertisement>
<analytics>
<![CDATA[
アナリティクス トラッキング コード
]]>
</analytics>
</item>
<?php endwhile; ?>
</channel>
</rss>
