フリーランスの道具箱

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]

関連エントリー

広告

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


この記事を書いた人 :

profile2016autumn

ブロガー・Web&Blogコーチ・親指シフトユーザー・orzレイアウト考案者。WordPressが得意。HTML・CSS・PHPも熟知し広範囲の知識を持つ。ブログは年間 1450記事を更新した経験も(2013年)。

誰でもインターネットを活用できる時代だから、頭でモヤモヤしている「こんなのを実現したいなぁ」を引き出して形にし実現させるお手伝い、そして、インターネットを上手に使えるようにサポートするのが得意です。

iPhoneやAndroidなどのガジェット、デジタルだけでなく文房具などのアナログなツールも大好きです。写真や旅を楽しむこと、おいしいお食事、楽しい・ワクワクすることが大好きです。

Twitterやfacebookでも情報発信中、よろしければフォローしてください。



Instagram
follow us in feedly

ご依頼・講座開催情報はこちら

ブログ・情報発信でお困りごと、モヤモヤ、解決。あなたのステップアップをサポートしています。

広告

情報発信コンサルティング・コーチ

Web・ブログのコンサルティング・ご相談のご依頼を受け付けております。
・Webを活用して本気でビジネス・人生を切り開きたい方
・Webのテクニカルな改善でお悩みの方
・アイディアはあるのに、記事の文章にするのがうまくいかない方
・親指シフトを本気で習得したい方

そんな多様なお悩み、そして、さらに隠れていて見えないお悩みもダイレクトにアドバイス。ブログ2400記事をアウトプットした経験に基づく良質なノウハウ・スキルを手に入れてください。時間の大切さを感じてるあなたへオススメです。

お申し込みは
お問い合わせフォーム
からお願いします。

うまく表示されない時は
こちらをご覧下さい。

お申し込みは
お問い合わせフォーム
からお願いします。

こちらの記事も役立ちます
follow us in feedly