ふかふか交易所

ふかふか交易所 | ゲーム、HP・ブログ制作、動画制作などのネットコンテンツ全般からレビュー情報まで分かりやすく紹介します

HP・ブログ関連

Googleカスタム検索の薄い文字(ウォーターマーク)を非表示にする簡単な方法

2019年4月11日

自身のホームページに「サイト内検索機能」を導入したい場合、Googleの提供するカスタム検索(Google Custom Search)を設置する方法があります。

しかしGoogleカスタム検索を設置した際に、初期の状態では検索枠内に"Googleカスタム検索"のように薄い文字(ウォーターマーク)が浮かび上がっていると思います。

人によってはデザインの関係上、この文字を非表示にしたい!という方もいると思います(実際、私は気になって仕方がありませんでしたw)。

そこで今回は、Googleカスタム検索の薄い文字(ウォーターマーク)を非表示する簡単な方法について紹介したいと思います。

Googleカスタム検索の設置

Googleカスタム検索エンジン

Googleカスタム検索を設置するには上記のサイトにアクセスし、自身のGoogleアカウントでログインしてください。

するとカスタム検索の設定画面が出現するので、ここで検索窓のデザインなどをカスタマイズすることができます。

▼左の"デザイン"タブを選択することでカスタマイズ画面が出現する

カスタマイズ終了後、下の"保存してコードを取得"をクリックし、出現したコードをコピーして貼り付けることでカスタム検索を設置することができます。

ウォーターマークの非表示

カスタム検索を設置したばかりの状態では、検索枠内に薄い字(ウォーターマーク)が表示されていると思います。

これを非表示にするには、以下のCSSコードを適用します。

input.gsc-input {background-image:none !important;}

すると薄い字(ウォーターマーク)の標示は消えていると思います。

サイトのデザイン性を重視する方は、是非試してみてください!

-HP・ブログ関連
-, , , , , , , , , , ,

Copyright© ふかふか交易所 , 2019 All Rights Reserved.