【備忘録】Cocoonで作ったサイトのフッターに任意のテキストを挿入する方法

WordPressのテーマ「Cocoon」は非常に多機能なテーマです。
ただし汎用的なテーマなので必ずしも実現したいことが直接的な操作で実現できません。
私は現在「Cocoon」を使って２つのサイトを構築・運用していますが、サイトを運営していく上で見つけたちょっとした設定・変更について備忘録として残しておきます。

フッターの挿入・設定方法
フッターの任意の場所にテキスト情報を挿入方法

フッターの挿入・設定方法

「Cocoon」でフッターを挿入・設定する方法にはいくつかありますが、私は以下の方法でフッターを挿入しています。

外観 → カスタマイズ → フッターメニュー
メニュー名を入力（ex. フッターメニュー）
項目の追加（私は「問い合わせ」などの固定ページへのリンクを挿入しています。）

続いて「Copy Right」を表示させます。

Cocoon設定 → フッター
クレジット表記にて任意の表記を選択（独自表記の場合は任意のテキストを入力します。）
最上段もしくは最下段にある「変更をまとめて保存」を押して保存します。

これで、指定ページへのリンクの下にクレジット表記が表示されているフッターが完成しました。
これでも十分フッターとしての機能は果たせますが、今回はリンクの上に「サイト名」や「電話番号」などの情報を記載したいと思いました。
直接 index.php を修正できれば簡単なのですが「Cocoon」ではそのような機能はなさそうです。

フッターの任意の場所にテキスト情報を挿入方法

そこで「フッターカスタマイズ」について Google 先生に尋ねるとウィジェットを利用するなどいくつかの方法が見つかります。
ただ、ウィジェットを利用する方法は最初からフッター作り直すイメージで、既にフッターが存在している環境には適切ではないです。
そこで別の方法、こちらは超簡単に既存のフッターにテキストを挿入することができます。

Cocoon設定 → アクセス解析・認証
その他のアクセス解析・認証コード設定 → フッター用コード
以下のスクリプトを修正してコピペ
最上段もしくは最下段にある「変更をまとめて保存」を押して保存します。

<script>
document.addEventListener("DOMContentLoaded", function () {
  var footerMenu = document.querySelector("#navi-footer");
  if (footerMenu) {
    var div = document.createElement("div");
    div.innerHTML = `
      <div style="text-align: center; padding-bottom: 10px; font-size: 18px;">
        <p>ここに任意の文字列を挿入</p>
        <p>ここに任意の文字列を挿入</p>
        <p>ここに任意の文字列を挿入</p>
        <p></p>
        <p></p>
        <p></p>
      </div>
    `;
    footerMenu.parentNode.insertBefore(div, footerMenu);
  }
});
</script>