サポート » テーマ » ナビゲーションブロックにレイアウトの設定目がない

  • 解決済 naokibd

    (@naokibd)


    自作ブロックテーマにて固定ページ内にナビゲーションブロックを設置したところ、ナビゲーションブロックのレイアウトの設定項目がないことに気づきました。

    Twenty twenty fourのテーマに切り替えたところ正常に表示されます。
    Twenty twenty fourから以下のファイルを置き換えてみたのですが変化はありませんでした。

    • functions.php
    • theme.json
    • templates/page.html

    ブラウザのキャッシュクリアやWordpressのキャッシュクリア、プラグインの無効化は試しましたがだめでした。

    確認したほうがいい点がございましたら教えていただきたいです。
    よろしくお願いします。
    WordPress v6.4.3
    PHP v8.1.22

13件の返信を表示中 - 1 - 13件目 (全13件中)
  • こんにちは、

    ナビゲーションブロックのレイアウトの設定項目がないことに気づきました

    自作テーマで、設定項目がないとおっしゃている部分ですが、それは、Twenty Twenty Fourと比べて、どの項目が不足するのか教えていただけますか?

    トピック投稿者 naokibd

    (@naokibd)

    nobita様 連絡ありがとうございます。
    以下の画像のLayout(レイアウト)の部分が項目がまるごとありません。
    (画像は参考用にWordpress.comのサポートガイドの画像を添付しています)
    表示、高度な設定の2項目だけ表示されています。

    では次に Twenty Twenty Four のparts ホルダ内のheader.html をコピーして、

    新規投稿を作成、投稿本文の段落部分にペーストしてみるとどんな結果になりますか?

    トピック投稿者 naokibd

    (@naokibd)

    Twenty Twenty Fourのparts/header.htmlを自作テーマのparts/header.htmlのソースコードをコピーし、新規投稿を作成、本文の段落部分にペーストしたらそのままソースコードが張り付き表示されました。(この手順でよかったでしょうか)
    左のリストビューには多数の段落ブロックが表示されている状態です。

    これは、ごく「なんちゃってなテスト」なので、実戦では使えません。

    リストビューに段落???

    ちなみに、私のテーマでやった結果が以下です。

    ただ、これでナビゲーションを選択した時ギアマークが表示されるようでしたら、おそらくヘッダーテンプレートの記述に何らかの問題があるのだろうと、思われます。

    トピック投稿者 naokibd

    (@naokibd)

    どこか私の手順が間違ってる気がしますが…このような状態です。
    nobita様の画像をみるとheader.htmlのソースコードを貼り付けるとブロックに変換されるのが正常ということでしょうか。
    ご指摘のヘッダーテンプレートを重点的に確認してみようと思います。

    header.htmlのソースコードを貼り付けるとブロックに変換されるのが正常

    そうです。ブロックエディタでは、パーサーといって、テンプレートの内容が適切かどうかを評価する機能があるみたいで、このおかげで、画像をコピーしたもの段落にペーストすると、画像として張り付くような機能が実現ざれています。

    トピック投稿者 naokibd

    (@naokibd)

    連絡ありがとうございます。
    ちなみにTwenty twenty fourのテーマに切り替えて同じことをやってみましたがやはり多数の段落ブロックで構成されたソースコードがそのまま張り付きました。(先ほどアップしたスクショの状態)
    自作テーマの問題だと思うのですがよくわかりません…
    ありがとうございます。

    根本的な点を確認させていただきたいのですが、自作テーマを有効化した時に、「外観 > エディター」メニューは表示されていますか?もし表示されていなければ、ブロックテーマとして認識されていないと思われます。

    Twenty Twenty Fourのparts/header.htmlを自作テーマのparts/header.htmlのソースコードをコピーし、新規投稿を作成、本文の段落部分にペーストしたらそのままソースコードが張り付き表示されました。

    ブロックテーマのHTMLをエディター上でそのまま貼り付けても、ブロックには変換されません。エディター右上のオプションメニューから「コードエディター」に切り替えて、HTMLを貼り付ける必要があります。

    @naokibd さん
    @wildworks さん

    ブロックテーマのHTMLをエディター上でそのまま貼り付けても、ブロックには変換されません。エディター右上のオプションメニューから「コードエディター」に切り替えて、HTMLを貼り付ける必要があります。

    ちょっと、横道にそれるかもしれませんが、よろしければ parts/header.html を開いた時のエディタを教えていただけませんか?

    なぜ、エディタを問い合わせたか

    段落にペーストすると変換されないとの指摘で、いくつかのエディタで試したところ、

    Netbeans (utf8 LF) 貼り付けで変換可能

    Notepad (utf8 CR/LF) (widdows 付属)貼り付けで変換可能

    Notepad ++ (utf8 LF)  貼り付けで変換可能

    Vscode (utf8 LF) 貼り付けで変換できない。
    コードエディタで、張り付け変換可能

    という結果になったためです。

    もし、vscode をご使用であれば、header.htmlを開いた時に、画面の右下に、HTMLという表示があると思います。ここをクリックして、言語モードの選択から、「プレーンテキスト」を選択してから、ソースをコピーしていただくと、段落にペーストすることができるようです。

    普段頻繁に使っていないので、何とも言えないところですが、Live Previewなどの機能も、WordPressのブロックHTMLではうまく動作しないみたいなので、HTMLファイルとの関連付けをplain text に変更した方がいいのかなという印象でした。

    • この返信は1ヶ月、 3週前にnobitaが編集しました。
    トピック投稿者 naokibd

    (@naokibd)

    すみません検証に夢中で返事がおそくなりました。

    結論からいうとtheme.jsonに記載していたsettings.layout.allowEditing: falseとなっていた部分をtrueに変更し解決しました
    また、Twenty twenty fourからtheme.jsonを置き換えたと最初に伝えましたが、実は置き換わっていない状態(私の単純ミス)で確認していたようです。
    また、どういう意図でfalseにしていたかですが、制作をはじめて1年ほど放置していたテーマなので正直覚えていません、、、

    @nobita さん
    多数検証・助言いただきありがとうございました。
    エディタはvscodeを使用しコピーしChromeブラウザでブロックエディタにペーストしていました。

    @wildworks さん
    外観 > エディターは表示されていました。エディターの検証までしていただきありがとうございました。

    こちらで質問させていただいて大変勉強になりました。
    ご協力いただき誠にありがとうございました。

    • この返信は1ヶ月、 3週前にnaokibdが編集しました。理由: ファイル違い

    余談

    HTMLファイルとの関連付けをplain text に変更した方がいいのかなという印象でした。

    間違いみたいでした。

    設定 editor.copyWithSyntaxHighlighting チェックを外して解決ぽいです。

    https://github.com/microsoft/vscode/issues/103135

13件の返信を表示中 - 1 - 13件目 (全13件中)
  • このトピックに返信するにはログインが必要です。