広告 WordPress関連

WordPressの旧エディタで「ページ区切り」に付加されてしまう Pタグの構文エラーを対策する方法

スポンサーリンク

 

 

 

Affinger6の旧エディタで編集中の頁に「ページ区切り」 <!--nextpage-->を挿入して、確認のためプレビューするとChrome拡張機能の「HTMLエラーチェッカー」で、 " p タグが閉じていない" との構文エラーが発生します。 pタグエラー箇所は、ページ分割されたすぐ上の部分(行)に当たります。

自動でWebページの構文エラーが確認できる「HTMLエラーチェッカー」の入手先はここをクリック

この事象の解決策を、ネットでググってもヒットしないので、若しかすると、当サイトの特有の問題かもしれません。 当サイトでとった構文エラー対策を紹介します。

 

WordPress環境

  • Webサーバー:ロリポップ・ライトプランPHP7.4 モジュール版
  • WordPress :バージョン 6.1.1
  • Affinger6(Theme):バージョン20221111
  • Advanced Editor Tools プラグイン:5.6.0
Advanced Editor Tools 設定状況
旧エディタ設定画面の上級者向け設定にある「クラシックブロックとクラシックエディター内のパラグラフタグを保持」にレ点を入れています。(レ点を入れなければ <!--nextpage-->に pタグは付きませんので、構文エラーになりませんので、この問題は、Wordpressの自動整形に絡んでいると思われます。)

 

構文エラーになる発生要因

WordPressでは、<!--nextpage-->  コードによってページ分割します。 ビジュアルエディタの自動整形ため、pタグが付加されて<p><!--nextpage--></p> になると、<p> のみが取り残されてページ分割され 閉じる</p>が無いので「 p タグが閉じていない」との構文エラーが発生します。

なお、ブロックエディタで「ページ区切り」ブロックを使えば、この事象は発生しません。

 

構文エラーの対応策

対策
1
最も簡単な対策

最も手っ取り早のは、テキストエディタで、 <p><!--nextpage--></p>の pタグを削除してそのまま保存すれば、構文エラーになりません。 でも、ビジュアルエディタで何らかの編集作業を行って(テキストエディタで当該 pタグを削除しないで)そのまま保存してしまうと、構文エラーになってしまいますので、次の【対策2】をオススメします。

対策
2
”何もしない”ショートコードで「ページ区切り」をサンドイッチ


  • step.1 ショートコード作成

    以下の「何もしない」ショートコードコード [none] を子テーマの function.php に記述して作成します。


  • step.2 ショートコードで囲む

    ビジュアルエディタで、下の様に「ページ区切り」に[none]でサンドイッチします。


  • step.3 確認

    テキストエディタにすると、下の様になります。 [none] ショートコード含めて pタグで囲われていますがショートコード [none] が介在しているので、「HTMLエラーチェッカー」で確認すると、今度は構文エラーになりません。

     テキストエディタ画面
    <p>[none]<!--nextpage-->[none]</p>
    

備考(代替案)
Affinger6テーマをお使いの方は、[none]ショートコードを使わずとも、Affinger6 タグにある、「条件表示」の「エディタ用メモ」> [st-comment-out memo="メモ"] を使っても同様にOKになります。

 

何もしない[none]ショートコード・その他の使いみち

ビジュアルエディタの作成ページに注釈を入れたい時があります。 

その時は、【none】注釈コメント【/none】←( / を付けて閉じる)と表記すれば、Webページには「注釈コメント」部分が表示されず、ビジュアルエディタには「注釈コメント」が残ります。

 

 

以上、「旧エディタで「ページ区切り」に付加されるPタグ 構文エラーを対策する方法」でした。 実は、str_replace()関数でフィルターフックするなど試みたものの上手く行かず、以上の対処療法的な対策になってしまいました。 もっとスマートな解決策があれば、ご教授頂くと幸いです。

 

オススメ記事
blank
特定ページを指定してモバイルの時だけ「ページ分割」する方法

wordpressで作成した長文の投稿記事をブラウザで見た時、モバイル閲覧の場合はページが長くなるので途中でページ分割したくなる時があります。 ネット検索すると「モバイルの時にページ分割し PCはペー ...

 

 

スポンサーリンク

 

スポンサーリンク

 

t