Firefox

google.co.kr 배경색 파란색으로 변경하는 stylish 스크립트

doimoi 2007. 11. 7. 08:47

Greasemonkey가 스크립트를 사용자가 맘껏 변경해 주는 확장 기능이라면, CSS를 사용자가 맘껏 변경해 주는 확장으로는 stylish라는 확장 기능이 있습니다. Firefox, Flock, Thunderbird에서 작동합니다.

Javascript가 주로 기능적인 부분을 제어하기 때문에 특정 사이트에 기능을 내 맘데로 변경 해 웹서핑 할 수 있다면, stylish라는 확장 기능은 CSS를 제어하기 때문에 디자인적인 요소를 변경해 웹서핑을 할 수 있습니다.

Greasemonkey도 아직 국내에서는 그렇게 많이 보급이 안 되어, 국내 웹사이트에 적용 할 수 있는 스크립트가 많지 않은 것처럼, 마찬가지로 stylish도 국내 웹사이트 관련 스크립트가 별로 없습니다.

다만, 해외에 구글과 야후 관련 스크립트가 많기 때문에 이것들을 수정 해 google.co.kr과 yahoo.co.kr 를 접속 할 때 사용 할 수 있습니다.

아래는, 제가 Valacar님이 만든 것을 약간 수정해 google.co.kr에서 사용 할 수 있게 한 stylish 스크립트입니다.

stylish를 설치 후, 아래 스크립트를 복사 해 넣으시면 됩니다.

설치 후 모습은 다음과 같습니다.

사용자 삽입 이미지

먼저, https://addons.mozilla.org/ko/firefox/addon/2108 에 접속해 stylish를 설치 후 아래 스크립트를 추가 하시면 됩니다.

/*
 * Google Web Search - dark blue redesign
 *
 * Author      : Valacar
 * Updated     : October 18th, 2007
 * Website     : http://www.valacar.com/userstyles/
 * Description : Modifies the colors, logos, and a few other images on Google Web Search (http://www.google.co.kr/)
 * Usage       : Use with Stylish Firefox extension (http://userstyles.org/) or copy to your Firefox userContent.css file
 * Thanks to   : pile0nades, mobius, and gzusphish for helping find/fix bugs
 */

@namespace url(http://www.w3.org/1999/xhtml);

/* Common rules
--------------- */

@-moz-document url(http://www.google.co.kr/), url-prefix(http://www.google.co.kr/webhp), url-prefix(http://www.google.co.kr/search?), url-prefix(http://www.google.co.kr/advanced_search), url-prefix(http://www.google.co.kr/preferences), url-prefix(http://www.google.co.kr/language_tools), url-prefix(http://images.google.co.kr/webhp), url(http://www.google.co.kr/intl/en/) {

body {
 background: #253960 url("https://t1.daumcdn.net/cfile/tistory/2774CD3956E63D9808") top left repeat-x !important;
 color: #FFF !important;
 font-family: Tahoma, Arial, Helvetica, sans-serif !important;
}

/* defaults for all links */
a:link { color: #82BDFF !important; }
a:visited { color: #72ADDF !important; }
a:active { color: #92CDFF !important; }

/* change color of lots of text */
font, div, td { color: #fff !important; }

/* fix for google suggest colors */
.aAutoComplete .cAutoComplete, .google-ac-a .google-ac-c { color: #000 !important; }
.aAutoComplete .dAutoComplete, .google-ac-a .google-ac-d { color: green !important; }
.google-ac-e td { color: blue !important; }


/* make sure web forms (and google suggest) don't get their colors changed */
input *, textarea *, .aAutoComplete { background-color: -moz-Field !important; color: -moz-fieldtext !important; }


/* Box that pops up when you click the "more >>" link */
span#more, #gbar .gbard, #gbar [class^="gb"] { background: #08274f !important; border: none !important; }
#gbar .gbard a:hover, #gbar [class^="gb"] a:hover { background: #385690 !important; }
#gbi { border: none !important; background: transparent !important; }


/* superscripted "New!" text */
sup font[color="red"] { color: #0F0 !important; }

/* hide gbar border */
[id^="gbar"], #gbh { border: none !important; }

}


/* Front page
------------- */

@-moz-document url(http://www.google.co.kr/), url-prefix(http://www.google.co.kr/webhp), url-prefix(http://images.google.co.kr/webhp), url(http://www.google.co.kr/intl/en/) {

/* Replace main logo image */
img[src*="/logos/"], img[src$="logo.gif"], div[style*="logo_plain.png"], img[src$="logo_google_suggest.gif"] {
 margin-top: 5em !important;
 width: 0 !important;
 height: 103px !important;
 padding-left: 281px !important;
 background-image: url("https://t1.daumcdn.net/cfile/tistory/2338C14C56E63D9913") !important;
}

/* country name overlaying main logo */
div[style="color: rgb(111, 111, 111); font-size: 16px; font-weight: bold; left: 208px; position: relative; top: 78px;"] {
 display: none !important;  /* if you want your country name to show, remove this line */
 color: #33537f !important;
 left: 0 !important;
}

/* delete some crap after input box and buttons */
form + br + table { display: none !important; }

/* move buttons down a bit */
input[type="submit"] { margin-top: .5em !important; }

}


/* Shared Images and Selectors
------------------------------ */

@-moz-document url-prefix(http://www.google.co.kr/search?), url-prefix(http://www.google.co.kr/advanced_search), url-prefix(http://www.google.co.kr/preferences), url-prefix(http://www.google.co.kr/language_tools) {

/* Replace small upper left logo images */
#logo span, img[src*="/logos/"][width="150"], img[src$="logo_sm.gif"][width="150"], img[src$="logo_google_suggest_sm.gif"] {
 background: url("https://t1.daumcdn.net/cfile/tistory/2461104D56E63D991C") top left no-repeat !important;
}
img[src*="/logos/"][width="150"], img[src*="logo_sm.gif"][width="150"], img[src$="logo_google_suggest_sm.gif"] {
 width: 0 !important;
 height: 51px !important;
 padding-left: 135px !important;
}

/* Hide logo text link */
a#logo { font-size: 0 !important; }

/* top bar on search results, adv.search, prefs, lang.tools page */
table.t.bt, td[bgcolor="#E5ECF9"] { background: #405882 url("https://t1.daumcdn.net/cfile/tistory/2208714656E644CA16") top left repeat-x !important; }
.t { padding: 2px !important; }

/* change color of links in top bars */
td[bgcolor="#e5ecf9"] a, .t.bt a.q { color: #fff !important; }

/* hide top border on top bar */
td[bgcolor="#3366cc"] { display: none !important; }

}


/* Search results
----------------- */

@-moz-document url-prefix(http://www.google.co.kr/search?) {

.g { margin-left: .5em !important; }

/* title of search result */
.g .l { font-size: 1.1em !important; }
.g a:hover { color: #98c9ff !important; }
.g a:visited { color: #6282a5 !important; }

/* description of search result */
.g .j font {
 line-height: 1.4 !important;
}

/* text URL that usually appears in dark green below the link description */
.g font[color="green"], .g font[color="#008000"], .e font[color="green"], .a { color: #DACA7D !important; }

/* "Cached", "Similar pages", "More results", and "View as HTML" links */
.g .fl, .j font a, .f { color: #AAA !important; }
.g .fl:hover, .j font a:hover { color: #CCC !important; }

/* File type (ex: [PDF]) next to link */
.g .w b { color: #FF6 !important; }

/* make each search result a bit wider (34em is default) */
.j {
 width: 50em !important;
 color: #fff !important;
}

/*%[ Bars ]%*/

/* bottom bars */
table.t.bt.bb,
table.t.bt.n,
td[bgcolor="#e5ecf9"]
{
 background: #3d557f !important;
}

/* remove border on top and bottom bar */
.bt, .bt { border: none !important; }

/* copyright + google links at bottom of page */
.ft.t.n, table.ft.t.bb.bt { background: transparent !important; border: none !important; }

.t.n.bt { background: transparent !important; }


/*%[ Navbar ]%*/

/* Hide the "Gooooooooooogle" image in the Result Page block...text is good enough */
#navbar img { visibility: hidden !important; }
#navbar * { background-image: none !important; }

/* Current page number that comes after "Result Page:" */
#navbar .i {
 color: #FFF !important;
 font-weight: bold !important;
 font-size: 1.5em !important;
}

/* page number links that come after "Result Page:" */
#navbar a {
 font-size: 1em !important;
}

/* modify the navbar links a bit */
#navbar a:hover { color: #98c9ff !important; }
#navbar a:visited { color: #6282a5 !important; }
/* spreads out navbar numbers and aligns to baseline */
#navbar br { display: none !important; }

/*%[ Notifications ]%*/

/* "Did you mean" text */
p > font.p { color: #0f0 !important; }

/* note at end about omitted results */
.g + p i, blockquote.g + p i { color: #fff !important; }

/* Refine results for ... */
#po td { color: #fff !important; }

/* See results for: */
p.g { color: #fff !important; }

/*%[ Advertisements ]%*/

/* hide right column of ads */
table[width="25%"][align="right"] { display: none !important; }

/* hide google toolbar image ad at bottom...text is still there */
img[src$="firefox_toolbar.gif"] { display: none !important; }

/* sponsored links above search results (sometimes they're useful) */
.ch, div[id^="tpa"] {
 background: #2c4573 !important;
 padding: 0.3em 0.5em !important;
}

.mbl1, img.ch { background: transparent !important; }

.g img { border: none !important; }

/* hide block after navbar advertising google products */
#res + center table[cellpadding="10"], #res + center br:first-child { display: none !important; }

/* hide all siblings after copyright at bottom */
div.ft ~ * { display: none !important; }

/*%[ Wikipedia info ]%*/

#pfe {
 background: #2c4573 !important;
 color: #fff !important;
 -moz-border-radius: 7px !important;
 border: 1px solid #3e547c !important;
 padding: 0.3em 0.5em !important;
}

#pfrl { background: #2c4573 !important; }
#pfe div { color: #fff !important; }

img[src="/images/newspaper.gif"] {
 width: 0 !important;
 height: 30px !important;
 padding-left: 40px !important;
 background: url("https://t1.daumcdn.net/cfile/tistory/224B673956E63D992F") no-repeat !important;
}

img[src="/images/shopbag.gif"] {
 width: 0 !important;
 height: 30px !important;
 padding-left: 40px !important;
 background: url("https://t1.daumcdn.net/cfile/tistory/23211A4956E63D9903") no-repeat !important;
}

/* film reel */
img[src="/images/showtimes-onebox.gif"] {
 width: 0 !important;
 height: 30px !important;
 padding-left: 40px !important;
 background: url("https://t1.daumcdn.net/cfile/tistory/2747E53956E63D9A32") no-repeat !important;
}

/* Shopping cart "image" */
.tfb td.c, .tb td.c{background:#999 !important;}
.tfb td.b, .tb td.b{background:#ccc !important;}
.tfb td.a, .tb td.a{background:#fff !important;}


/* movie rating stars */
img[src="/images/showtimes-star-on.gif"], img[src="/images/showtimes-star-off.gif"], img[src="/images/showtimes-star-half.gif"] {
 width: 0 !important;
 height: 10px !important;
 padding-left: 10px !important;
 background: url("https://t1.daumcdn.net/cfile/tistory/2610283C56E63D9A33") no-repeat !important;
}

/* half star */
img[src="/images/showtimes-star-half.gif"] {
 background-position: -10px 0 !important;
}

/* no star */
img[src="/images/showtimes-star-off.gif"] {
 background-position: -20px 0 !important;
}


}


/* Google Advanced Search page
------------------------------ */

@-moz-document url-prefix(http://www.google.co.kr/advanced_search) {

/* table colors/borders */
tr[bgcolor="#cbdced"] { background: #50668d !important; }
tr[bgcolor="#ffffff"] { background: #405882 !important; }

}


/* Google Search preferences page
--------------------------------- */

@-moz-document url-prefix(http://www.google.co.kr/preferences) {

/* Change color of top and bottom bars */
tr[bgcolor="#E5ECF9"] { background: #415983 !important; }

/* form tables */
form p table[width="100%"][cellspacing="0"][cellpadding="0"][border="0"] {
 background: #415983 !important;
 border: 3px solid #50668d !important;
 margin: 3px !important;
}

/* left columns of the form tables */
form p table[width="100%"][cellspacing="0"][cellpadding="0"][border="0"] td[width="175"] {
 background: #50668d !important;
 border-right: 1em solid #415983 !important;
}

/* hide form table borders */
form p table td[bgcolor="#cbdced"] { display: none !important; }

}


/* Language Tools page
---------------------- */

@-moz-document url-prefix(http://www.google.co.kr/language_tools) {

/* table colors/borders */
table[bgcolor="#ffffff"] { background: #415983 !important; } /* flag table */
tr[bgcolor="#ffffff"] { background: #415983 !important; }   /* most all tables and table headers */
tr[bgcolor="#cbdced"] { background: #50668d !important; }  /* table borders */

/* table headers of all tables */
p > table > tbody > tr:first-child { background: #50668d !important; }

}

-----------------------
여기까지 복사해 붙여 넣으세요

<관련글>
2007/11/06 - [Firefox] - Greasemonkey와 Greased Lightbox