denzi-soul.blog

フィードをブログに読み込ませて表示したいんだけども・・・

やりたいこと

• 自分がTumblr で収集している画像を、5件～10件くらい、ブログ内に表示したい。そしてその際次の条件を満たすこと。
  1. 画面に表示されるのは、画像と、クリップした日付のみ。（リンク元へのテキストリンクは表示しない）
  2. 画像をクリックすると、リンク元へ飛ぶようにする。（自分のtumblrへ飛ぶのでなく、その画像を保持しているサイトへ飛ぶようにする。）
• 画像の横幅は統一する（250pxくらい）。

以下のツールは使わないでやってみる

勉強のために、という理由と、表示の細かい制御が利かない（利かせ方がわからない・・・）、という理由のため。

Magpie RSS - PHP RSS Parser

便利すぎるだろjk。詳しい説明はMagpieRSS - PHP で使える RSS パーサー。

tumblrのRSSをブログに貼付けられる『tumblrss』 | CREAMU

ただ使いにくい点もいくつかありまして、

• tumblrのよさである画像や動画の簡単なポストですが、幅を固定するため、それ以上の幅のものははみ出してしまいます。
• 指定した幅を超えるURL（アルファベット続きの文字列）もはみ出します

tumblrのRSSをブログに貼付けられる『tumblrss』 | CREAMU　より引用

上記の点が、画像を表示する際の致命傷に・・・

使用するツール

PHP5から搭載された、SimpleXMLを使用してやってみます。

• PHP のバージョン 5 にバンドルされた SimpleXML エクステンションについて学びましょう。SimpleXML エクステンションを使うと、PHP ページで XML をクリエリーし、検索し、修正し、そして PHP で使いやすい構文で再公開することができます。
• スクリプト言語であるPHPとOracleの連携の他、XML、オブジェクト指向、デザインパターン、周辺ツールについて、色々と試したり調べたりしたことを備忘録的にまとめて公開

tumblrが吐き出すフィードの実例

以下は自分のtumblr「気になる絵・写真などをクリップ」のフィードの一部。ちなみにtumblrのフィードはRSS2.0。

<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0">
<channel>
<description>絵を描く・グラフィック作成する等の際に参考になりそうなものを集めます。</description>
<title>気になる絵・写真などをクリップ</title>
<generator>Tumblr (3.0; @love210)</generator>
<link>http://love210.tumblr.com/</link>

<item>
<title>Shiitake's tumblr. - otsune: handa: 2008083001.jpg 464×505...</title>
<description>
<img src="http://media.tumblr.com/gaAMzUeZkdm1wnsc48MSshyz_500.jpg"/>
<br/>
<br/>
<a href="http://tiga.tumblr.com/post/49063456/otsune-handa-2008083001-jpg-464x505-pixels" target="_blank">Shiitake's tumblr. - otsune: handa: 2008083001.jpg 464×505 pixels...</a>
</description>
<link>http://love210.tumblr.com/post/49191453</link>
<guid>http://love210.tumblr.com/post/49191453</guid>
<pubDate>Mon, 08 Sep 2008 12:00:29 +0900</pubDate>
</item>

現在つまづいているところ

tumblrのフィードである、上記xmlを読むと、自分が表示したいと考えている箇所は以下にほぼ集約されていることがわかる。

<description>
<img src="http://media.tumblr.com/gaAMzUeZkdm1wnsc48MSshyz_500.jpg"/>
<br/>
<br/>
<a href="http://tiga.tumblr.com/post/49063456/otsune-handa-2008083001-jpg-464x505-pixels" target="_blank">Shiitake's tumblr. - otsune: handa: 2008083001.jpg 464×505 pixels...</a>
</description>

しかし、<br />の重ね書きなんて取っ払いたい。画像クリックで飛ぶリンク先も、自分のtumblrでなく、画像保有元（リンク元）に飛ぶようにしたい。

要は、xmlを以下のように整形できればよいのだが、そういうことは可能なのだろうか・・・？

<description>
<a href="http://tiga.tumblr.com/post/49063456/otsune-handa-2008083001-jpg-464x505-pixels" target="_blank"><img src="http://media.tumblr.com/gaAMzUeZkdm1wnsc48MSshyz_500.jpg"/></a>
</description>

• DOM(PHP版)入門
• PHPでのXMLの編集・削除の方法 - 教えて！goo

あれ？上記参考リンクに、xmlのノードの削除や置換の方法が載ってる・・・これを参考にすれば、xmlの整形が出来そうな気がしてきた・・・！

また、画像の横幅を250pxくらいに統一して表示したいのだけど、それをPHPで行うことはできないだろうか・・・？（CSSで揃えれば簡単だけど、あえてそれに頼らずに）

関連する記事

• tumblrのフィードをPHPで読み込んで表示（作成中ver）

トラックバック(0)