WordPress Plugin - Browser Shots

今日紹介する［Browser Shots］は簡単に指定したウェブサイトのスクリーンショット画像を埋め込めるWordPressプラグインです。
投稿や固定ページの編集画面で、ショートコードにURLと画像の横幅と縦幅を指定するだけで利用できます。

自分でスクリーンショットを撮影したり、画像を編集する作業が不要になるので大変便利です。

Plugin Directory : Browser Shots

なおこのプラグインは以前は［BM Shots］という名称でしたが現在は［Browser Shots］と名前を変えて開発が続けられています。

インストール方法

まずは［Browser Shots］のインストールですが、管理画面（ダッシュボード）の左側にあるメニュー「プラグイン」→「新規追加」からインストールする方法が最も簡単です。

右上に「プラグインの検索」という検索フォームがあるので、そこに「Browser Shots」と入力すると対象のプラグインが表示されます。
「今すぐインストール」をクリックして、プラグインを有効化すれば導入完了です。

公式のプラグイン・ディレクトリ「WordPress.org」からダウンロードする際は以下のURLからどうぞ。

Plugin Directory : Browser Shots

［Browser Shots］の特徴

  • 指定したウェブサイトのスクリーンショットを簡単に掲載できる。
  • 生成されたスクリーンショット画像はWordPress.orgが提供している外部サーバーに保存されます。
  • 画像は定期的に更新され、スクリーンショットが表示されない場合でも少し時間が経てば反映されるようになります。

使い方

基本的な使い方は以下。
冒頭に「browser-shot」を記述して、以降に引数を指定していく簡単なショートコードです。

[browser-shot url="http://example.com" width="240" height="200" alt="Sample" target="_blank"]

各引数の詳細は以下のとおり。

url
スクリーンショットを生成するウェブサイトのURLを指定します。
width
画像の横幅を指定。デフォルト値は「600」になっています。
height
画像の高さを指定。デフォルト値は「450」になっています。
target
「target=”_blank”」と指定すると新しいタブで開きます。
alt
生成されるimgタグに指定したalt属性を挿入します。デフォルトではURLが挿入されます。

注意点

生成されるスクリーンショットの画質が荒く、大きいサイズでの利用には向いていません。CSS側でサイズを調整して使用することをオススメします。

またマルチバイト文字に対応していないため、スクリーンショット内で日本語が文字化けする場合があります。この点は妥協するしかないようですね。