Snap Preview Anywhere*リンク先のサムネイルを表示する
外部リンクのサムネイルを表示しようと色々探していたのですが、Snapというものを以前からつかってみようかなと思っていたら…
なんとWordPressのプラグインになっているじゃないですか!
ということで、手軽にできるので、ご紹介。
1.
Snapサイトで手続きをする。
こちらのサイトから、Snapを使うための手続きをします。主にKeyを取得するのが目的。
右下の緑のボタン「Sign Up Now」をクリックする。
外国語になっている場合、日本語にも対応しているので、左上の日本の国旗をクリックします。
「今すぐ登録を」をクリックします。
2.
Snapを表示するための設定
1を終えると、サムネイル表示するカスタマイズページにたどり着きます。
カスタマイズしていくと、右のサムネイル表示が変わっていくので、それを見ながらしていくといいです。
「お客様のロゴの追加」は、後からできないので、ここで設定しておきます。
「+高度な設定」の+を開くと詳細設定できます。
※「お客様のロゴの追加」以外は、WordPressのプラグイン、Snap Preview Anywhere導入後設定できます。
カスタマイズが終わったら、「次へ」を押し、自分のホームページ、メールアドレスを入力し、「下記の使用許諾契約に同意します。」にチェックして、次へを押します。
すると、コードをコピーしてくださいの画面になるので、取りあえず、そのページを保ったままWordPressにプラグインを導入します。
3.
PluginのDownload
先ほどの「お客様コードをコピーしてください」の画面の下のほうに、「その他特定のブログの素早いインストール」とあるので、WordPressをクリックします。(こちらのサイト)
真ん中の下の方に「Downloads」にプラグインのリンクダウンロードがあるので、クリックして、alt-spa.zipをダウンロードします。
4.
ファイルをPluginフォルダへ入れて、Upload。
ダウンロードしたフォルダを解凍し、プラグインフォルダに入れてアップロードし、プラグインを有効にする。
5.
管理画面
管理画面にログインし、各種設定をクリックすると、「SPA」が表示されているので、クリックします。
6.
SPA Keyの設定
2で「お客様コードをコピーしてください」のページのコードを見てみます。
defer=”defer”
id=”snap_preview_anywhere”
type=”text/javascript”
src=”http://spa.snap.com/snap_preview_anywhere.js?ap=1&
key=●●●&sb=1&
th=silver&cl=0&si=0&
oi=1&lang=ja-jp&
domain=サイトURL”>
上記のコードのkey=●●●&sb=の●がkeyになっているので、それをコピペして、「SPA Key:」のところに貼り付けます。
Display Snap Searchbox below the thumbnail?
チェックをすると、サムネイルの欄に検索ボックスを配置する。
Display Preview for all links? (If disabled, you will need to add class=”snap_preview” for links you want the SPA to display on.
全てのリンクをプレビューするか否か、もしチェックしない場合は表示されないのですが、リンクのタグに
class=”snap_preview”
を入れると、そこだけサムネイルが表示されるようになるみたいです。
Display Preview for internal links? (Only works if preview is enabled for all links)
内部リンクのプレビューをするか否か。
Automatically add the code to your footer? (You’re theme needs to have wp_lovelog_footer() for this to work.)
WordPressで使用している自分のテーマのfooter.phpを見てください。
上記のタグは入っていますか?
もし入っていない場合は、書き込んでアップしてください。
例:デフォルトのテーマの場合