Wordpressでテキストリンクにマウスオーバーしたときリンク先のプレビューを表示するプラグイン「WP Live Preview Links」 | Knowledge Base

テキストリンクにマウスオーバーしたときリンク先のプレビューを表示するプラグイン「WP Live Preview Links」

GoogleAnalyticsのレポートなどでページへのリンクにマウスオーバー(マウスを重ねた)とき、小さいプレビューが表示されますよね?「WP Live Preview Links」はこれと同じ効果をWordpressのサイトで実装できるプラグインです。

※2018年12月現在公式サイトでの配布は行われていません。別のサイトへ作者がアップロードしたファイルを入手して使用することが可能なようですので詳しくは文末の『公式サイトでの配布はしていないようです』の項目をご覧ください

【WP Live Preview Links】プラグインの基本的な機能・できること

  1. テキストリンクに対してプレビュー表示できる

特に重要というプラグインではないように思えますが、テキストリンクに対して吹き出しでプレビューが表示できるので単純に格好いいページができます。

この記事の内容について
このプラグイン紹介記事は簡易的に動作テストをした上で紹介していますが以下の点にご注意願います
  1. すべての環境で動作するとは限りません
  2. できる限り最新のバージョンの情報を紹介するようにしておりますが、閲覧される時期によってはバージョンが変わり、仕様が大きく変更されている場合があります
  3. 有料版と無料版がある場合、テストは原則無料版のみで実施しています
  4. テスト環境については文末に記載しています
  5. 使用方法で紹介しているショートコードをコピーして使用すると、環境によっては記号などが文字化けすることがあります。コピーしたのに動作しない場合は特に「”」「’」などの記号を入力し直してみてください。

【WP Live Preview Links】プラグインの設定画面や表示の日本語化と翻訳

当サイトで私が翻訳した【WP Live Preview Links】プラグインの日本語化ファイルを配布しています。

翻訳ファイルは

Wordpressプラグイン【WP Live Preview Links】の日本語翻訳ファイルのダウンロードページです。

からダウンロードできます(ダウンロードの方法や日本語の適用方法なども解説しています)

翻訳することで設定が容易になり、重要な項目の設定漏れも少なくなりますから日本語化をお勧めします。

【WP Live Preview Links】プラグインのインストールと設定

インストールと設定方法

インストールはプラグインの新規追加でプラグイン名で検索してインストールするか、ページ先頭の画像をクリックして表示されるWordpressのプラグイン公式配布ページがダウンロードしてからアップロードインストールします。

インストール方法の詳しい解説は

Wordpressと言えばさまざまな追加機能を使って思い通りの表現や動作ができるのがブログやHTMLで作ったサイトと違って楽しいところですね。ここでは基本的なプラグインの導入の仕方とトラブルが発生した場合の対処方法について解説します。
を参照ください

設定としては

  1. リンクプレビューを表示するのが「外部のみ」なのか「内部のみ」なのか「すべて」なのかの選択
  2. プレビュー表示するサイズ

など。日本語化すれば設定は簡単にできると思います。

他にもいろいろと設定項目があるのですが、過去には違う要素の多かったプラグインのようで設定内容はこれ位しか反映されません。

【WP Live Preview Links】プラグインの基本的な使い方

テキストでのリンクに対して動作します。ページを表示してマウスオーバーしてみると、リンク先のプレビューが吹き出しのように表示されます。

ただし、プレビューが表示されるのは単純なテキストリンクだけで、

  1. ブログカードを使ったリンク
  2. 画像を使ったリンク
  3. リンクコードなどをカスタムフィールドなどから引っ張ったリンク

では動作しませんでした

※2018年12月のテストではSimplicity2テーマのブログカードを使ったリンク表示でもきちんと動作しました。

公式サイトでの配布はしていないようです

非常に有益なプラグインだと個人的には思うのですが、Wordpress公式リポジトリ(配布ページ)では2018年12月現在確認したところ、配布していないようです。

他のプラグインでも長く更新されていないといった理由で一旦配布停止になり、後々再び配布されるようになることもありますので、この紹介記事は残しています。

このプラグインの作者はGithub上にもソースを残していますので、必要な方は

WordPress Plugin: See a live scaled preview of the site you are linking to prior to clicking on it. - soderlind/wp-live-preview-links

からダウンロードして使用することができます。

※上のリンクから提供している翻訳ファイルも適用できました。

※一応2018年12月現在でこのファイルを入手してテストサイトで使用したところでは正常に動作するようですが、公式リポジトリで配布されていない、いわゆる野良プラグインですので、使用については自己判断でお願いします。

Wordpressの本

Amazonの人気商品楽天市場の人気商品
CS Shop
【中古】 本格ビジネスサイトを作りながら学ぶWordPressの教科書(2) スマートフォン対応サイト編 /プライム・ストラテジー【著】 【中..

【中古】 本格ビジネスサイトを作りながら学ぶWordPressの教科書(2) スマートフォン対応サイト編 /プライム・ストラテジー【著】 【中..

498 円 (税込)
プライム・ストラテジー【著】販売会社/発売会社:ソフトバンククリエイティブ/ 発売年月日:2013/08/29JAN:9784797370966
一歩先にいくWordPressのカスタマイズがわかる本 仕組みや考え方からちゃんとわかりたい人のために [ 相原知栄子 ]

一歩先にいくWordPressのカスタマイズがわかる本 仕組みや考え方からちゃんとわかりたい人のために [ 相原知栄子 ]

2,894 円 (税込) 送料込
評価 4
仕組みや考え方からちゃんとわかりたい人のために 相原知栄子 大曲仁 翔泳社イッポ サキ ニ イク ワードプレス ノ カスタマイズ ガ ワカル ホン アイハラ,チエコ オオマガリ,ヒトシ 発行年月:2016年04月08日 ページ数:319p サイズ:単行本 ISBN:9784798130934 1 準備編..
楽天ウェブサービスセンター CS Shop

プラグインに関するお問い合わせ

「こんなプラグインないの?」「設定方法をもっと詳しく教えてほしい」「プラグインを少しカスタマイズして使いたい」などのご相談は、こちらのリンクからお願いします(【ココナラ】のサイトへ移動します)。

ココナラ Wordpress プラグイン探し バナー
トップへ戻る