Username:

Password:

Remember Me?

User Styles

Title:

Google Styler (Fonts, Colors, Layout)

Date Added:

2008-02-04 01:23:34

Installs:

2573

Description:

This script will improve the layout of Google's search page, creating kind of a new "theme" or "skin" for Google.

1) Search results will use the whole screen width so you have more info on each page.
2) Fonts were changed to the new Windows Vista Segoe UI or Trebuchet on other operating systems.
3) Color scheme revamped (now it follows Google colors!)
4) Added separators between search items for easier reading.

Preview of Google Styler (Fonts, Colors, Layout)

View script source of Google Styler (Fonts, Colors, Layout)

/*
 * Title: Google Styler
 * Description: Customize Google Search Style
 * Author: Mr. Milk (aka Marcelo Leite)
 * Email: mrmilk@anysoft.com.br
 * Updated: 15/09/2007
 * 
 */

// ==UserScript==
// @name Google Styler
// @namespace http://www.anysoft.com.br
// @description Customize Google Search Style
// @injectframes 1
// @include http://www.google.com*
// @include http://groups.google.com*
// @include http://images.google.com*
// @include http://news.google.com*
// ==/UserScript==

(function(){ 
	
  var cssStyle  = '';

  cssStyle += 'body, td, div, input, .p, a {';
  cssStyle += '  font-family: "Segoe UI", "trebuchet ms", arial, sans-serif, tahoma, verdana;';
  cssStyle += '  text-decoration: none;';
  cssStyle += '}';

  cssStyle += '.ts td, .tc {';
  cssStyle += '  padding: 0';
  cssStyle += '}';
  
  cssStyle += '.ts, .tb {';
  cssStyle += '  border-collapse: collapse';
  cssStyle += '}';
  
  cssStyle += 'div, td {';
  cssStyle += '  color: #000';
  cssStyle += '}';
  
  cssStyle += '.f {';
  cssStyle += '  color: #666';
  cssStyle += '}';
  
  cssStyle += '.flc {';
  cssStyle += '  color: #77c';
  cssStyle += '}';
  
  cssStyle += 'a.l, a:link, .w, a.w:link, .w a:link, .q:visited,. q:link, .q:active, .q {';
  cssStyle += '  color: #00c;';
  cssStyle += '}';
  
  cssStyle += 'a:visited, .fl:visited {';
  cssStyle += '  color: #669966;';
  cssStyle += '  text-decoration: none';
  cssStyle += '}';
  
  cssStyle += 'a:active, a:hover {';
  cssStyle += '  color: #669966;';
  cssStyle += '  text-decoration: underline';
  cssStyle += '}';

  cssStyle += '.fl:active, .fl:link {';
  cssStyle += '  color: #C49A00;';
  cssStyle += '  text-decoration: none';
  cssStyle += '}';

  cssStyle += '.t, .s {';
  //cssStyle += '  background: #e5ecf9;';
  cssStyle += '  background: #CCFFCC';
  cssStyle += '  color: #000';
  cssStyle += '}';
  
  cssStyle += '.bb {';
  cssStyle += '  border-bottom: 1px solid #36c';
  cssStyle += '}';
  
  cssStyle += '.bt {';
  cssStyle += '  border-top: 1px solid #36c';
  cssStyle += '}';
  
  // ITEM HEADER TITLE
  cssStyle += '.r {';
  cssStyle += '  font-size: 1em 1';
  cssStyle += '}';

  // ITEM DESCRIPTION
  cssStyle += 'font {';
  cssStyle += '  font-size: 1em 1';
  cssStyle += '}';

  // ITEM DESCRIPTION CELL
  cssStyle += '.j {';
  cssStyle += '  width: 100%;';
  //cssStyle += '  width: 34em';
  cssStyle += '}';

  // URL TEXT
  cssStyle += '.a, .a:link, .gl {';
  cssStyle += '  color: #990000;';
  cssStyle += '}';

  cssStyle += '.i, .i:link {';
  cssStyle += '  color: #a90a08';
  cssStyle += '}';

  // ITEM BLOCK
  cssStyle += '.g {';
  cssStyle += '  margin: 1em 0;';
  cssStyle += '  border-top: 1px solid #f3f3f3';
  cssStyle += '}';

  // NEWS BLOCK
  cssStyle += '.lh {';
  cssStyle += '  border-top: 1px solid #f3f3f3';
  cssStyle += '}';

  // RESULTS SUMMARY TITLE (WEB)
  cssStyle += '#sd {';
  cssStyle += '  font-size: 113%;';
  cssStyle += '  font-weight: bold';
  cssStyle += '}';

  // ADVANCED SEARCH + PREFERENCES
  cssStyle += '#ap {';
  cssStyle += '  font-size: 64%';
  cssStyle += '}';

  cssStyle += '.h {';
  cssStyle += '  color: #36c';
  cssStyle += '}';
  
  cssStyle += '.z {';
  cssStyle += '  display: none';
  cssStyle += '}';
  
  cssStyle += 'div.n {';
  cssStyle += '  margin-top: 1ex';
  cssStyle += '}';
  
  cssStyle += '.n a {';
  cssStyle += '  font-size: 10pt;';
  cssStyle += '  color: #000';
  cssStyle += '}';
  
  cssStyle += '.n .i {';
  cssStyle += '  font-size: 10pt;';
  cssStyle += '  font-weight: bold';
  cssStyle += '}';
  
  cssStyle += '.b a {';
  cssStyle += '  font-size: 12pt;';
  //cssStyle += '  font-size: 10pt;';
  cssStyle += '  color: #00c;';
  cssStyle += '  font-weight: bold';
  cssStyle += '}';
  
  cssStyle += '#np, #nn, .nr, #logo span, .ch {';
  cssStyle += '  cursor: pointer;';
  cssStyle += '  cursor: hand';
  cssStyle += '}';
  
  cssStyle += '.ta {';
  cssStyle += '  padding: 3px 3px 3px 5px';
  cssStyle += '}';

  cssStyle += '#tpa2, #tpa3 {';
  cssStyle += '  padding-top: 9px';
  cssStyle += '}';
  
  cssStyle += '.sl, .r {';
  cssStyle += '  font-weight: normal;';
  cssStyle += '  margin: 0;';
  cssStyle += '  display: inline';
  cssStyle += '}';
  
  cssStyle += '.sl {';
  cssStyle += '  font-size: 84%';
  cssStyle += '}';
  
  cssStyle += '.e {';
  cssStyle += '  margin: .75em 0';
  cssStyle += '}';
  
  cssStyle += '.mblink:visited {';
  cssStyle += '  color: #00c';
  cssStyle += '}';
  
  cssStyle += '.sm {';
  cssStyle += '  display: block;';
  cssStyle += '  margin: 0;';
  cssStyle += '  margin-left: 40px';
  cssStyle += '}';
  
  cssStyle += '#navbar div, #logo span {';
  cssStyle += '  background: url(/images/nav_logo3.png) no-repeat;';
  cssStyle += '  overflow: hidden;';
  cssStyle += '  height: 26px';
  cssStyle += '}';
  
  cssStyle += '#navbar .nr {';
  cssStyle += '  background-position: -60px 0;';
  cssStyle += '  width: 16px';
  cssStyle += '}';
  
  cssStyle += '#navbar #np {';
  cssStyle += '  width: 44px';
  cssStyle += '}';
  
  cssStyle += '#navbar #nf {';
  cssStyle += '  background-position: -26px 0;';
  cssStyle += '  width: 18px';
  cssStyle += '}';
  
  cssStyle += '#navbar #nc {';
  cssStyle += '  background-position: -44px 0;';
  cssStyle += '  width: 16px';
  cssStyle += '}';
  
  cssStyle += '#navbar #nn {';
  cssStyle += '  background-position: -76px 0;';
  cssStyle += '  width: 66px;';
  cssStyle += '  margin-right: 34px';
  cssStyle += '}';
  
  cssStyle += '#navbar #nl {';
  cssStyle += '  background-position: -76px 0;';
  cssStyle += '  width: 46px';
  cssStyle += '}';
  
  cssStyle += '#logo {';
  cssStyle += '  display: block;';
  cssStyle += '  width: 150px;';
  cssStyle += '  height: 52px;';
  cssStyle += '  position: relative;';
  cssStyle += '  overflow: hidden;';
  //cssStyle += '  margin: 15px 0 12px';
  cssStyle += '  margin: 0px 0 12px';
  cssStyle += '}';
  
  cssStyle += '#logo span {';
  cssStyle += '  background-position: 0 -26px;';
  cssStyle += '  position: absolute;';
  cssStyle += '  top: 0;';
  cssStyle += '  left: 0;';
  cssStyle += '  width: 100%;';
  cssStyle += '  height: 100%';
  cssStyle += '}';

	PRO_addStyle(cssStyle, document);
	
})()

Comment of Google Styler (Fonts, Colors, Layout)

	[2007-10-30 13:53:23]Caspero says:
	nice thhxxx

	[2007-10-31 14:14:17]dogpit79 says:
	HOW DO i DOWNLOAD

	[2007-11-05 20:59:00]LouieGman says:
	GREAT GOING GUYS N GALS!

	[2007-11-26 07:46:25]rocky says:
	Nice!

[2007-12-11 17:36:35] says:

NOT SO NICE...

I have a (relatively) top of the line laptop (Core2Duo @ 2.0GHz, 2g RAM, cable 7 Mbps) and this script loads very slowly; if I do a search that is not cached, it first displays the results normal style and then switches to the desired view (maybe a second, but that is enough for me to not use it).

That said, I think it's a great idea! I haven't looked at the 'guts' behind the script; so I'm not sure of what could be improved, but I know I don't want to be in the middle of a presentation and have to (heaven forbid) search google (my default) and have this show up.

It's a great idea!

	[2008-07-17 16:05:15]tony14 says:
	How I can download that ?

Join Iescripts for a free account, or Login if you are already a member.
Username: Password:

Install Script

Download Script

Add To favorite


Written by


Name:	mrmilk
Scripts:	1
Styles:	1
Plugins:	0
Tags

font, colors, theme

About IE7Pro
IE7Pro is a plugin for the Internet Explorer web browser. It allows you to change how your favorite pages behave and look. There are many scripts that have already been written, and if you know javascript you can easily create your own! This site is a repository to download and install IE user scripts.
How to install user script
1 . First you should have install IE7Pro 0.9.12 and above which support IE user scripts. 2. Check if IE7Pro "Preference" - "User Scripts" - "EnabLe User Script" is enabled. 3. Find your favorite scripts on iescripts.org and click "Install This Script" .

iescripts.org