Googleツールバーのボタンの作り方

nesys Add comments
add to hatena hatena.comment (3) add to del.icio.us (0) add to livedoor.clip (0) add to Yahoo!Bookmark (0) Total: 3

このボタンは基本的にxmlファイルで記述することですぐにできてしまう。
とりあえず環境はWindowsで作ることとしよう。

詳しい構文などはドキュメントを参照したらよいが、とりあえず最もシンプルな単なるリンクとしてのボタンを作ってみよう。

ニコニコ動画ボタンを作ろうか

結論から言えば、以下のファイルをXML形式で保存したらいいだけ。

<?xml version="1.0" encoding="utf-8"?>
<custombuttons xmlns="http://toolbargoogle.com/custombuttons/">
	<button>
		<title>ニコニコ動画</title>
		<description>ニコニコ動画</description>
		<site>http://www.nicovideo.jp/</site>
		<icon>AAABAAEAEBAAAAEAIABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAAAAD////9/////f////3////9/////f////3////9/////f////3////9/////f////3////9/////f////3////9/////f////0zMzP9/////f////3////9/////f////3////9/////f////3////9/////TMzM/3////9/////f////0zMzP9MzMz/TMzM/0zMzP9MzMz/TMzM/0zMzP9MzMz/TMzM/0zMzP9MzMz/TMzM/0zMzP9MzMz/f////3////9MzMz/f////3////9/////f////3////9/////f////3////9/////f////3////9/////TMzM/3////9/////TMzM/3////9/////f////3////9MzMz/TMzM/0zMzP9MzMz/f////3////9/////f////0zMzP9/////f////0zMzP9/////f////3////9/////f////0zMzP9MzMz/f////3////9/////f////3////9MzMz/f////3////9MzMz/f////3////9/////f////3////9/////f////3////9/////f////3////9/////TMzM/3////9/////TMzM/3////9/////f////3////9/////f////3////9/////f////3////9MzMz/f////0zMzP9/////f////0zMzP9/////TMzM/3////9/////f////3////9/////f////3////9/////f////3////9MzMz/f////3////9MzMz/f////3////9/////f////3////9/////f////3////9/////f////3////9/////TMzM/3////9/////TMzM/3////9/////f////3////9/////f////3////9/////f////3////9/////f////0zMzP9/////f////0zMzP9MzMz/TMzM/0zMzP9MzMz/TMzM/0zMzP9MzMz/TMzM/0zMzP9MzMz/TMzM/0zMzP9MzMz/f////3////9/////f////3////9/////f////3////9MzMz/TMzM/3////9/////f////3////9/////f////3////9/////f////3////9/////f////0zMzP9MzMz/f////3////9MzMz/TMzM/3////9/////f////3////9/////f////3////9/////TMzM/0zMzP9/////f////3////9/////f////3////9MzMz/TMzM/3////9/////f////3////9/////f////3////9/////f////3////9/////f////3////9/////f////3////9/////f////3////9AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA==</icon>
	</button>
</custombuttons>

http://www.crosssys.net/api/gbtn/nicovideo_gbtn.xml

保存先はここ

C://Documents and Settings/(ユーザー名)/Local Settings/Application Data/Google/Custom Buttons/(ファイル名).xml

注意点として、このファイルはUTF-8で保存しなければならない。

これだけで、IEやFirefoxを開くだけで、ツールバーにボタンが追加されている。

火を見るより明らかに、buttonタグの中の、titleがタイトル、descriptionが説明文(ツールチップ)、siteがリンク先となっている。
1つ難しい(?)点として、iconだが、これは表示するアイコン画像をbase64形式の文字列に変換して書かなければならない。
ライト言語でも使えればすぐできることなのだが、とりあえず便利APIとして以下のようなものを作ってみた。

アイコンエンコーダー

「http://www.nicovideo.jp/favicon.ico」などのfavicon.icoが含まれたアイコンURLを入力することで、base64形式にエンコードした文字列を返すので、それをコピペして利用すればよい。

終わりに

結果的にできたものを使おうか。

Googleツールバーにニコニコ動画ボタンを追加する

関連エントリ

Leave a Reply

WP Theme & Icons by N.Design Studio
Entries RSS Comments RSS ログイン