tande lab.

[WordPress] 指定したURLのスクリーンショットを挿入する

functions.php に以下を追記することで
url入力したサイトのスクリーンショットを手軽に貼付けることができます。
スクリーンショットには自動でリンクが貼られます。

//URLを入力しスクリーンショットを撮る
function wpr_snap($atts, $content = null) {
	extract(shortcode_atts(array(
		"snap" => 'http://s.wordpress.com/mshots/v1/',
		"url" => 'http://tande.jp/',
		"link" => '',
		"alt" => 'My image',
		"w" => '480', // width
		"h" => '360' // height
	), $atts));

	if($link == '') { $link = $url; }
	$img = '<img src="' . $snap . '' . urlencode($url) . '?w=' . $w . '&h=' . $h . '" alt="' . $alt . '"/>';
	return '<p>' . '<a href="' . $link . '" target="_blank">' . $img . '</a>' . '</p>';

}

add_shortcode("snap", "wpr_snap");

デフォルトのスクリーンショットサイズを変更したい場合は、”w”と”h”の値を書き換えます。

スクリーンショットを表示させたい場所に下記のショートコードを貼り付けます。

[snap url="スナップ先URLを入力" link="リンク先URLを入力" alt="altを入力" w="横" h="縦"]

利用例
WordPress投稿画面での利用例
url以外の項目は全て省略可能です。

以下のサイトのコードを参考にして、
どや!?いつか使うかも知れない簡単に出来るWordPressカスタマイズまとめ | デザインどや!?

どや!?いつか使うかも知れない簡単に出来るWordPressカスタマイズまとめ

  • スクリーンショットのデフォルトサイズを変更
  • スクリーンショットにリンクを貼る
  • スクリーンショット先URLとは別にリンク先URLを指定できる(bitlyの短縮URLをリンク先に使いたかったので)

の3点をカスタマイズさせて頂きました。

早速スクリーンショット付きでリンク貼ってみました。
こんな感じで貼れます。ステキです。ありがとうございます。