限定公開のウェブアルバムを作る

HTMLの知識がない私でも、意外と簡単にWebアルバムを作れたので、それを紹介します。

（こんな感じのです）



PCに記録した写真データは、前触れなく突然消え去ります。
結婚する前の可愛かった妻との思い出がたくさん詰まっている、壊れたHDDは未だに捨てられません。

今残っているものは「また体重増えちゃった♥」と嘆いているのか、はしゃいでいるのか分からない妻の弛・・・ゲフン、ゲフン・・・。今でも可愛い妻です。

今は失いたくないデータはクラウドに保存しておくのが鉄則です。これなら災害などでPCごと壊れても、データは生きています。


私は写真や動画は「Flickr」と「Picasa」に保存しています。しかし、どうにも使いづらい。

自分ひとりで使う分には問題ないのですが、家族に見せたいときに苦労します。

私の親など、ふりっかー？ぴかさ？何それ？？と言う状態です。
妻に説明するときも「ピカソ」ではなく「ピカサ」だと言うことを理解してもらって、その後の説明を諦めました。

これらのサービスは高機能すぎて、万人が使いこなせるわけではありません。


そこで、私が求めるWebアルバムとは何かを考えました。

1. 「便利に使える」ではなく、「誰もが使える」
2. 離れて暮らす親がいつでも見られる
3. プライベートな写真なので閲覧は家族だけにする
4. 膨大なデータ量を保存する
5. できれば無料が良い

４と５を考えると「Picasa」しかないのですが、１がクリアできません。
１と２を考えると、どこかのブログが良いのですが４がダメです。
３は有名どころのブログであればできそうですが、結局は４の壁があります。

そんな都合のいいサービスありませ・・・ありました！このブログ「Blogger」だ！！
（実はここに至るまでに３日かかりました。）

やり方は色々あります。
知識のある人はJavascriptでPicasaからサムネイルを作成してブログに貼ればＯＫです。

しかし、残念ながら私にはそのような知識はなく、チャレンジはしてみたものの、あえなく挫折です。

そこで、「Picasa」と「Blogger」に用意されている標準機能のみで、限定公開のWebアルバムを作成することにしました。


まず「Picasa」と「Blogger」のアカウントを取得します。と言っても両方ともGoogleのサービスなので簡単に取得できます。

「Picasa」に写真をアップします。
容量無制限でいくらでもアップできます（2048ピクセルに自動縮小）。動画も無制限です（１Ｇ以内、１５分以内）。

ここまでは他サイトにいくらでも情報がありますので、検索しつつチャレンジです。

ブログの定義から外れる気がしますが、「Blogger」はブログを非公開にし、限定した読者のみを招待する機能があります。
これを利用します。

今後、読者側はGoogleにログインしていれば、限定公開を気にすることなくブログを閲覧できます。

こんな機能があることさえわかってしまえばあとは簡単です。
ブログを作ってPicasaから写真を掲載するだけです。

以下、その手順です。

まずは「Blogger」でブログを作成します。テンプレートは「シンプル」など適当で構いません。


新規にブログが作られますので、そのブログ名を押します。


設定を押します。


プライバシーの「編集」を押します。


「リストにブログを追加しますか？」
「ブログの検索を検索エンジンに許可しますか？」
両方とも「いいえ」を選択します。


「読者を招待」を押します。


招待された相手にメールが届きます。
メールの内容に従い、リンク先へ行きます。


「プライベートブログの読者として招待されました」となりますので、Googleにログインします。


「紹介メールを承認」します。


「承認された招待」となりブログの閲覧が可能になります。招待された側はこれで完了です。


次にブログに写真をアップします。（Bloggerの編集画面ではHTMLタブを選択）
「Picasaウェブアルバムから」を選択し、アルバムに載せたい写真を選びます。（複数同時選択可能です。）


Blogger上の編集画面にタグが生成されますので、これをすべて選択しコピーします。


何かのテキストエディタに張り付けます。そして「s320」という文字列を「s200」にすべて置換し、すべてコピーします。（※１）


Blogger上の編集画面に戻り、先ほどコピーしたものと入れ替えます。
あとはこれを公開して完了です。



※１
「s320」→「s200」は表示されるサムネイルのサイズ変更を行っています。

なお、標準状態ではWebアルバムとして幅が狭く縦に長すぎるので、ちょうど良いサイズにテンプレート幅を調整します。

また、私の場合はこのブログ「自己満備忘録」を家族には見られたくないため、プロフィールへのリンクを消しました。
（投稿者のリンクからプロフィールが閲覧でき、そこから各ブログに跳べる。）

需要があるかわかりませんが、リンクの消し方は次のとおりです。

テンプレート編集画面を開き、HTMLの編集を押す。
1457行目から1458行目を下記のように編集する。

<meta expr:content='data:post.authorProfileUrl' itemprop='url'/>
<a expr:href='data:post.authorProfileUrl' rel='author' title='author profile'>

　↓

<meta/>
<a>

ステルス完了です(-_-)v

記事名は「○○旅行」などで、その下にサムネイルが広がる。完璧です。
あとは好みのテンプレートに変えて、簡単で立派な「家族限定公開Webアルバム」ができあがりました。


［追記］
この「家族限定公開Webアルバム」に目次のようなものを追加しました。
＜非公開BloggerでFeedを使わずサイトマップ作成＞