XSERVER PC・728 x 90 wordpress

[WordPress]ブログに別のブログの新着情報を掲載する方法

シェアしていただけるとうれしいです

ブログに別ブログの新着情報を掲載したい

RSS Feed
複数のサイトやブログを掲載している方は多いと思います。理由は人それぞれ。私も一つのブログを2つに分けました。

ブログを2つに分けることによって、カテゴリ分けがすっきりしたのですが、反面、独立した2つのブログ(サイト)になってしまって、寂しさも拭えません。

メインのブログであるまろろぐに、このブログ(まろらぼ)の新着内容を載せることで、両方のブログに関連性を持たせて、かつ、相互リンクでSEO的にも好影響を与えないかな?と考えたわけです。

まろろぐ」と「まろらぼ」は、同じXSERVERの中に2つのWordPressのサイトとしてインストールしています。データベースも別々のデータベースを使っています。別のものであっても、両方とも私のものなので、「まろろぐ」から「まろらぼ」のデータベースの内容を参照しに行くことは可能です。

WordPressは、標準では一つのデータベースしか参照に行かないので、別のデータベースを参照しにいくのであれば、自分でPHPのコードを書く必要があります。
サイトmysqli クラス
サイトMySQL 関数 (PDO_MYSQL)
正直、コードを書くのは面倒なので、もっと別の方法はないものかと考えてみたら、ありました。

WordPressで作ったサイトは、RSSフィードを配信してくれます。「管理ページ>表示設定」のところにRSSに関する設定があります。
RSSの設定
RSSとはReally Simple Syndication / Rich Site Summaryの略で、

RSSは、ニュースやブログなど各種のウェブサイトの更新情報を簡単にまとめ、配信するための幾つかの文書フォーマットの総称である。

サイトウィキペディア
RSS自体はXMLのフォーマットになっているので、ブラウザでも閲覧が可能です。こんな感じに見えます。
RSS feed
XMLはHTMLのように装飾が全く無いので、人間の目には非常に見づらいです。それを見やすくするために、FeedlyなどのRSSリーダーと呼ばれるアプリケーションやサービスが有るわけです。

PHPで、RSSを取得してHTMLとして整形して表示する、というプログラムを書くことはできます。しかし、非常にコードを書くのは面倒なので、なんかいいプラグインはないものかと探してみたら、ありました。「RSS Antenna」というプラグインです。

RSSを取得して、任意の場所に表示ができるようです。これを使ってみました。

RSS Antennaのインストールと設定

「管理ページ>プラグイン>新規追加」で、「RSS Antenna」を検索します。
RSS Antenna
インストールして、有効化します。

「設定>RSS Antenna 設定」のところで、必要事項を設定します。
RSS Antenna 設定

  • RSSフィード
    取得するRSSのURLを入力します。
  • 表示件数
    取得するRSSの件数を選択します。10件位が適当かと。
  • 記事の抜粋を表示する
    ここのチェックを外すと、記事のタイトルのみを取得します。サムネイルを表示させたい場合はチェックしないとサムネイルが表示されません。

ここで問題になるのが、WordPressは記事のサムネイルをRSSに含めてくれない、ということなんです。自分のブログをFeelyに登録しているのですが、自分のブログだけサムネイルが表示されないなぁ?と思っていたら、何らかの仕組みが必要なんですね。

RSS Image Feedのインストールと設定

こちらも探してみたら最適なプラグインがありました。「RSS Image Feed」というプラグインです。こちらも「プラグイン>新規追加」からインストールして有効化します。
RSS Image Feed

「プラグイン>RSS Image Feed」から設定ができますが、特に変える必要はなさそうです。
Feed Images 設定

しいて設定するなら、サムネイルの大きさが300px×300pxになっているようなので、RSSフィードを表示する場所に合わせて大きさを変えたほうがいいかもしれません。(無駄にファイル容量がおおきくなりますし)
サムネイルのサイズ

RSSフィードを貼り付ける

さて、「RSS Antenna 設定」に戻ります。上の方に
RSS Antenna 設定
とあります。ショートコードを任意の場所に貼り付ければいいようです。

ぼくの場合、サイドメニューに表示したかったので、ウィジェットの「サイドバーウィジェット」に貼り付けてみました。
ショートコードをウィジェットに貼り付ける

これで表示を確認すると、このように表示されました。
表示確認
上の「人気記事」の部分とデザインが統一されていなくって、イマイチですねぇ。デザインを少しいじりますか。

デザインの調整

デザインを触るには、小テーマのstyle.cssに記述を追加します。

まずは、記事の抜粋はいらないんだけど、「記事の抜粋を表示する」のチェックを外すとサムネイルも表示されなくなってしまいます。サムネイルの大きさも揃えたいし、文字の大きさ、色も揃えたいです。

というわけで、style.cssに下記の記載を追加しました。

これで、表示もこのようになって、非常に満足です。
表示確認

効果の程は?

視覚的に2つのブログの関連性が高まって、ブログの運営者としては満足しています。見に来てくれた方にメリットがあるかどうか、SEO的にどうなのか、ということに関しては、今後計測を続けていかないとわからないですね。

みなさんの参考になれば幸いです。ではまた。

WEBのシステムを作ったり保守したりするSE/プログラマというものをしています。
ブログやってますがブロガーではありません。週末WEB随筆家です。
まろと呼んでください。
広告:XSERVER:350 x 160
スポンサーリンク

シェアしていただけるとうれしいです

フォローしていただけるとうれしいです

スポンサーリンク