Greasemonkeyで検索結果の番号付け / FireFoxアドオン

GreasemonkeyはFireFoxの拡張機能（アドオン）の1つで、Javascriptによるスクリプトを追加することで、Webページのカスタマイズに対応している。



https://addons.mozilla.org/ja/firefox/addon/748


今回はYahoo!/Google/MSN(bing)の検索結果一覧に番号をふって見やすく整形。SEOサービスの記事で見つけたスクリプトを紹介。※MSN(bing)は公開されてなかったので、自分で作成してみた。基本的にはYahoo!/Googleと同じ形式でソースの読み込むタグ名を変更しただけ。
http://powerseo.jp/yahoo_firefox.html


まずはFireFoxにGreasemonkeyをインストールして、下記のJavascriptコードをテキストエディタで「○○○.user.js」と「.user.js」をつけたファイル名で保存し、FireFoxにドラッグ&ドロップすれば簡単にインストールできる。


Yahoo!「yahoo_number.user.js」

// ==UserScript==
// @name          Yahoo display number
// @description	  Display Numbers results of Yahoo searches
// @include       http://search.yahoo.co.jp*
// ==/UserScript==

(function() {

	function param(qstr) {
		var value = null;
		for (var i = 0; i < param.keys.length; i++) {
			if (param.keys[i] == qstr) {
				value = param.values[i];
				break;
			}
		}
		return value;
	}
	
	param.keys = new Array();
	param.values = new Array();

	function p_analys() {
		var query = window.location.search.substring(1);
		var squery=query.split('&');
		for (var i = 0 ; i < squery.length; i++) {
			var pos = squery[i].indexOf('=');
			if (pos >= 0) {
				var a = squery[i].substring(0,pos);
				var value = squery[i].substring(pos+1);
				param.keys[param.keys.length] = a;
				param.values[param.values.length] = value;
			}
		}
	}
	
	p_analys();
	var j = 0;
	var start = param('b');

	if (start == null) {
		start=0;
	}

	if (parseInt(start) == 0){
	start = parseInt(start) + 1;
	}
	start = parseInt(start);

	function disp(){
		ss = document.getElementsByTagName('h3');
		for (si = 0; si < ss.length; si++) {
			sc = ss[si];
			if (sc.className == '') {
				num = start + j;
				
				if (num < 10) {
				sc.innerHTML = '<div style="margin-top:4px"></div><span style="color:#f08080;font-size: 0.9em;font-weight:bold;margin-left:-1.1em">' + num + '. </span>' + sc.innerHTML;
				}

				else if (num > 9 && num < 100) {
				sc.innerHTML = '<div style="margin-top:4px"></div><span style="color:#f08080;font-size: 0.9em;font-weight:bold;margin-left:-1.6em">' + num + '. </span>' + sc.innerHTML;
				}
				
				else if (num > 99) {
				sc.innerHTML = '<div style="margin-top:4px"></div><span style="color:#f08080;font-size: 0.9em;font-weight:bold;margin-left:-2em">' + num + '. </span>' + sc.innerHTML;
				}				
				
				j++;

			}
		}
	}
window.addEventListener("load", disp, false);
})();

Google「google_number.user.js」

// ==UserScript==
// @name          Google display number
// @description	  Display Numbers results of Google searches
// @include       http://*google.co.jp*
// ==/UserScript==

(function() {

	function param(qstr) {
		var value = null;
		for (var i = 0; i < param.keys.length; i++) {
			if (param.keys[i] == qstr) {
				value = param.values[i];
				break;
			}
		}
		return value;
	}
	
	param.keys = new Array();
	param.values = new Array();

	function p_analys() {
		var query = window.location.search.substring(1);
		var squery=query.split('&');
		for (var i = 0 ; i < squery.length; i++) {
			var pos = squery[i].indexOf('=');
			if (pos >= 0) {
				var a = squery[i].substring(0,pos);
				var value = squery[i].substring(pos+1);
				param.keys[param.keys.length] = a;
				param.values[param.values.length] = value;
			}
		}
	}
	
	p_analys();
	var j = 0;
	var start = param('start');

	if (start == null) {
		start=0;
	}

	start = parseInt(start) + 1;

	function disp(){
		ss = document.getElementsByTagName('li');
		for (si = 0; si < ss.length; si++) {
			sc = ss[si];
			if (sc.className == 'g w0') {
				num = start + j;
				
				if (num < 10) {
				sc.innerHTML = '<div style="margin-top:16px"></div><span style="color:#f08080;font-size: 1.17em;font-weight:bold;margin-left:-1.1em">' + num + '. </span>' + sc.innerHTML;
				}

				else if (num > 9 && num < 100) {
				sc.innerHTML = '<div style="margin-top:16px"></div><span style="color:#f08080;font-size: 1.17em;font-weight:bold;margin-left:-1.6em">' + num + '. </span>' + sc.innerHTML;
				}
				
				else if (num > 99) {
				sc.innerHTML = '<div style="margin-top:16px"></div><span style="color:#f08080;font-size: 1.17em;font-weight:bold;margin-left:-2.2em">' + num + '. </span>' + sc.innerHTML;
				}

				j++;

			}
		}
	}
	function disp(){
		ss = document.getElementsByTagName('li');
		for (si = 0; si < ss.length; si++) {
			sc = ss[si];
			if (sc.className == 'g') {
				num = start + j;
				
				if (num < 10) {
				sc.innerHTML = '<div style="margin-top:16px"></div><span style="color:#f08080;font-size: 1.17em;font-weight:bold;margin-left:-1.1em">' + num + '. </span>' + sc.innerHTML;
				}

				else if (num > 9 && num < 100) {
				sc.innerHTML = '<div style="margin-top:16px"></div><span style="color:#f08080;font-size: 1.17em;font-weight:bold;margin-left:-1.6em">' + num + '. </span>' + sc.innerHTML;
				}
				
				else if (num > 99) {
				sc.innerHTML = '<div style="margin-top:16px"></div><span style="color:#f08080;font-size: 1.17em;font-weight:bold;margin-left:-2.2em">' + num + '. </span>' + sc.innerHTML;
				}

				j++;

			}
		}
	}
window.addEventListener("load", disp, false);
})();

MSN(bing)「bing_number.user.js」

// ==UserScript==
// @name          Bing display number
// @description	  Display Numbers results of Bing searches
// @include       http://www.bing.com/search*
// ==/UserScript==

(function() {

	function param(qstr) {
		var value = null;
		for (var i = 0; i < param.keys.length; i++) {
			if (param.keys[i] == qstr) {
				value = param.values[i];
				break;
			}
		}
		return value;
	}
	
	param.keys = new Array();
	param.values = new Array();

	function p_analys() {
		var query = window.location.search.substring(1);
		var squery=query.split('&');
		for (var i = 0 ; i < squery.length; i++) {
			var pos = squery[i].indexOf('=');
			if (pos >= 0) {
				var a = squery[i].substring(0,pos);
				var value = squery[i].substring(pos+1);
				param.keys[param.keys.length] = a;
				param.values[param.values.length] = value;
			}
		}
	}
	
	p_analys();
	var j = 0;
	var start = param('b');

	if (start == null) {
		start=0;
	}

	if (parseInt(start) == 0){
	start = parseInt(start) + 1;
	}
	start = parseInt(start);

	function disp(){
		ss = document.getElementsByTagName('div');
		for (si = 0; si < ss.length; si++) {
			sc = ss[si];
			if (sc.className == 'sb_tlst') {
				num = start + j;
				
				if (num < 10) {
				sc.innerHTML = '<div style="margin-top:4px"></div><span style="color:#f08080;font-size: 0.9em;font-weight:bold;margin-left:-1.1em">' + num + '. </span>' + sc.innerHTML;
				}

				else if (num > 9 && num < 100) {
				sc.innerHTML = '<div style="margin-top:4px"></div><span style="color:#f08080;font-size: 0.9em;font-weight:bold;margin-left:-1.6em">' + num + '. </span>' + sc.innerHTML;
				}
				
				else if (num > 99) {
				sc.innerHTML = '<div style="margin-top:4px"></div><span style="color:#f08080;font-size: 0.9em;font-weight:bold;margin-left:-2em">' + num + '. </span>' + sc.innerHTML;
				}				
				
				j++;

			}
		}
	}
window.addEventListener("load", disp, false);
})();

これで3ファイル分インストールすれば、それぞれの検索エンジンの検索結果一覧ページで番号がふられている。


Yahoo!



Google



MSN(bing)



イメージとして検索結果一覧のタイトル左側に番号がふられている。これで目視でも順位を確認できる。


ちなみに番号の文字色はjavascriptの「color:#f08080;」を変更すれば好きな色で表示させることが可能。


※検索結果のソースは検索エンジンは不定期に更新しているため、ソースが変わった際はまたjavascriptコードを編集する必要がある。