WordPress_javascript スキルに Google 検索機能を追加する簡単な手順

Google カスタム検索を WordPress に統合する方法については、インターネット上に多くの記事がありますが、v2 コードを統合する方法について言及している記事はほとんどありません。今日は、実際のテストを通じて、WordPress に Google カスタム検索を統合する方法を説明します。の。

Google カスタム検索コードを取得
「http://www.google.com/cse/
」と入力します Google アカウントのすべてのシリーズはユニバーサルです。
したがって、Gmail をお持ちの場合は、このカスタム検索システムに正常にアクセスできます
一連の登録とログインが完了すると、CSE のメイン インターフェイスが表示されます。インターネットの速度は時々非常に遅いので、我慢する必要があります。
メインインターフェースに入り、「新しい検索エンジン
」をクリックします。 以下に示すように内容を入力します:

ボックスにチェックを入れて契約に同意し、[次へ] をクリックして
好みに応じてスタイルを選択すると、すぐ下にデモンストレーションが表示されます。
「次へ」をクリックするとコードが表示されます。
皆さん、コードは持っていますか？取得したコードは次のとおりです:

<!-- Put the following javascript before the closing </head> tag. -->
<script>
 (function() {
 var cx = '006739494664361712883:_id_bvfkgey';
 var gcse = document.createElement('script');
 gcse.type = 'text/javascript';
 gcse.async = true;
 gcse.src = (document.location.protocol == 'https:' &#63; 'https:' : 'http:') +
  '//www.google.com/cse/cse.js&#63;cx=' + cx;
 var s = document.getElementsByTagName('script')[0];
 s.parentNode.insertBefore(gcse, s);
 })();
</script>
<gcse:searchbox></gcse:searchbox>
 
<!-- Place this tag where you want both of the search box and the search results to render -->
//下面这一对标签就是谷歌搜索框要显示的标签，
//即，你想把搜索框放哪就把这一对标签放哪。
<gcse:search></gcse:search>

検索ページを追加
エイリアス検索を使用して WordPress に新しいページを作成します
固定接続が設定されており、このページのアクセスアドレスが
であると仮定します。 http://pangbu.com/google-search-in-wordpress
HTML 編集モードを使用して、取得したコードを記事に追加します。
どのような効果があるのか​​知りたいですか？

効果
以下で直接検索して試すことができます。

システム統合
わかりました。すでに検索ページがあります。次に、それを WordPress 検索に統合する必要があります。
トラブル？もちろん面倒ではありません。
テーマの検索ボックスのスタイルを定義するファイル
を見つけます。 通常、searchform.php、
一部のテーマは若干異なる場合があります。
さらに重要な文が 2 つあります。
1 つはフォーム送信アドレス、action="XXX"
1 つはフォームパラメータ名 name="s",
です。 ここのコードはほぼ同じなので、きっと見つかると思います。

<form action="http://pangbu.com" method="get">
<input id="searchtxt" class="textfield searchtip" type="text" name="s" size="24" value="">

action="XXX" と入力します
action="作成した検索ページの URL"
に変更します。

などの http を忘れずに提示してください

action="http://pangbu.com/google-search-in-wordpress"

name="s" を name="q" に変更します

統合されたコード例
私が変更したトピック検索スタイルのコードは次のとおりです

<div id="searchbox" style="display: block;">
 <form action="http://pangbu.com/google-search-in-wordpress" method="get">
 <div class="scontent clearfix">
  <input type="text" id="searchtxt" class="textfield searchtip" name="q" size="24" value="">
  <input type="submit" id="searchbtn" class="button" value="搜索">
 </div>
 </form>
</div>