2

サイトに Google カスタム検索を追加しようとしていますが、既に検索ボックスのプレースホルダーのスタイルを設定しており、検索ボックスをそのように表示したいと考えていました。

いくつか検索した後、このような以前の質問はすべて古くなっているようです。

スタイリングに関して私が見つけた唯一のものはこれです：

<script>
    (function() {
    var cx = 'XXXXXXXXXX:YYYYYYYYY';
    var gcse = document.createElement('script'); gcse.type = 'text/javascript'; gcse.async = true;
    gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') + '//www.google.com/cse/cse.js?cx=' + cx;
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(gcse, s);
})();
</script>
<div style="width:0px;overflow:hidden;height:0px;"> <!-- if you use display:nonw here it doesn't work-->
    <gcse:search></gcse:search>
</div>
<form id="searchbox_XXXXXXXXXX:YYYYYYYYY" action="">
    <input value="XXXXXXXXXX:YYYYYYYYY" name="cx" type="hidden"/>
    <input value="FORID:11" name="cof" type="hidden"/>
    <input id="q" style="" name="q" size="75" type="text"/>
    <button class="btn">Search</button>
</form>

ただし、フォームを送信しても何も起こりません。

action="" が空白になっていることに気付き、自分のサイト "www.kokorugs.com/" を入力しても機能しませんでした。

どんなアイデアでも大歓迎です！

4

1 に答える 1

0

私が見つけた唯一の方法は、JQuery を使用して、レンダリングされた Google 要素へのフックを作成することでした。カスタム検索ボックスを要素にフックしたいので、 gsce:searchの代わりにgsce:results-onlyをレンダリングし、以前の回答の 1 つの実装に従う必要があります。

于 2016-03-02T19:12:51.613 に答える