MB-Support

パソコン初心者のサポートページ

1.ホームページにフルスクリーンスライドショーを設置する方法

 デジカメで撮影した写真をホームページに掲載する方法として、外部スクリププトを利用したフルスクリーンスライドショーを公開する事ができます。Piclens Publisher を使えば、ローカルにある写真を元に、スライドショーに必要なサムネイルファイルを作る事が可能です。


前回 までは、 デジタルカメラ で撮影した写真を、オリジナルサイズの写真と、縮小した写真を組み合わせてホームページに掲載する方法を紹介しました。 サムネイル表示からクリックしてオリジナルサイズの画像にアクセスする方法が、ページスペースにとっても、通信回線にとっても合理的でありますが、さらに凝った表示を簡単に実現できるスクリプトが公開されています。



どんな事ができるのか?まずは以下のリンクをクリックして、実際に体験してみましょう。 開いたページのサムネイル下段にある「Start Slide Show」を左クリックします。


PicLens テストページ - MB-Support


JavaScript が利用できる環境ならば、画像の読み込みが開始され、スライドショーが始まります。



これは、Cooliris,Inc が提供する PicLens Lite と呼ばれるもので、自分で撮影した写真や画像を、自分のサイトでスライドショー形式に表示できるスクリプトです。 スライドショーとは、複数の写真を順番に表示する機能で、下段のコントロールメニューで表示する画像を制御できます。



さらに、右下の「Full Screen」ボタンを押すと、全画面表示となります。 管理人は 19 インチ液晶を解像度 1280 × 1024 で利用していますが、元画像の解像度が 655 × 492 でも綺麗に拡大してくれます。 この時点で、あまり興味が無いと感じた場合は、ここで終了となります。もし、これを自分のサイトにも設置したいと思ったならば、先へ進みます。



仕組みは RSS に表示させたいオリジナルサイズの画像と縮小画像を指定して、サイトでは外部 JavaScript を読み込んできます。 この辺は理解できなくても大丈夫です。 外部スクリプトのため、簡単に利用できます。 必要なファイルは右。「pl_images」フォルダにオリジナルサイズの写真、「pl_thumbs」フォルダに縮小した写真を保存します。



あとは、サムネイル一覧を表示する「Gallery.html」と、スライドショーで必要な RSS ファイルです。 右上のスクリーンショットでは「instructions.html」が存在しますが、これは実際にホームページを公開する時には必要ありません。 そしてこれらのフォルダ名は自由に変更でき、そのアドレスを指定するのが RSS ファイルとなります。 外部スクリプトを利用するので、JavaScript に関してページに挿入するのは

<script type="text/javascript" src="http://lite.piclens.com/current/piclens.js">
</script>

こんな感じです。これを <head>〜<head> の間に記述します。あとは、RSS へのリンクが必須です。 このアドレスはサーバーのどこに保管するかにより異なるので、説明は後にしましょう。 そして、これらの事を知らなくても、ツールを利用して簡単に作る事ができるので大丈夫です。



PicLens Publisher インストール方法

1.外部スクリプトを利用するので、自前で一から必要なものを作る事も可能ですが、まずは仕組みを知るために簡単に作成できるツールをダウンロードしましょう。 今回利用するツールは、外部スクリプトを提供する会社と同じで、以下のサイトにあります。


PicLens | Immersive Slideshows Across the Web

サイトにアクセスしたら、「PicLens Publisher」をダウンロードします。「Download」ボタンを左クリックします。



2.セキュリティの警告が表示されます。「保存(S)」を左クリックします。



3.左メニューの「デスクトップ」を左クリックして、さらに「保存(S)」を左クリックします。



4.ダウンロードが完了したら「閉じる」を左クリックします。



5.デスクトップにダウンロードした「PicLensPublisher_1012.msi」アイコンをダブルクリックします。 バージョンは更新されていれば数字が上がっているはずです。 Windows インストール初期状態では拡張子「.msi」が表示されませんが、今回のインストールに拡張子の表示、非表示は関係ありません。



6.セキュリティの警告が表示されます。「実行(R)」を左クリックします。



7.インストールウィザードが起動します。「Next」を左クリックします。



8.インストールするフォルダを指定します。初期状態で指定された場所「C:\Program Files\PicLens Publisher\」で問題ありません。 そのまま「Next」を左クリックします。



9.Windows Vista(ウインドウズビスタ)の場合は「続行」、または、管理者権限のパスワードを入力します。 インストールが開始されます。しばらくお待ちください。



10.インストールが完了しました。「Close」を左クリックします。



11.PicLens Publisher を起動するには、デスクトップに作成されたショートカットをダブルクリックします。 このショートカットを削除しても、スタートメニューに組み込まれているので、そちらから起動する事もできます。 次は使い方を説明します(製作中)。




戻る 一覧表示 次へ


Copyright © 2019 MB-Support パソコン初心者のサポートページ All Rights Reserved.

管理人のご挨拶プライバシーポリシー著作権/免責事項