スポンサード リンク

ブログのサイドバーを飾るものとしていろいろなものが登場してるようです。 「The BlogBox Project」が提供しているPhotobloxは写真やグラフィックのスライドショーを簡単にサイドバーに置くことができます。
写真やイラストを趣味や仕事にしてる人には便利かも？



と言うことで、導入手順を簡単に。

（１）まずグラフィックの置き場所やスライドショーのスタイルを定義するXMLファイルをダウンロードし自分が借りてるサーバーの任意のディレクトリに置く。

（２）XMLファイルの任意の置き場所（例えば、http://www.xxxx.com/photobloxdata.xml）のURLエンコード情報を得る。

（３）HTMLに必要なスクリプトを記述する（表示させるサイズによってスクリプトに違いがあるのでサンプルページのソースを参考にする）


■ちなみに180X300サイズの場合

○ヘッドタグに

<!-- photoblox -->
<script type="text/javascript" language="JavaScript" src="http://www.mylaszlo.com/lps-krank/includes/embed.js"></script>
<!-- /photoblox -->

○ボディタグに

<!-- photoblox -->
<script type="text/javascript" language="JavaScript">lzEmbed({url: 'http://www.mylaszlo.com/lps-2.0/showcase/photoblox/photoblox180x300.lzx?lzt=swf&data_url=
http%3A%2F%2Fwww.xxxx.com%2Fphotobloxdata.xml',
bgcolor: '#ffffff', scale: 'noscale', width: '180', height: '300', menu: 'false'}); </script>
<!-- /photoblox -->

赤色の部分にURLエンコード情報を入れる。

XML内の画像URLを変更すれば任意の画像を表示することができます。
また、customizeタグの属性を使って動作を指定することもできます。

<photobloxdata>
　 <gallery>
　　 <customize fitimagetoview="false" fitviewtoimage="true" useframe="true" crossfadetime="3000"
　　　slidedelaytime="6000" motionmode="linear" panzoomtime="6000" zoomdepth="2"
　　　frameurl="lzmodules/assets/drop_shadow.png" origframesize="64" artframewidth="10"/>
　　 <image>
　　　　 <imageurl>http://www.mywebpage.com/myimage1.jpg</imageurl>
　　　 <image/>
　　 <image>
　　　　 <imageurl>http://www.mywebpage.com/myimage2.jpg</imageurl>
　　　 <image/>
　　 </gallery>
</photobloxdata>

---