RSSを購読していたブログを一覧できるサイトをWordPressで構築

Feedlyに登録しているRSSを、PhoneのSylfeedにて購読していますが、最近、読む時間が捻出できてない状態だったりします。

いろいろとどうするか?という点は置いておき、いままで集めた購読リストも大切なので、これを活用して、ブックマークのように公開するサイトを作りました。

ポイントはこんな感じです。

  • WordPressで構築
  • カスタムフィールドを活用
  • データはCSVで一括登録
  • 最新から 10エントリーをRSSから取得して自動で表示
  • カスタマイズしやすいので、外観はTwentyFifteenで構築

見切り発車で出来上がったのがこちらです。なんだかんだで695サイト登録していますが、まだまだ登録していきたいです。

それと、カテゴリーの整理とタグの整理ができないないので、ぼちぼちしていきます。これらができていませんが、とりあえず、公開しちゃいました。

RSSフィードのデータ

iPhoneのSylfeedからOPML形式をメール経由にて出力して、MacのOmniOutlinerにインポート、これをHTML形式にてエクスポートして、ブラウザーで表示したのを、コピーして、Excelに貼り付けました。

余談ですが、OmniOutlinerからWorkflowyへ貼り付けて整理しようとしたら、無料のリスト数が不足してしまいました。

これで、とりあえずデータは取り出せました。ただ、重複してたりするので、Excelの関数やフィルターを使って簡単に整理を。

参考になったのがこちら。

Excelでタグを作ろうとするも、うまくいかない

サイト名の一文字目を取り出して、この「1文字目の音」でタグを作ろうとしましたが、なかなかうまくできませんでした。ということで、タグは後から整理することに。

使ったExcel関数は、こんな感じ。

  • LEFT関数
  • PHONETIC関数

WordPressサイト構築

さくらインターネットさんのスタンダードにある、ohigashi.meドメインの下に「bookmark」ディレクトリーを作成して、ここにWordPressをインストール、データベースはこれ専用を用意しました。

インストールしたプラグイン

これらをインストール・有効にしました。

  • Advanced Custom Fields
  • Collapsing Categories
  • PS Auto Sitemap
  • Really Simple CSV Importer
  • WP-RSSImport
  • WP Multibyte Patch

カスタムフィールド

Advanced Custom Fieldsプラグインで設定しました。このプラグインは、投稿編集画面の「エディター」部分などを非表示にできたり、とても使いやすいです。

  • blog_title
  • url
  • feed_url

これら3つのカスタムフィールドを用意しました。

参考エントリーはこちら

こちらの書籍も参考になります。

表示するために、子テーマ「chird15」を作成して、content.phpをカスタマイズしました。カスタマイズしたソースは一番下に添付しています。

カスタムフィールドからエントリータイトルを自動で入れようとするも、うまくできない

カスタムフィールドから「エントリータイトル」を自動で設定するようにしようと、下のエントリーを読み格闘したのですが、どうもうまくできませんでした。

よくよく考えたら、CSVインポートの時点で、タイトルを用意しておけばいいので、これは実装しませんでした。なお、functions.phpを直接編集するのは、リスクが大きいので「code snippets」プラグインを使いました。

CSVからデータをインポート

WP-RSSImportプラグインを使います。本当に素晴らしいプラグイン、感謝です。

Advanced Custom Fieldsのカスタムフィールドに対応しています。ただし、フィールド名でなく「field key」で指定します。

また、CSVの仕様はこちらの作者さんのサイトを参考にしました。

用意したCSVフィールドは下のとおり、最後の3つが「field key」です。

  • post_id
  • post_name
  • post_author
  • post_date
  • post_type
  • post_status
  • post_title
  • post_content
  • post_category
  • post_tags
  • field_55caf52525349
  • field_55caf5372534a
  • field_55caf5562534b

MacのExcelで作成したCSVだと、自分の設定が悪いのか?インポートできませんでした。文章だとさらっと1行なんですが、ここ1時間強、はまりました。

Googleドキュメントのスプレッドシートから作ったCSVだと、すんなりインポートできました。

RSSで最新エントリーを表示

WP-RSSImportプラグインで実装しています。ショートコードでも動作しますが、カスタムフィールドを使うので、一緒にPHPコードで形にしています。

表示件数や項目のカスタマイズは下の説明を読みながら設定しました。

IMG_9009

まとめ

1日まとまった時間があったので、自分がいままで購読していたブログさんのリストサイトを立ち上げました。

検索エンジンにはインデックスされないように、noindex設定にしています。

実は去年に同じような機能のサイトを作ったことがあり、それをベースに作りました。こっち(ものくろキャンプ)もデータを更新しないと、、。

カテゴリー整理などできていないので、実際に使える形には程遠いのですけれど、まずはこんなこともWordPressでできますよ、ということで、動的にコンテンツを出力するWordPressの真価発揮だと思うのです。

コード

content.php

[php]
<?php
/**
* The default template for displaying content
*
* Used for both single and index/archive/search.
*
* @package WordPress
* @subpackage Twenty_Fifteen
* @since Twenty Fifteen 1.0
*/
?>

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
<?php
// Post thumbnail.
twentyfifteen_post_thumbnail();
?>

<header class="entry-header">
<?php
if ( is_single() ) :
the_title( ‘<h1 class="entry-title">’, ‘</h1>’ );
else :
the_title( sprintf( ‘<h2 class="entry-title"><a href="%s" rel="bookmark">’, esc_url( get_permalink() ) ), ‘</a></h2>’ );
endif;
?>
</header><!– .entry-header –>

<div class="entry-content">

<ul>
<li>サイト名 :
<?php the_field(‘blog_title’); ?>
</li>

<li>URL :
<a href="<?php the_field(‘url’); ?>" target="_blank"><?php the_field(‘url’); ?> </a>
</li>

</ul>

<h3>最新エントリー</h3>
<!– RSSImport(5, get_field(‘feed_url’),); –>
<?php
$rssfeed=get_field(‘feed_url’);

RSSImport(
$display = 10, $feedurl = $rssfeed,
$before_desc = ‘<blockquote>’, $displaydescriptions = true, $after_desc = ‘</blockquote>’, $html = false, $truncatedescchar = 200, $truncatedescstring = ‘ … ‘,
$truncatetitlechar = ”, $truncatetitlestring = ‘ … ‘,
$before_date = ‘ <br><small>’, $date = true, $after_date = ‘</small><br>’,
$date_format = ‘Y/m/d \a\t g:i A’,
$before_creator = ‘ <small>’, $creator = false, $after_creator = ‘</small>’

);

?>

<p>RSSフィード<br> <a href="<?php the_field(‘feed_url’); ?>" target="_blank"><?php the_field(‘feed_url’); ?> </a></p>

<?php
/* translators: %s: Name of current post */
the_content( sprintf(
__( ‘Continue reading %s’, ‘twentyfifteen’ ),
the_title( ‘<span class="screen-reader-text">’, ‘</span>’, false )
) );

wp_link_pages( array(
‘before’ => ‘<div class="page-links"><span class="page-links-title">’ . __( ‘Pages:’, ‘twentyfifteen’ ) . ‘</span>’,
‘after’ => ‘</div>’,
‘link_before’ => ‘<span>’,
‘link_after’ => ‘</span>’,
‘pagelink’ => ‘<span class="screen-reader-text">’ . __( ‘Page’, ‘twentyfifteen’ ) . ‘ </span>%’,
‘separator’ => ‘<span class="screen-reader-text">, </span>’,
) );
?>
</div><!– .entry-content –>

<?php
// Author bio.
if ( is_single() && get_the_author_meta( ‘description’ ) ) :
get_template_part( ‘author-bio’ );
endif;
?>

<footer class="entry-footer">
<?php twentyfifteen_entry_meta(); ?>
<?php edit_post_link( __( ‘Edit’, ‘twentyfifteen’ ), ‘<span class="edit-link">’, ‘</span>’ ); ?>
</footer><!– .entry-footer –>

</article><!– #post-## –>

[/php]

style.css

[css]
/*
Template:twentyfifteen
Theme Name:child15
Description:子テーマです
Author:nobuhito
Version:1.0
*/

@import url(‘../twentyfifteen/style.css’);

body {
font-family: ‘YuGothic’, ‘Yu Gothic’,’游ゴシック’,’ヒラギノ角ゴ Pro W3′,’Hiragino Kaku Gothic Pro’,’メイリオ’,’Meiryo’,sans-serif;
}

.blog_img {
display: block;
margin: 0 auto !important;
padding: 4px;
background: #fff;
border: 1px solid #bfbfbf;
}

.rss_li{
font-size:85%;
margin-bottom:30px;

}

blockquote {
font-size: 14px;
font-size: 1.4rem;
margin-left: .4091em;
line-height: 1.6;
font-style: normal;
}
[/css]

WP-RSSImport

[php]
<?php
$rssfeed=get_field(‘feed_url’);

RSSImport(
$display = 10, $feedurl = $rssfeed,
$before_desc = ‘<blockquote>’, $displaydescriptions = true, $after_desc = ‘</blockquote>’, $html = false, $truncatedescchar = 200, $truncatedescstring = ‘ … ‘,
$truncatetitlechar = ”, $truncatetitlestring = ‘ … ‘,
$before_date = ‘ <br><small>’, $date = true, $after_date = ‘</small><br>’,
$date_format = ‘Y/m/d \a\t g:i A’,
$before_creator = ‘ <small>’, $creator = false, $after_creator = ‘</small>’
);
?>
[/php]

関連エントリー

著者プロフィール

ものくろ(大東 信仁)
ものくろ(大東 信仁)
ブロガー・Web&Blogコーチ。親指シフト orzレイアウト開発者。ブログは月間65万PVを記録(2016年1月)。200回を超えるワークショップ開催・のべ1,000名のブログサポートに携わる。WordPressが得意。

詳しいプロフィールはこちら

もっと
ブログで情報発信
について読む