WordPressのカスタマイズ方法やプラグインレビューを中心に、パソコン/動物/植物のことなどを紹介するホームページです
Plugin "Get backlinks" that generates a link tag to the page you are browsing and displays a copy button

閲覧中のページへのリンクタグを生成し、コピーボタンを表示するプラグイン「Get backlinks」

公開日:2016年12月2日 アクセスアップ/PV数改善 コンテンツ追加

他のブログなどで自分のページを紹介してもらう場合、htmlタグを使い慣れている方や、ツール独自のクイックタグ(ショートカットボタン)の使い方を知っている方なら簡単に挿入することができるリンクタグの設定。

リンクタグの基本コードは
<a href=”リンクページのURL”>リンク先の名称(アンカーテキスト)</a>
なので、このコードをコピーして、

  1. リンクページのURLの入力
  2. リンク先の名称(アンカーテキスト)の入力

を入力すればハイ完成!!なのですが、わざわざ手間をかけてリンクを挿入しようという機会は少ないもの。

また、外部からの直接リンク(被リンク)が多いページは検索エンジンから見て評価が上がり、検索順位に影響することもありますから、特に興味を持って見た方が各ブログ記事などには是非ともリンクを張ってもらいたいものですね。

「Get backlinks」は表示されているコードをそのままコピペするだけで簡単に別のサイトやブログへ閲覧しているページへのリンクを挿入してもらえるようにするプラグインです。

同様のプラグインに

本文の下へ閲覧中のページへのリンクコードを表示するプラグイン「WP Link To This Post」

というのがありますが、「WP Link To This Post」プラグインとの違いは以下の通りです。

  1. コードが表示される画面の下にクリップボードへコピーするためのボタンが表示される
  2. コード表示画面の中の文章を自由に加工してもらうことができる
  3. リンクを促すコンテンツの位置をショートコードで任意に設定することができる

【Get backlinks】プラグインの基本的な機能・できること

  1. ショートコードを使って任意の位置へ閲覧しているページへのリンクコードを表示
  2. 表示されているコードのコピーボタン
  3. リンクコード表示窓内の文章を自由に加工することができる(アンカーテキストなどを変更してからコピーができる)
  4. ウィジェット表示

本記事を参考にWordPressサイトへプラグインの導入を検討される方へ

WordPressは古くから無料で配布されているサイト作成ツール(CMS)で、随時改良が加えられており、さまざまなバージョンが存在します。さらにWordPressを動かすためのプログラムであるPHP、サイトのデータを保存しておくためのデータベースについても様々なバージョンがあります。そしてWordPress本体同様にプラグインについてもさまざまなバージョンが存在します。本記事を参考にプラグインの導入をお考えの方は、以下に留意の上でインストールするようにしてください。

  • テスト環境での動作に基づいた紹介記事ですので、すべての環境で正常に動作するかどうかは不明です
    ※本記事の内容についてはページ内に記載しているプラグインバージョンのものになります。現在のバージョンと異なる場合、機能などが異なる場合があります。
    ※また、ページによってはテスト環境、テストしたプラグインバージョン等の表示が本文内にない場合、ページタイトル下にある最終更新日当時の情報となりますので、現在のバージョンでは全く違う機能となっているかも知れません。
  • プラグインに無料版と有料版(Pro版)がある場合、特に記載がなければ無料版の情報のみを紹介しています
  • このページでプラグインを使用する際に必要なショートコードやコードなどは、コピーして使用することができますが、環境によっては記号などが文字化けすることがあります。コピーしたのに動作しない場合は特に「”」「’」などの記号を入力し直してみてください。
  • プラグイン本体の動作不具合や質問などは公式サイトのフォーラムなどで行ってください(ここでは質問にお答えすることはできません)

【Get backlinks】プラグインの設定画面や表示の日本語化と翻訳

【Get backlinks】プラグインは言語の変更に未対応ですので表示のまま設定することになります

【Get backlinks】プラグインのインストールと設定

インストール方法

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

WordPressを使い始めて間もない方(初心者の方)は、より詳細なプラグインのインストール手順や、インストール時に起こる問題などへの対処方法をまとめた【WordPress】プラグインのインストール&追加方法とエラー対処の方法も併せてご覧ください。

【Get backlinks】プラグインの基本的な使い方

[get_backlink]

というショートコードを任意の場所へ挿入することで

のようなコンテンツが追加されます。

また、ウィジェットが用意されているので、簡単にサイドバーなどへ機能を追加できます

【Get backlinks】プラグインの便利な使い方・カスタマイズ方法など

より便利に使うカスタマイズ技やテストサイトで使用した結果や感想、WordPressのプラグイン公式配布ページには書かれていない事柄などを紹介します。

ボタンを日本語表記にする

上の画像ではボタンが日本語になっていますが、標準は英語表記になっています。変更するにはプラグインのソースを直接変更する必要があります
「プラグイン」→「プラグイン編集」から「get-backlinks」を開き「getbacklink.php」の69行目あたりからはじまる以下のコードを編集します

<?php
?>
<button class="btn btn-primary" data-clipboard-action="copy" data-clipboard-target="#bar">Copy</button>

<script src="https://cdn.jsdelivr.net/clipboard.js/1.5.13/clipboard.min.js"></script>

<script>

var clipboard = new Clipboard('.btn');
clipboard.on('success', function(e) {
console.info('Action:', e.action);
console.info('Text:', e.text);
console.info('Trigger:', e.trigger);
e.trigger.textContent = 'Copied';
window.setTimeout(function() {
e.trigger.textContent = 'Copy';
}, 3000);
e.clearSelection();
});

clipboard.on('error', function(e) {
console.error('Action:', e.action);
console.error('Trigger:', e.trigger);
e.trigger.textContent = 'Press "Ctrl + C" to copy';
window.setTimeout(function() {
event.trigger.textContent = 'Copy';
}, 3000);
});

Copy/Copied/Press “Ctrl + C” to copyと書かれている部分を日本語にします。変更後の例としては


<?php
?>
<button class="btn btn-primary" data-clipboard-action="copy" data-clipboard-target="#bar">リンクタグをコピーする</button>

<script src="https://cdn.jsdelivr.net/clipboard.js/1.5.13/clipboard.min.js"></script>

<script>

var clipboard = new Clipboard('.btn');
clipboard.on('success', function(e) {
console.info('Action:', e.action);
console.info('Text:', e.text);
console.info('Trigger:', e.trigger);
e.trigger.textContent = 'クリップボードにコピーしました';
window.setTimeout(function() {
e.trigger.textContent = 'リンクタグをコピーする';
}, 3000);
e.clearSelection();
});

clipboard.on('error', function(e) {
console.error('Action:', e.action);
console.error('Trigger:', e.trigger);
e.trigger.textContent = 'コピーに失敗しました。キーボードの "Ctrl + C" を使ってコピーしてください';
window.setTimeout(function() {
event.trigger.textContent = 'リンクタグをコピーする';
}, 3000);
});

という感じにします。このままでいいという方はコードをそのまま上書きすれば完了です(きちんど同じ文のみコピーしないとエラーが発生します)

ボタンや表示枠などのスタイルを編集する

表示枠は「プラグイン」→「プラグイン編集」から「get-backlinks」を開き「getbacklink.php」の59行目あたりからはじまるCSSコードを編集します

ボタンのスタイルは「btn btn-primary」というクラスが割り当てられていますので、テーマのCSSに追加するか、独自のボタン用CSSがある場合にはクラス名を変更します

リンクタグに追加の記述をする

生成されるリンクタグは単純に「サイト名-ページ名」というアンカーリンクを持つリンクになっています。これを変更するには
55行目あたりの

<a href='. $currenturl .'>' . $blogname .'-'.$blogtitle . '</a>
  1. . $blogname .がサイト名
  2. .$blogtitle .がページのタイトル

なので表記を変更したり、

<a href='. $currenturl .'>' . $blogname .'-'.$blogtitle . ' target="blank"</a>

と赤字部分の属性を追加することで、リンク先を別タブで開くようにするタグを生成することもできるようになります

おまけ プラグインを使わずにリンクコードを表示する方法

完全におまけ情報ですが、ボタンなんかいらないから見ているページへのリンクコードだけ表示したい!!という方のために、現在表示しているページへのリンクコードを表示するPHPコードを紹介しておきます。

投稿の本文内でPHPコードが動作するようにする「EXEC PHP」などのプラグインがインストールされていることが前提です。

以下のコードを本文内やテキストウィジェットへコピペすればコードが表示されます

<a href="<?php echo get_permalink( $post->ID ) ?>" target="blank"><?php echo get_the_title() ?>-<?php echo get_bloginfo( 'name' ) ?></a>

簡単にコード解説すると
get_permalink( $post->ID )でページのURLを取得します
echo get_the_title()でページタイトルを取得します
get_bloginfo( ‘name’ )でサイト名を取得します
そして、これをリンクコードの中に入れ、文字列として表示させるためにtextareaタグで囲めば完成です。

案外簡単ですね。ボタン表示をしたい場合には素直にプラグインを使いましょう。

WordPressのカスタマイズ・不具合対応などご相談ください

Wordpressのカスタマイズ、不具合解消のご相談はすべてココナラのダイレクトメッセージからお受けしております。まずはこちらのバナーからお気軽にお問い合わせください。