Affinger6の旧エディタで編集中の頁に「ページ区切り」 <!--nextpage-->
を挿入して、確認のためプレビューするとChrome拡張機能の「HTMLエラーチェッカー」で、 " p タグが閉じていない" との構文エラーが発生します。 pタグエラー箇所は、ページ分割されたすぐ上の部分(行)に当たります。
この事象の解決策を、ネットでググってもヒットしないので、若しかすると、当サイトの特有の問題かもしれません。 当サイトでとった構文エラー対策を紹介します。
WordPress環境
- Webサーバー:ロリポップ・ライトプランPHP7.4 モジュール版
- WordPress :バージョン 6.1.1
- Affinger6(Theme):バージョン20221111
- Advanced Editor Tools プラグイン:5.6.0
旧エディタ設定画面の上級者向け設定にある「クラシックブロックとクラシックエディター内のパラグラフタグを保持」にレ点を入れています。(レ点を入れなければ、
<!--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 に記述して作成します。
123456//何もしないnopショートコード ショートコード名: [none]function shortcode_none(){return null; //又は '' でもOK}add_shortcode('none','shortcode_none');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()関数でフィルターフックするなど試みたものの上手く行かず、以上の対処療法的な対策になってしまいました。 もっとスマートな解決策があれば、ご教授頂くと幸いです。
-
特定ページを指定してモバイルの時だけ「ページ分割」する方法
wordpressで作成した長文の投稿記事をブラウザで見た時、モバイル閲覧の場合はページが長くなるので途中でページ分割したくなる時があります。 ネット検索すると「モバイルの時にページ分割し PCはペー ...