前略、阿倍野高校ガイド さん

トグルボックスの本文にアンカーを設置して？ということ？

それだと、トグルボックスを使用する意味がないような気もするのですが、トグルボックスを1つ作って、編集ページをコードエディターに切り替えて、トグルボックス部分のコードをコピーして、テキストエディタに貼り付けます。

inputタグの末尾に「checked/」を半角スペースを空けて記述し、表示する文言を編集します。

おそらく、IDは重複してはいけないのだろうと思われるので、末尾の数字辺りを２箇所同じ数字で変更します。

<div class="wp-block-cocoon-blocks-toggle-box-1 toggle-wrap toggle-box block-box">
<input id="toggle-checkbox-20210120223455" class="toggle-checkbox" type="checkbox"/ checked/>
<label class="toggle-button" for="toggle-checkbox-20210120223455">トグルボックス見出し</label><div class="toggle-content">
<p>トグルボックスのテスト用のテキストです。トグルボックスのテスト用のテキストです。</p>
</div>
</div>

編集したコードをカスタムHTMLブロックに貼り付けます。

これで、開いた状態のトグルボックスが作れるような気もします。

適当に試しただけなので、間違っているかもしれません。

でも、トグルボックスの意味がないような・・

回答ありがとうございます。

質問文を見返したところ、「そもそも開いた状態にしたい」という風に取れる文章でした。訂正します。

・abeko-guide.cyou/zittai/ のように、～/#〇〇でない場合

　　　すべてのトグルボックスを、閉じた状態で表示する

・abeko-guide.cyou/zittai/#break のように、アンカーの情報を含んだURLの場合

　　　アンカーで指定されているトグルボックスを開けた状態にして表示する

@abeko-guide さん

私はJavaScriptの素養がないため、よくわからないのですが、以下のコードで適当に試してみたら、それっぽい動作になりました。

https://notepad.pw/share/o1wevs46g

該当ページの編集画面下のカスタムJavaScriptに貼り付ける場合は script タグは不要です。

なにしろ、適当なので、間違っているかもしれません。

また、トグルボックスを複数設置する場合は、どうするのか？と聞かれてもわかりません。

ご自身でいろいろとググって、調べて、試してみてください。

参考にさせていただいたWebサイト様

JavaScriptでURLのパラメータやアンカーを判断して処理を変更する方法

既存の要素を別の要素で置き換えるには？ ― replaceWith／replaceAllメソッド

JavaScript - if else if文で何もしない場合の書き方

調べて、ググって、仮に失敗したとしても、きっと何か得られるでしょう。

@abeko-guide さん

複数設置する場合は、条件項目を足せばイケるっぽいです。

https://notepad.pw/share/cdva3682

編集ページでは、閉じた状態で普通に作って、アンカーが条件に一致した場合だけ、タグを入れ替える的なことみたいです。

@abeko-guide さん

同じページ内のリンクからトグルを開いた状態にするには、ページを再読み込みしなければならないような気がします。

WordPressの場合は、絶対パスが必要なのかもしれません。

<p><a href="https://hogehoge/testpage/#break">ページ内リンク文字列</a></p>

ありがとうございます。絶対パスに変更した所、同ページ内でのアンカーリンクでトグルボックスを開けるようになりました。本当にありがとうございます。