Webページの中にあるリンク(URL)にカーソルを当てると該当のページを読み取ってプレビューウインドウを表示してくれるサービスです。これはなかなか便利ですよ。
私のBLOGにも取り入れてみました。
ということで今回のTechDayネタとして簡単に実装の手順を紹介します。
Snap Shotsにユーザ登録
Snap ShotsのページのPublishers / Bloggers
の「Already have Snap Shots on your site?」のリンクをクリックします。
以下のページからログインIDと Snap Shots を組み込みたいサイト(BLOGなど)のURLを入力します。
ユーザ登録でサイトのURLを指定するとBloggerなどの著名なBLOGサイトにはワンボタン・インストールを出来るようになっているようです。
そのボタンのちょっと下に「 Show Manual Install Instructions 」と記述されたリンクがあるのでこちらも確認してみましょう。
するとJavaScriptのコードが表示されます。このコードを自分のBLOGサイトで表示されるHTMLの</body>タグの前にコピペするだけでもSnap Shotsが機能します。コードの中に書かれている32文字の文字列が認証コードですね。
今回はワンボタン・インストール（INSTALL NOWのリンク）でインストールします。
するとウィジットを追加するためのBlogger管理ページが表示されます。
Snap Shots を追加するページを選択して「ウィジットの追加」ボタンをクリックして表示された画面の「保存」ボタンで変更を保存します。
Snap Shots ウィンドウのカスタマイズ
これで一応、Snap Shots が自分のBLOGページに追加されますがデフォルトのままのスナップショット・ウィンドウが表示されるのでウィンドウをちょっとカスタマイズしましょう。
ウィンドウの色の選択、言語設定、ウィンドウに表示されるロゴのアップロードをしてみます。
Snap Shotsの管理ページを表示します。
edit リンクをクリックするとカスタマイズ設定の画面が表示されます。
画面の色、言語、ロゴの設定をしているのがわかりますよね。
設定値を入れると即時で右側にプレビュー画面が出るので大変分かりやすいです。
設定が終わったら「Save」ボタンをクリックして終了です。
BLOGサイトの確認
それではSnap Shots をインストールしたサイトを確認してみましょう。
BLOG本文に書かれているリンクにカーソルを当てるとプレビュー画面が表示されていることが分かります。
こちらはRSSが有効になったときに表示されたウィンドウです。
0 件のコメント:
コメントを投稿