WordPressには自動整形機能(wpautop関数)が備わっており、例えば「Classic Editor」でテキスト入力する場合、改行するだけできちんと段落タグ(<p>タグ)が挿入され記事制作の効率を上げてくれています。
ただ独自に挿入したHTMLで思わぬところに<p>タグや<br>タグが挿入されてしまう場合があり困る場合もあります。
私は「Classic Editor」を使っていますが、記事を書くときにはいちいち<p>タグや<br>タグを自分で入力しているのでそもそも自動整形してもらう必要がありません。そんなことならいっそその機能を停止してしまえば良いと考えたのですが、そうすると「ブログカードが機能しない」という状況が発生してしまいました。
私は「JIN」というWordPressテーマを使っていますが、少なくともこのテーマでは自動整形機能をもろに利用してブログカードを生成しているので非常に具合が悪いわけです。
しかし、勝手に挿入される<p>タグや<br>タグは非常に邪魔ではある。というわけで、ChatGPTにお願いして適切なスクリプトを書いてもらいました。この記事では当ブログでも利用しているそのスクリプトを紹介します。
また、紹介するスクリプトは「ブロックエディタ(Gutenberg)」でも動作します。
自動挿入される<p>と<br>をなくしブログカードを維持するスクリプト
具体的なスクリプトと使い方
使い方としては上のスクリプトをコピーして「function.php」に貼り付け、赤い部分を自分のアドレスに変更すれば動作します。1つ目は単なるコメントなのでそのままでも動きますが、2つ目の赤い部分は変更してください。
例えば、
「https://www.example.com/」なら「https:\/\/www\.example\.com\/」
「https://example.net/」なら「https:\/\/example\.com\/」
のように、「スラッシュ」と「ドット」の前に「\」が挿入された形で変更すれば動作します。
機能の解説
うまく機能していればどうでもいいことですが、一応何をやっているかの解説をします。
「JIN」ではWordPressの自動成形機能を利用して、「ソースコードの文頭かつ<p>タグで囲まれている記事内リンク」を判別してブログカードを出力しています。
そのため自動成形機能をオフってしまうと<p>タグで囲まれた記事内リンクを発見できなくなりブログカードが出力されなくなってしまうわけです。
そこで、自動成形機能を解除した後、改行コードで囲まれた記事内リンクを個別に<p>タグで囲むということをしています(ソースコードの文頭に越させなくては行けないので改行コードの「\n」も追加しています)。
つまりは、わざわざオフにした機能の一部を自前で用意したということになります。そうまでしてでも自動成形機能を解除したいくらい、個人的には苦手な機能なのです。
以上皆様のお役に立てれば幸いです。
この記事を書いた人
最新記事
- 2024年11月14日
「ポチップ」をなんとか「Classic Editor」で使う方法 - 2024年11月13日
【GA4】Google Analytics 4の遅延読み込み用JavaScript - 2024年11月12日
【jQueryなし】表示された画像をふわっとフェードインさせる方法 - 2024年11月8日
【JIN】WordPressの<p>タグや<br>タグの自動挿入を停止してブログカードの機能を維持する方法 - 2024年11月7日
【jQueryなし】Youtubeの埋め込み動画を遅延読込してふわっとフェードインさせる方法