グーグル カスタム検索が動かない

google custom search を利用して自サイト内検索ページを作ったのですが動くときと動かない時がありました。


 自サイト内検索プログラムを自分で作成するのは面倒なのでgoogleまかせにしたいのですがPageView稼ぎのために検索結果は自サイト内で表示させたいので検索結果ページを作り、そこにgoogleからの検索結果を表示させます。。

まずgoogleアカウントにログインしてから以下にアクセスします。
Googleカスタム検索エンジン
https://cse.google.co.jp

①カスタム検索エンジンを作成します。自サイトのurl等を入力していくだけなので特に難しいことはないかと思います。

 ②作成した検索エンジンの編集画面を開き、検索ボックスのコードを表示し、コピーしておきます。

③同様に検索結果のコードを表示し、コピーしておきます。

④どちらかのコードを表示する画面で「検索結果の詳細」ボタンをクリックして検索結果ページのurlを入力します。この場所がちょっと分かり難いですね。

 後は取得した2種類のコードを検索結果ページhtmlに貼り付けるだけです。
…なのですが私がちょっと躓いた箇所を書き留めておきます。

検索結果ページを表示して終わり、というのなら問題ないのですが、検索結果ページからさらに検索を進めるために検索結果ページにも検索ボックスも用意したいというのは当然の要求です。ということは上記②と③、両方のコードを記載すれば良いのです。

②③のコードを両方そのまま貼り付けたら検証環境では問題無く動作したのですが、本番環境ではなぜか不具合が出ました。基本的には何も表示されない（エラー）のですが、たまに正常に表示されるのが厄介です。ブラウザの「要素の検証」等でコンソールを見ると表示されない時にはgoogle custom search スクリプトのエラーが出ています。

②と③のコードをよく見るとスクリプト部分が全く同じなことに気付くと思います。重複して書いていたのが問題かと思い片方だけにしたところ解決しました。