サイノア外部リンクには「rel=”noopener”」が付く
WordPressの場合、外部リンクで別タブで開くようにしていたもの、つまり、「target=”_blank”」を付けたものには「rel=”noopener”」が自動的に付与されます。セキュリティの点からこのような仕様になっています。この辺の事情は調べればたくさん出てきます。例えばこちらの記事。
自分で設置したリンクなら投稿エディタの段階で”noopener”が自動的に付け加えてくれます。これでOKかと思いきや…。
「rel=”noopener”」が自動付与されないものもある
プラグインなどによって生成されたリンクではそうはなりません。例えば、このブログでは、「Auto-hyperlink URLs」というプラグインを導入しています。
これを使うと、URLだけをベタ書きしたものを自動的にハイパーリンクにしてくれます。この下、単にGoogleのURLを書いただけです。
自動的にハイパーリンクに変換されてクリックできるようになっています。
このソースを確認してみるとこうなっています。
「target=”_blank”」が付いていますが、「rel=”noopener”」は付いていません。「rel=”noopener”を付けるべき」という観点からするとまずい状態です。
「Auto-hyperlink URLs」を止めて、自分でちゃんと書き直せばいいのでしょうが、それは面倒です。
「rel=”noopener”」を付けてくれるプラグイン
こういう場合も、やはり、対応できるプラグインがありました。「External Links」というものです。
早速導入します。
有効化すると、肝画面のサイドバーに「外部リンクというメニューが追加されます。
これをクリックすると設定画面が出てきます。
色々と設定できるようですが、今回の目的では下のように設定します。
「外部リンク」タブの中で、「設定を適用」と「“noopener”を追加」にチェックを入れます。「rel属性の追加」のところは他のものにもチェックが入っていると思いますが、それらは外しておきます。後は、「変更を保存」をクリックすればOKです。
これで、先程のリンクのソースを再び見てみます。
「rel=”noopener”」が付加されています。他に「data-wpel-linl=”external”」もふかされてますが、これはこのプラグインの管理用のものだと思います。
他のプラグインによるリンクの確認
「Auto-hyperlink URLs」プラグインによる外部リンクは上手く行きました。他のプラグインによるものも確認しておきます。
Pz-LinkCard
外部リンクをカード形式で表示してくれるものです。例えばこんな感じ。
これは、このブログ内の別の記事をPz-LinCardを使って表示させたものです。この記事がPz-LinkCardの紹介です。
では、これで作った外部リンクを見てみます。
※これはキャプチャ画像です。クリックできません。
「External Links」を導入前の状態。
導入後。
無事、「rel=”noopener”」が付いています。
WP Associate Post R2
Amazonなどのアフィリエイトリンクを生成してくれるプラグインです。詳細はこちらの記事で。
表示例。
「External Links」を導入前のソースコード。
タイトル部。
三つのリンク。
「External Links」を導入後。
「rel=”noopener”」が付きました。「rel=”nofollow”」は最初から付いており、その状態も保存されています。
これで大丈夫そうです。
