【分かりやすい画像解説付き!】拡張機能「Search Bar」

2018/04/13

 

今回は、Google chrome拡張機能

Search Barについて

徹底解説していきたいと思います!!

 

Search Barとは

Googleの検索を快適にしてくれる機能です!

 

Amazonで調べたい商品を見付けたとき

ワンクリックでAmazonの商品ページに飛べる機能や

 

スマートフォンを使っている方なら

分かりやすいと思いますが

スマートフォンのホーム画面に

色々なサイトのアイコンが表示されてますよね?

 

サイトの名前を見なくても

アイコンでどのサイトかが分かると思います

 

アイコンを見てサイトを判断して

ワンクリックでサイトを開く

 

この機能がSearch Barで出来るのです!

とても効率的ですので

この機会にSearch Barを覚えていってね!

Search Barのインストール方法

Search Bar

↑こちらのリンクをクリックすると

Googleウェブストアに飛んで

Search Barのページが開かれます

 

 

右上の「+CHROMEに追加」をクリックして

 

 

「Search Bar」を追加しますか?

と聞かれるので

「拡張機能を追加」をクリックすると

インストールが開始されます

 

 

「+Googleに追加済み」

と表示されているとインストール成功です

 

 

右上に「Search Bar」の

アイコンが表示される

 

Search Barの使い方

まずは、調べたい言葉を

ドラッグでなぞって選択します

 

 

キーワードが選択された状態で

右上の虫眼鏡マーク🔍をクリックします

 

 

すると、画面上部に何か出てきました!

 

 

これがSearch Barの本体です

 

ここで、右側にあるアイコン

この画面だと

「Google」「youtube」「Gmail」「Amazon」

が表示されていますが

検索したいサイトのボタンをクリックすることで

簡単に同じキーワードを複数のサイトで検索できるのです!

 

試しに「Google」ボタンを押してみると

 

 

きちんと検索窓にキーワードが入って

検索結果が表示されました

これがSearch Barの基本的な使い方です

 

検索したいサイトのアイコンは

設定で好きなサイトを追加できます

 

例えば、ヤフオクを追加しておくと

ワンクリック

Google検索とヤフオク

簡単に同じキーワードで

複数検索が可能になるということですね!

 

Search Barのカスタマイズ

虫眼鏡マーク🔍をクリックして

Search Barを表示させます

表示させたら、一番右側の

歯車マーク⚙(設定ボタン)をクリックします

 

 

Search Bar Optionsという

英語のページが開いたと思います

 

左側のメニューから

Custom Searcherという文字をクリックします

 

 

このような画面になります!

 

 

は実際に表示されるSearch Barのプレビュー

これを見ながら、をいじって

使いやすいSearch Barにカスタマイズしていきます!

 

【②の各項目の説明】

×印(左):ボタンを削除する
チェックボックス1:チェックを入れると、その検索エンジンのボタンがSearch Barに表示される
十字マーク:このマークの部分をドラッグすると段の上下を自由に入れ替えることができる

チェックボックス2:チェックを入れると、そのボタンの左に区切り線(|)が表示される
Description:検索エンジンの名前
Hotkey:キーボードで操作したいときに便利なショートカットキーの設定
×印(右):Hotkeyで設定したショートカットを削除する

不要なボタンを削除する

削除は一番左の×印を押してもいいのですが

万が一、あとから使いたくなったときの為に

すぐ設定し直せるようにしておいた方がいいです!

 

なので、不要なボタンは

×印の隣のチェックボックスを外すだけにしておく方が

オススメです!

 

ボタンを追加する

Amazonがあったので

チェックボックスにチェックを入れて追加してみると

日本のAmazonではなく、米Amazonでした。。。

 

モノレートも入っていなかったので

試しに、日本のAmazonと

モノレートを追加してみましょう!

 

リストにないサイトを追加する方法

追加画面をパッと見たとき

「難しそう。。。」

と思うかもしれませんが

一度覚えてしまうと簡単です!

 

まずはリストのすぐ上にある

show advanced options

というボタンをクリックします

 

 

すると、これまでなかった項目が表示されると思います

説明を載せていきます!!

 

 

【詳細項目の説明】

Home page URL:検索エンジンのTOPページのURL
Search URL:実際に検索されるときに使うURL
lcon URL:Search Barに表示されるアイコン画像のURL
New tab hotkey - background tab:ショートカットキーの設定。Hotkeyと違って新しいタブで開く場合のショートカットキーを設定できます。(そのタブはアクティブにならない)
New tab hotkey - foreground tab:↑と同じですが、そのタブがアクティブになります。(そのタブが前面に表示されるということ)

 

先程、show advanced optionsのボタンをクリックしたことで

リストの一番下にcreate newという行ができてると思います

 

ここに必要事項を入力すれば

好きなサイトのボタンがSearch Barに追加できます

 

Amazonを追加する

それでは順番に入力していきましょう!

一番下のcreate newという項目に入力していきます

 

 

今回は日本のAmazonを追加したいので

Description(検索エンジンの名前)には
「アマゾン」と入力します
(自分が分かりやすい名前でOK)

 

 

Home page URLは検索エンジンのTOPのURLなので

https://www.amazon.co.jp/

 

と入力します。
Search URLは、実際に日本のAmazonで
検索してみたときのURLの
キーワード部分に「%s」という文字を代入すればOK
分からない方はこのURLをコピペしましょう!↓

 

https://www.amazon.co.jp/s/?&field-keywords=%s

 

Icon URLはAmazonのファビコン(ボタンアイコン)が置いてある場所を入力します
ファビコンは大体、TOPページのURLに「/favicon.icon」を付けた場所にあります
Amazonもそうですので
このように入力すればOK!↓

 

http://www.amazon.co.jp/favicon.ico

 

ファビコンとは?ウェブサイトのシンボルマークやイメージのアイコンのことを指します
みなさんも一度は見たことあるであろうファビコン一覧をあげてみます

 スマホのホーム画面にアイコンが表示されて
みなさんそのアイコンを見てワンタッチでサイトに飛びますよね?
自然とファビコンを見てどのサイトか分かるんです
この現象がSearch Barで出来るということですね!
アイコンを見てワンクリックでサイトに飛べるようになります!

これで必要な項目の入力が終わりました!

 

 

あとは、お好みのショートカットキーを設定して

最後にcreate newをクリック!

 

【入力項目まとめ(日本のAmazon)】

Description:Amazon
Home page URL:https://www.amazon.co.jp/
Search URL:https://www.amazon.co.jp/s/?&field-keywords=%s
Icon URL:http://www.amazon.co.jp/favicon.ico

 

 

モノレートを追加する

同じようにモノレートも追加しましょう

追加したときに入力した項目をまとめておきますので

必要であれば参考にしてください!

 

【入力した項目まとめ(モノレート)】

Description:モノレート
Home page URL:http://mnrate.com/
Search URL:http://mnrate.com/search?&kwd=%s
Icon URL:http://mnrate.com/favicon.ico

 

あとはAmazonの時と同じように

自分の好みでショートカットを設定しましょう!

おわりに

Search Barの使い方とカスタマイズ方法について

紹介していきました!!

 

この便利な機能で

無料で使用できるので

とても良いツールですね!

 

自分にあったツールを使って

作業をどんどん効率化していきましょう!

-未分類