エタハーではおなじみの右上に写真がじわじわ動いているブログパーツ、Pholiotというのですが、こちらは僕の大好きなもので何度リニューアルしても必ずつけております。
Pholiotは非常に優れていてxmlファイルを読み込んでそちらで指定した表示方法で指定した画像を表示してくれるのですが、表示方法が多彩で、細かく設定することが可能です。
写真表示の単位もgalleryという単位でまとめられ、カテゴリーごとに表示させたりすることも可能です。
今までxmlファイルの作成はcollectプラグインとrandomentryプラグインを使用して作成しておりましたが、今リニューアルでThe blog of H.FujimotoさんのEntryImagesプラグインを利用するようにしました。
このプラグインは画像をピックアップするための便利機能が盛りだくさんでとても使いやすいです。
また今回からはギャラリーの機能を利用して、カテゴリー無し、オーストラリア、アジア、ニュージーランドの写真グループで表示させるようにしてみました。
参考までに設置方法を記しておきます。
EntryImagesプラグインのインストール
The blog of H.FujimotoさんのサイトからEntryImagesプラグインをダウンロードし、インストールします。
インストール方法などはダウンロード元を参照してください。
jpg以外は禁止の設定
Pholiotは画像の形式がJPEG以外はダメなのでそれ以外はピックアップしないように設定します。
プラグインの設定画面でEntryImagesの設定を開けると「除外するイメージのURL」と言う欄がありますので、そちらに、
/.*\.gif/
/.*\.png/
を加えます。
Pholiotの設置
残念ながらPholiotを配布されていたサイトは閉鎖されておりますので、こちらからダウンロードしてください。
こちらをダウンロード後、解凍していただきますと、フォルダの中には
・pholiot.swf
・pholiot.js
・pholiot.xml.txt
が出来ます。
インデックステンプレートを作成
こちらの中のpholiot.xml.txtの中身をインデックステンプレートとしてmovabletypeに登録します。
pholiot.xml.txtのxmlの中身は
・ランダムセレクトで15枚のギャラリー
・「オーストラリア」カテゴリーの中から15枚のギャラリー
・「アジア」カテゴリーの中から15枚のギャラリー
・「ニュージーランド」カテゴリーの中から15枚のギャラリー
が作成されるようになっておりますので自分の内容に沿うように適宜修正してください。
中身を見て想像が付くとは思いますが、
include_cats=”オーストラリア”
のオーストラリアの部分を自分のカテゴリー名に置き換えてください。
ランダムセレクトだけにしたい場合や、ギャラリーを増やすなど、ギャラリーの数を変える場合は
<gallery name="●●●●">
：
</gallery>
の単位で削除、追加してください。
出力ファイル名は「pholiot.xml」としてください。
Pholiotのアップロード
・pholiot.swf
・pholiot.js
を任意の場所にアップロードします。
表示するテンプレートの修正
Pholiotを実際に表示させるテンプレートの
<head> </head>のなかに
<script type="text/javascript" src="<$MTBlogURL$>pholiot.js"></script>
を追記、その際pholiot.jsが実際に置いてある場所を参照させるように変更してください。
実際に表示させる場所には
<script type="text/javascript" language="JavaScript">
showPholiot({url: ‘<$MTBlogURL$>pholiot.swf’, data_url: ‘<$MTBlogURL$>pholiot.xml’, bgcolor: ‘#FFFFFF’, width: ‘150’, height: ‘200’, menu: ‘false’});
</script>
を追記、こちらもpholiot.swf、pholiot.xmlを参照できるように変更してください。
また、背景色、表示の幅と高さもこちらで指定できます。
後は再構築。
言葉足らずでスイマセンです。
何とか意味を汲み取っていただきまして、楽しいPholiotライフを！！