wordpressで外部リンクにアイコンを自動表示するCSS

wordpressを使っているときに、外部リンクに自動的にアイコンをつけたい場合がありますよね。
そんな時にどのような設定をすればいいのか、ということですが、一般的にはCSSを設定してしまうだけで大丈夫です。
既に運用しているウェブサイトの各リンクにいちいちclassを指定するのではなく、外部に向けたリンクの時は自動的にこのようなアイコンを一緒に表示するのが近年の流れですね。
こういったCSSを適用してあげると簡単に実現できます。
*:not(object):not(embed) a:not([href^="ブログのURL"]):not([href$=".jpg"]):not([href$=".png"]):not([href$=".gif"]):not(.elementor-button):not(.share-icon):not(.share-more):not([href='']):not(:has(img))::after {
content:" ";
background: url(アイコンのURL) no-repeat 100% 50%;
padding-right:24px;
min-height:24px;
}
上記コードのうち「ブログのURL」の部分には使用するウェブサイトのトップページURL（※wordpressの本体URLではなく）を入れてあげてください。例えばこのブログの場合はhttps://wednesdaylove.jp/などといったものです。
「アイコンのURL」の部分には、先ほどのアイコンのURLを入れます。
アイコンはこちらからダウンロードして使って構わないので、メディアにアップロードし、詳細情報からファイルのURLを確認してください。
右クリックでダウンロードと保存　→　

:not()という表記が続いていますが、これは()ではない、という意味になります。また並べて:not(〇):not(□)このようにすることで〇ではなく□でもない、と条件を追加することとなります。
つまり
:not(object)　objectタグでの埋め込みではなく
:not(embed)　embedタグでの埋め込みでもなく
a　（上記2個の要素の下ではない）リンク要素の中で
:not([href^="ブログのURL"])　リンク先が内部リンクではなく
:not([href$=".jpg"]):not([href$=".png"]):not([href$=".gif"])　リンク先が画像でもなく
:not(.elementor-button)　elementorのボタンのクラスが割り当てられておらず
:not(.share-icon):not(.share-more)　jetpackなどのシェアボタンのクラスが割り当てられてもなく
:not([href=''])　空のリンクでもなく
:not(:has(img))　リンクするものが画像でもない※という形ではないという意味。
となっています。
必要に応じて足したり引いたりして使ってください。
内部リンクを相対参照している場合は:not([href^="."])も必要ですね。
これとは別にpdfファイルにはpdfアイコンをつけるように
a[href$=".pdf"]::after {
content:" ";
display: inline-block;
width: 24px;
height: 24px;
background: url(PDFアイコンURL) no-repeat;
min-height:24px;
}
などの併記もあるといいと思います。
PDFアイコンはadobeのウェブサイトで使用許諾を確認してから使ってください。
PDFロゴアイコンの入手先
もしくは、最初のCSSで:not([href$=".pdf"])を追加してもいいでしょう。
また画像ファイルに関しては.jpegや.webpなども使っている場合は適宜追加して使いましょう。