Cocoon 子テーマで WP User Frontend プラグインの「画像を選択する」ボタンが動作しない

実現したいこと

フロントエンド投稿フォーム（WP User Frontend）上の「画像を選択する」リンクをクリックするとファイル選択ダイアログを開き、画像をアップロードできるようにしたい。

発生している問題・分からないこと

親テーマ（Twenty Twenty-Five、または Cocoon 親テーマ）に切り替えると正常に動作する。

Cocoon 子テーマを有効化すると、ボタンをクリックしても反応せず、ファイル選択ダイアログが開かない。

エラーメッセージ

error
1ブラウザのコンソールに以下のようなエラーが大量に表示される。
2Uncaught ReferenceError: plupload is not defined         (at jquery.min.js?ver=3.6.1:2)
3jQuery.Deferred exception: plupload is not defined ReferenceError: plupload is not defined
4    at new window.WPUF_Uploader (投稿する/:842:399)
5    at HTMLDocument.<anonymous> (投稿する/:626:40)
6    at e (https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js?ver=3.6.1:2:30038)
7    at t (https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js?ver=3.6.1:2:30340) undefined
8Uncaught TypeError: Cannot read properties of undefined (reading 'classList')   (at 投稿する/:1128:167)
9GET https://example.com/wp-admin/admin-ajax.php?action=get_autocomplete_data 400 (Bad Request)
10Uncaught SyntaxError: Unexpected token '+'      (at 投稿する/:104:1380)
11

該当のソースコード

<?php
// footer 直前に読み込む jQuery UI → autocomplete 用
?>
<script src="https://code.jquery.com/ui/1.13.2/jquery-ui.min.js"></script>
<script>
document.addEventListener('DOMContentLoaded', function() {
  // WPUF 画像アップロードリンクをカスタム挙動に置き換え（これが干渉している？）
  document.querySelectorAll('a[class*="wpuf_image_upload_"]').forEach(function(link){
    link.addEventListener('click', function(e){
      e.preventDefault();
      var input = this.closest('div').querySelector('input[type="file"]');
      if (input) input.click();
    });
  });
});
</script>

試したこと・調べたこと

teratailやGoogle等で検索した
ソースコードを自分なりに変更した
知人に聞いた
その他

上記の詳細・結果

子テーマの footer-insert.php をリネーム／コメントアウト
┗ 無効化すると「画像を選択する」リンクは反応するようになるが、今度は他の機能（autocomplelte や移動ボタンクリック等）にエラーが出る

親テーマの footer.php を子テーマに丸ごとコピー
┗ それでも動かず

全プラグインを停止／必要最低限のプラグインだけ有効化
┗ 依然動作せず

テーマを完全に Twenty Twenty-Five など別テーマに切り替え
┗ 問題なく動作する

functions.php 側や head-insert.php も一旦すべて外した
┗ 変化なし

補足

子テーマ側にだけ干渉スクリプトを置くと動かなくなる

親テーマや別テーマでは同じ設定／プラグイン構成で正常動作

「plupload が見つからない」「Unexpected token '+'」「classList が undefined」といった複数の JS エラーが重なっている

どう書き換え・削除すれば Cocoon 子テーマ上でも WP User Frontend の画像アップロード機能が正常に動作するようになるでしょうか？
あるいは Cocoon のどのテンプレート・フックを上書きしないといけないのか、ぜひアドバイスをお願いいたします。

tabuu

2025/07/09 23:10

親テーマは問題ないとのことなので子テーマのfunctions.php等でスクリプトの読み込みタイミングや順番を変更されていないか確認してみてください。

Lhankor_Mhy

2025/07/10 02:16

RGTsuwa

2025/07/10 06:54

ありがとうございます。おっしゃる通り、直書きせずに wp_enqueue_script を使って WordPressの正しいタイミングで読み込むべきですね。以前はCDNで直書きしていたのですが、現在は子テーマの functions.php で jquery-ui-autocomplete を wp_enqueue_script 済みです。そのため、重複読み込みは削除しました。今は「autocomplete が 400 Bad Request」になる原因を調査中です（Ajaxのエンドポイントが機能していないようで…）。

RGTsuwa

2025/07/10 15:39

なぜかcocoon-child-masterをcocoon-childにリネームしたら直りました　ありがとうございました