無料WordPressテーマ Principle

WordPressテーマ Principleの機能や使い方、WordPress用レンタルサーバーに関する情報など

お得情報

サムネイル付きのリンクを簡単に貼る技(別ウィンドウで開くバージョン)

サムネイル付きのリンクを簡単に貼る技(別ウィンドウで開くバージョン)

WordPress専用レンタルサーバー人気No.1 → ConoHa WING

この記事は古いバージョンに関する情報なので、参考になりません。

画像つきのリンク

[browser-shot url=”http://soccer-tellrist.net/” width=”150″]

サッカー語り人

↑こういうの見たことありますよね。
 WordPress & chromeという環境の人なら、これがめちゃくちゃ簡単に作れます。

必要なもの

①WordPressのプラグイン「Browser Shots」

 WordPress管理画面の左端のプラグイン新規追加を開きます。
browser-shots
 「Browser Shots」で検索すれば出てくると思いますので、インストール有効化して完了。

②chromeの拡張機能「Create Link」

Create Link
↑ここをクリックして、右上の無料という所からCreate Linkをchromeに追加する。

 すると、chromeの右上に「Create Link」のアイコンが出てくると思います。
createlink
 このアイコンをクリックすると、一番下にconfigure…というのがあると思うので、それをクリック。Create Linkの設定画面になります。
createlink2
ここで、をクリックしてformatを追加します。

Nameは何でも良いです。
 ぼくは「thumbnail」にしています。

Formatの欄に、以下のコードを貼り付けます。


[browser-shot url="%url%" width="150"]
%title%

createlink3
 これで設定は完了です。

Create Linkの使い方

 まずchromeで、リンクしたいサイトを開きます。
createlink4 サイトを開いた状態で右上のCreate Linkのアイコンcreatelinkiconをクリックします。
 すると、先ほど設定したやつが一番下にあると思いますので、それをクリックすれば(別に何もならないんですが)、サムネイル付きリンクコードが、クリップボードにコピーされます。

 後はそれを記事にペーストすればOKです。

Browser Shotsをちょっといじる

 Browser Shotsは有効化しさえすれば何もしなくても、OKです。

 が、一つオススメのカスタマイズがあります。
 デフォルトでは、記事に表示されるサムネイルをクリックした時に、リンク先のページが同じウィンドウで開きます。

 できれば別ウィンドウ(タブ)で開いてくれた方がよくないですか?
 別ウィンドウ(タブ)で開いて欲しいという人は、ちょっとだけBrowser Shotsをカスタムしましょう。

Browser Shotsを編集

 WordPress管理画面の左にあるプラグインインストール済みプラグインを開きます。
 Browser Shotsの編集をクリック。
browsershots2

 すると、このプラグインのコードをいじれる画面が開きます。

 変なところをいじるとプラグインがおかしくなるので、慎重にして下さい。
 心配な人は全て選択してどこかにコピペしておくことをオススメします。
browsershots31

 ちょうど真ん中辺りに、こんなコードがあると思います。↓

if ( !empty( $image_uri ) ) {
    $image = '<img src="' . $image_uri . '" alt="' . $alt . '" width="' . $width . '" class="alignnone" />';
    return '<div class="browser-shot"><a href="' . $url . '">' . $image . '</a></div>';
}

 ここに「target=”_blank”」をねじ込みます。

if ( !empty( $image_uri ) ) {
    $image = '<img src="' . $image_uri . '" alt="' . $alt . '" width="' . $width . '" class="alignnone" />';
    return '<div class="browser-shot"><a href="' . $url . '" target="_blank">' . $image . '</a></div>';
}

 「”」とか「.」とか「’」とかをよく見て、場所を間違いないように入れて下さい。
 挿入するのがややこしかったら、まるまるコピペでもいいです。どちらにせよ間違わないように慎重に。

 以上でBrowser Shotsプラグインのカスタムも完了です。

 ではどうぞご自由に、サムネイル付きリンクを簡単に貼りまくってください。

おすすめサーバー

第1位ConoHa WING

どこよりもハイスペックで、どこよりも安いという異次元のコスパ。しかもワードプレスに特化されていて扱いやすい!現状では文句の付けようがない圧倒的No.1

第2位シン・レンタルサーバー

レンサバ業界の老舗とも言える安定のエックスサーバーが打ち出した新サービス!業界震撼のコスパはまさに新時代の幕開け!

第3位 MixHost

サーバースペックへのこだわりは随一、コスパも◎、利用者急上昇中の新世代レンタルサーバーです!

参考【徹底比較】ConoHa WING 対 エックスサーバー

参考【徹底比較】ConoHa WING 対 mixhost

参考【徹底比較】エックスサーバー 対 MixHost

コメントを残す




関連記事

Pick Up