最近始めた[share]エントリーと[新着app]エントリー。
今日はその舞台裏をご紹介します。まだまだ発展途上なんですけどね(;^ω^)
舞台裏を書く目的は、blog書く方々への情報共有、更にもっと楽にできるアイデアとかあれば、教えてもらいたいなーという想いからです。
では早速…。
各エントリーは、ゼロからHTMLを作ってる訳ではなく、Googleリーダーを起点に半自動でHTMLを作ってます。日々の負荷を減らすこと。何よりも、考えることに多くの時間を費やし、無理なく1本のエントリーを作り上げること。これが目標っす。
当初、運用していて悩んでたのが、[share]とか[新着app]は第三者情報のたれ流しなんで、私のblogで紹介して意味あるのか?という迷いでした。自問自答の日々でした。
そんな時に救われたのが以下の温かいお言葉。
「hiroさんが選抜した記事だから意味がある」とか「紹介してくれてPV上がった」とか…。たくさんのフィードバックを頂き、勇気をもらいました。もう迷いません。
半自動化をするにあたって使ってるツール群は以下の通り。
- WordPress(私が使ってるblogシステム。Pluginは強烈に便利っす。)
- Rec.ReadingとRSSImport(Plugin。エントリー半自動化の肝になってます。)
- Yahoo!Pipes(かゆい所は、これを噛ますと自由度が広がります。)
- FeedBurner(Webサービス。PipesのフィードをRSSImportで使う為に経由)
- FirefoxとFirebug(HTML要素をコピーするのに使ってます。)
- Note in Reader(bookmarklet。任意のサイトをGoogle Shareできます。)
- mi(テキストエディター。何でもいいんですが、私が使ってるのはこれ。)
以下、日々してることを説明した後、設定とか工夫してるとこを紹介します。
日々の情報の仕分け
使ってるのはGoogleリーダーのみ。「メモ付き共有」と「スター」の2つの機能さえあれば、いつでもどこでもネタが作れる。無理なくiPhoneだけでネタ作りができるんです。
[share]ネタを作る
購読してるフィード、他の方々のGoogle Shared Item(Googleリーダーで見れる)を閲覧。で、気になった記事に「メモ付きの共有」をする。たったこれだけで、裏でWordPressのページが作られます。
メモ付き共有した記事は、ほぼ同じタイミングで以下のようなHTMLページとして見れちゃいます。ページはblogの管理者のみ見れるように非公開に設定してます。
[新着app]ネタを作る
新着AppCheckフィードを購読し、気になったら「スター」を付与する。たったこれだけで、裏でWordPressのページが作られます。
スター記事は、Yahoo!Pipes、FeedBurnerを経由し、以下のようなHTMLページを自動生成します。ページはblogの管理者のみ見れるように非公開に設定してます。
時間を掛けずにエントリー
次にやることは、ページの加工。必要情報だけテキストエディタにコピペします。コピペに便利なのが、FirefoxのアドオンであるFirebug。要素をコピーってのがお手軽で、お目当ての部分だけ抜粋することが簡単にできちゃいます。
見ているページで右クリック「要素を調査」すると上記のような画面が出てくるので切り取りたいブロック(=ULタグ)のところで更に右クリック「HTMLをコピー」とするとULタグに囲まれた全てのHTMLがクリップボードにコピーされます。後は、テキストエディタ上にコピペして加工するだけ。序文を入れたりします。
[share]ネタの加工
トピック分け、記事の順番入れ替えがメイン作業です。この作業も自動化できると良いんですが、まだ実現できてません。Pipesを絡ませればいけそうなんですが、まだダメ。
[新着app]ネタの加工
アプリ単位にアプリ名のリンクをH2タグに置換したり、コメント記入欄を埋めたり、不要な画像のタグを削除したりします。ここは考えるべきところなんで自動化は無理。
テキストエディタ上で文章が完成したら、WordPressに投稿。以上で[share]エントリーと[新着app]エントリーが完成っす。
昔「iPhone振り返り雑記」を書いてた当初と比較すると、かなりの自動化が進みました。疲れて帰宅しても、これなら続けられる….かも。
設定とかで準備で工夫したことなど
今は全て設定済みなんで何の苦労もないんですけど、環境が整う迄は大変でした。
Pluginのデフォルト設定のまんまだと、Rec.ReadingもRSSImportも見栄えがイマイチなんです。私好みじゃない。それに生成されたページが加工しにくいんです…。
ということで設定とか準備で工夫したところを列挙します。もしご自身の環境で工夫したいという方がいて、更にご不明な点があるならば、個別に聞いて下さいまし。
Rec.Readingの肝となるphpの加工
Rec.ReadingのPluginは、思ったよりもHTMLページのカスタマイズができないんです。なので(仕方無く)HTMLページを作るphp(googlereader.php)をいじってます。
参考までにいじったphpをアップしときます。いじった内容は「hiro45jp」で検索すると分かります。コメントアウトしたところと加えたところが分かるようになってます。
- 生成されるHTMLの可読性が悪いんで適当な箇所に「改行コード」追加
- リンクは「はてブ数」を表示させたかったんで変更
- 元サイト名のリンクは蛇足だったんで削除(記事リンクを踏めば分かる)
- 「メモ付き共有」のコメントが目立つように太字にするとか
RSSImportのshortcodeのオプション等
RSSImportのPluginは、Rec.Readingと比べるとHTMLページのカスタマイズの自由が効きます。なのでphpはいじらずにオプションをいっぱい付けてます。
上記、もうひとつポイントなのがDIVタグ(AppInfo)の部分。RSSImportで生成されたHTMLは、HTMLの要素をごっそり抜き出す際にうまく固まりを指定できないんです。なので、固まりを作る為だけにDIVタグを作ってます。
RSSImportで指定してるRSSフィードのURLが何なのかは後述します…。
新着AppCkeckのRSSを抜き出すYahoo!Pipes
新着AppCheckのフィードは何度も紹介してるので、今回は説明は割愛しますが、このフィードを見て、気に入ったアプリに「スター」を付けると自動的に新たなフィードができるようにYahoo!Pipesを作りました。主な機能は以下の通り。
- 予め自身のGoogleリーダーのスター記事を公開設定しとく必要あり
- 指定したGoogleリーダーIDの新着AppCheckのスター記事のみ取得
- コメント記入欄の追加とアプリ画像の下にある説明文のカット
- TABLEタグのカット(私のblogだとおかしくなるので)
- アプリのリンクURLの置き換え(自分用のに変更)
Pipesそのものは以下です。
ちなみにRSSImportのRSSフィードにはYahoo!Pipesで生成したフィードのURLは指定できないみたい。エラーになっちゃいます。ですので、FeedBurnerを経由させてURLを変更してごまかすことで対処してます…。
上記の場所で変換するとさっきのURLは以下のようになります。
以上、駆け足でしたが、情報の通路を作る際、自分好みにうまくいかないところは、無理して手作業しちゃうんではなく、Yahoo!Pipesなり、phpをいじることで半自動化ができるんだ….ということのデモでした。
blog書く方々のちょとでもヒントになれば幸いです。
Yahoo!Pipesは覚えるまで時間かかったんですが、覚えちゃえば色々なことができるんです。いつかPipes絡みのエントリーも書いてみようと思ってます。
以上、マニアックすぎるエントリーでした(;^ω^)
(追記)Rec.Reading、新着AppCheck、RSSImportの過去記事
Similar Postsにうまく表示されなかったので…。
-
タグ: App紹介, Byline, Firefox, Googleカレンダー, hiroスタイル, Plugin, WordPress, Yahoo!Pipes, アドイン, 振り返り雑記
[...] [...]
[...] ◆ iPhone 研究室 blogを半自動化する – [share] [新着app]の舞台裏 [...]
[...] blogを半自動化する – [share] [新着app]の舞台裏 | 普通のサラリーマンのiPhone日記 (tags: blog) [...]
[...] ✓blogを半自動化する – [share] [新着app]の舞台裏 | 普通のサラリーマンのiPhone日記 [...]
I think that is an interesting point, it made me think a bit. Thanks for sparking my thinking cap. Sometimes I get so much in a rut that I just feel like a record.
[...] blogを半自動化する – [share] [新着app]の舞台裏 [...]
[...] blogを半自動化する – [share] [新着app]の舞台裏 [...]