champlange_goldなどの新作テーマ5日連続リリースの際、アーカイブ内におまけ画像をふんだんに入れ込んだのですが、その写真を実際にテーマに当てはめた状態をプレゼンしたいなぁと思い、また手っ取り早くそれを実現するため、Smooth SlideshowというAjaxなスライドショースクリプトを利用してプレゼンテーマを作成しました。 実際にこのサイトのテーマ選択内にあるxxx_slideshowがこれなのですが、これを選択できるようにしたとたん「ダウンロードに無いんですけど〜」「やり方教えて〜」という反響が結構ありましたので、まずこのスクリプトの設置方法及びこれらテーマで行っているオートスライドショーの設定方法を紹介します。


ところでみなさんはSmoothGalleryをご存知でしたか？とってもクールなギャラリースクリプトです。まだ試したことがなければ是非サイトを訪れて、Showcaseをのぞいてみて下さい。
配布サイトはこちら↓
JonDesign's (Javascript) SmoothGallery: Mootools Mojo for Images | What is it ?

ちなみにchanpagne_goldなどで使っているのは実はこのスクリプトの前身SmoothSlideshowです。これらのスライドショープレゼンテーマを作成し始めた時はまだSmoothGalleryの存在を知らず...
今回のレポートは、実はSmoothGalleryをきちんと理解するために自分でやってみたので、その結果報告であったりします。

さてさて、XOOPSで使うには？ですが、何も難しいことはなく、いたって簡単なのですが、リクエストにお応えしてchampagne_goldを元にやってみることにしましょう。

ファイルをダウンロードして準備をする

1. 弊社提供のテーマセット、champagne_goldをダウンロード・解凍し、themesディレクトリに配置します。（※2重にならないように注意してください）
2. SmoothGalleryを解凍、XOOPSのルートディレクトリに配置します。
   かなり高機能なギャラリースクリプトですので、単にテーマ内だけでなく、XOOPS上の静的コンテンツや、XOOPSから切り離した 単独HTMLページなどから利用したい場合もあるだろうと思いますので、今回はココに配置することをお勧めします。 ちなみにこのSmoothGalleryの自動サムネイル作成の機能を使うためにcacheディレクトリをこのディレクトリ内に、パーミッション777で作成しておいたほうがいいです。
3. theme.htmlにSmoothGalleryのjsファイル、cssファイルへのリンクパスを記入します。

<link rel="stylesheet" type="text/css" media="screen" href="<{$xoops_url}>/SmoothGallery/css/jd.gallery.css" />

<script src="<{$xoops_url}>/SmoothGallery/scripts/mootools.js" type="text/javascript"></script>
<script src="<{$xoops_url}>/SmoothGallery/scripts/jd.gallery.js" type="text/javascript"></script>

<meta http-equiv="Content-Script-Type" content="text/javascript" />