【広告】

Amazonブラックフライデーが12月2日まで開催中です!

個人的には、Anker製品か、コカ・コーラがかなり安くなっているのでおすすめです!

高級キーボードで有名な東プレが最近発売した「REALFORCE R3」もセールをやっていました!詳しくはこちらの記事を確認してみてくださーい。

【Search Regex】noopenerは残して、noreferrerだけを一括削除する方法

2021年10月19日ブログ

Search Regex のアイコン

この記事では、WordPress の一括置換プラグイン「Search Regex」を使って、noopener は残して、noreferrer だけを一括削除する方法について書きます。

Search Regex のスクリーンショット

WordPress5.1(2019年3月11日)から、新しいタブで開く(target=”_blank”)に設定しているリンクに自動で、「rel=”noopener”」が付与されるようになっています。

僕、今までそんなこと一切知らなかったです。

ちょー簡単に言うと、「noopener」は必要で「noreferrer」はいらない属性です。もう少し詳しく言うと、どちらも新しいタブでリンクを開くに設定している時のセキュリティ関連の機能です。

noopener が、新しいタブでリンクを開いた時に、リンク先が危ないサイトかどうかを判別してくれます。もし悪意があった場合は、リンク元のこちらのサイトに悪影響が及ぶので、それを未然に防いでくれるというわけです。

つまり、新しいタブでリンクを開く(target=”_blank”)とセットで設定しとかないといけない大事な属性です。WordPress で記事を書いている場合は、自動で付与されるようになっているので安心です。

noreferrer は、リンク元の情報をリンク先に送らないようにする設定です。これも一見、大事な属性のような気がしますが、アフェリエイトプログラム(A8 や、もしもアフェリエイト)を利用していた場合に、うまい具合に情報が計測されない可能性があります。

成果は発生するようなんですが、「その成果はあなたのどの記事から発生したのか?」などの情報を渡さないので、詳細が確認しにくいというわけです。ですので、アフェリエイトを利用している場合は不要な属性になります。

もちろん、あればいいに越したことはないので、アフェリエイトを利用していない場合は、そのままでいいと思います。

そこで、既に投稿しちゃって「noreferrer」が自動的に付与されている記事を検出して、noreferrer属性だけをピンポイントで一括削除しようという魂胆です。

参考:WordPress「target=”_blank”」時に付く「noreferrer」だけを自動で除去する方法(noopener は残す) | Tanweb.net

ダウンロード方法

記事の文章やHTML を一括検索、置換するWordPress プラグイン「Search Regex」を使います。

WordPress 管理画面 → プラグイン → 新規追加 からダウンロードできます。

「Search Regex」と検索してでてきたものをインストールしましょう。

Search Regex のインストール

インストールできたら、「有効化」でプラグインを使えるようにします。

使い方(noreferrer を削除)

バックアップを作成

Search Regex は、データベースを直接書き換えるので、まずは万が一に備えてバックアップを作成します。

WordPress 管理画面のツール → エクスポート → すべてのコンテンツにチェックを入れて、「エクスポートファイルをダウンロード」をクリックします。

WordPress の投稿をバックアップ

パソコンに「pc.WordPress.日付」というファイルがダウンロードされたら完了です。

バックアップファイル

Search Regex で一括置換

ツール → Search Regex をクリックします。

ツール - Search Regex

検索欄に、以下のコードを貼り付けます。末尾に「”」がないのはわざとです。

rel="noopener

貼り付けたら、検索をクリックします。

「rel="noopener」で検索

沢山、記事がヒットします。そりゃ自動付与で何も弄ってないですからね。

「rel="noopener」の検索結果

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

rel="noopener

貼り付けたら、プレビューのハイライト表示が黄色 → オレンジ になります。置換後のイメージをここで確認できます。

ちゃんと、オレンジハイライト部分が「rel="noopener」になっていて、前後の文章もおかしくなかったら、「すべて置換」をクリックします。

この時、余計な半角空白があったり、余計な文字が入ってると大変なことになるのでしっかり確認してから押すようにしましょう。

「rel="noopener」に置換

置換が開始されます。1000以上あっても、数秒で完了します。ゲージが100%になったら、「完了」をクリックします。作業は終了です。

置換の進捗状況

消えてるかの確認

果たして、無事に置換(削除)されているのか確認してみます。

該当記事のページ上どこでもいいので好きなところを右クリック → 開発者ツール → ページのソースを表示 をクリックします。

この項目がない場合は、「お使いのブラウザ名+ページのソース表示方法」でGoogle検索してみてください。

開発者ツール - ページのソースを表示

ページのソースが表示されたら、CtrlFでページ内検索します。「noopener」で検索すると、オレンジ色になって確認できます。その後ろに「noreferrer」属性がなかったら、作業成功です。

noreferrer属性だけ消えてる

【余談】今後、自動で付与しないようにする

Search Regex で削除できるのは、既に投稿してしまった投稿記事に対してです。

新しく記事を作成して、「リンクを新しいタブで開く」にするたびに、「rel="noopener」属性が自動付与されます。

自動付与を防ぐには、子テーマの function.php に以下のコードを追加で記述します。既に書かれている文章は消さないように。

//noreferrer削除
function remove_noreferrer($the_content){
  $the_content = str_replace('noopener', 'noopener', $the_content);
  $the_content = str_replace('noopener', 'noopener', $the_content);
  return $the_content;
}
add_filter('the_content', 'remove_noreferrer', 9999);

記述できたら、「保存」をクリックして、変更を反映させましょう。

function.php へ記述したら忘れずに保存

参考:アフィリエイト収益を逃さないためにnoreferrer属性を削除する

まとめ

以上、WordPress の一括置換プラグイン「Search Regex」を使って、noreferrer属性を一括削除する方法についてでした。

こんなの目に見えない部分だから、知らないですよね。他にもまだまだ学ぶべきことはいっぱいあるんだろうなぁ…。楽しくてニヤニヤしちゃいます。

Posted by ナポリタン寿司