En este post les explicare paso a paso como instalar la modificación que hice al Tema 2.0 de este foro, para que quede asi
Citar
Indice
Como se veria un foro
Este post
Mi perfil
Encuesta EHN-DEV 2010
Un tema con bastante codigo (El geshi no lo puedo modificar)
Respondiendo un post
Como se veria un foro
Este post
Mi perfil
Encuesta EHN-DEV 2010
Un tema con bastante codigo (El geshi no lo puedo modificar)
Respondiendo un post
Primero, deben instalarse Stylish, es una extension que permite modificar el CSS "en vivo" al navegar.
Descargar para Firefox
Descargar para Chrome / Chromium
Luego deben elejirse el tema 2.0 en el foro. Para eso, van a Perfil y en en el panel de la derecha, ponen "Configuración de Apariencia y Diseño" y en Tema Actual, Elegir "Tema 2.0" (presionando el boton "cambiar" y haciendo click en el nombre del tema)
Luego agregan mi estilo al Stylish
Para Firefox:
Van a la esquina inferior derecha donde hay una "S" blanca, le hacen click y ponen "Administrar estilos", y presionan "Escribir nuevo estilo". Les saldra un nuevo dialogo, ponen el nombre que quieran ("elHacker.net Dark Style" para este caso ), y en el codigo ponen lo siguiente, aceptan y listo!
Código:
@-moz-document url-prefix('https://foro.elhacker.net') {
img[src="https://foro.elhacker.net/Themes/newgeneration/images/on.gif"]{height: 0 !important; width: 0 !important; padding-left: 50px !important; padding-top: 34px !important; background: url('http://img810.imageshack.us/img810/2725/30970175.png') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/on2.gif"]{height: 0 !important; width: 0 !important; padding-left: 50px !important; padding-top: 34px !important; background: url('http://img130.imageshack.us/img130/4936/on2a.png') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/off.gif"]{height: 0 !important; width: 0 !important; padding-left: 50px !important; padding-top: 36px !important; background: url('http://img821.imageshack.us/img821/3663/offi.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/topic/normal_post.gif"]{height: 0 !important; width: 0 !important; padding-left: 20px !important; padding-top: 20px !important; background: url('http://img17.imageshack.us/img17/7943/normalpost.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/topic/hot_post.gif"]{height: 0 !important; width: 0 !important; padding-left: 20px !important; padding-top: 20px !important; background: url('http://img153.imageshack.us/img153/3956/hotpost.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/topic/veryhot_post.gif"]{height: 0 !important; width: 0 !important; padding-left: 20px !important; padding-top: 20px !important; background: url('http://img838.imageshack.us/img838/7171/veryhotpost.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/topic/my_normal_post.gif"]{height: 0 !important; width: 0 !important; padding-left: 20px !important; padding-top: 20px !important; background: url('http://img684.imageshack.us/img684/57/mynormalpost.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/topic/my_hot_post.gif"]{height: 0 !important; width: 0 !important; padding-left: 20px !important; padding-top: 20px !important; background: url('http://img651.imageshack.us/img651/4724/myhotpost.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/topic/my_veryhot_post.gif"]{height: 0 !important; width: 0 !important; padding-left: 20px !important; padding-top: 20px !important; background: url('http://img337.imageshack.us/img337/5421/myveryhotpost.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/post/xx.gif"]{height: 0 !important; width: 0 !important; padding-left: 20px !important; padding-top: 20px !important; background: url('http://img585.imageshack.us/img585/8227/32131385.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/post/exclamation.gif"]{height: 0 !important; width: 0 !important; padding-left: 20px !important; padding-top: 20px !important; background: url('http://img249.imageshack.us/img249/2711/exclamation.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/post/question.gif"]{height: 0 !important; width: 0 !important; padding-left: 20px !important; padding-top: 20px !important; background:url('http://img214.imageshack.us/img214/4929/questionv.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/poll_left.gif"]{height: 0 !important; width: 0 !important; padding-left: 6px !important; padding-top: 12px !important; background: url('http://img713.imageshack.us/img713/8357/pollleft.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/poll_middle.gif"]{content: url('http://img337.imageshack.us/img337/425/pollmiddle.gif') !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/poll_right.gif"]{height: 0 !important; width: 0 !important; padding-left: 6px !important; padding-top: 12px !important; background: url('http://img707.imageshack.us/img707/9328/pollrightn.gif') no-repeat !important;}
*#hora{color:#FFF !important;}
#shadow-l{background:url('http://img130.imageshack.us/img130/1262/shadowld.png')!important}
#shadow-r{background:url('http://img233.imageshack.us/img233/5595/shadowrz.png')!important}
#mainbody{background:#222 !important}
a img{border:none !important}
.quote{color:#222 !important; background-color:#AAA !important; border:1px solid #232833 !important;}
.quote a{color:#444 !important}
.code{color:#111 !important; background-color:#DDD !important; border:1px solid #000 !important;}
.quoteheader, .codeheader{color:#EEE !important;}
.highlight{background-color:yellow !important; font-weight:bold !important; color:black !important}
.windowbg, tr.windowbg td{background:#444 !important; border-bottom:1px solid #555 !important}
.windowbg2, tr.windowbg2 td{background:#333 !important}
.windowbg3, tr.windowbg3 td{background:#222 !important}
.calendar_today{}
table.nopad .titlebg, tr.titlebg th, tr.titlebg td, table .titlebg2, tr.titlebg2 th, tr.titlebg2 td, tr td.titlebg{color:#FFF !important; background: url('http://img141.imageshack.us/img141/5024/navbgs.png') #DDC repeat-x !important;}
.titlebg, .titlebg a:link, .titlebg a:visited{color:#CCC !important;}
.titlebg2 a{color:#CCC !important;}
.titlebg a:hover{color:#FFF !important;}
.titlebg, .titlebg2{background:#444 !important;}
.bordercolor{ border:1px solid #000 !important;}
.tborder{ border:2px solid #000 !important;}
.catbg, .catbg2{color:#fff !important; background:#232833 url('http://img141.imageshack.us/img141/5024/navbgs.png') repeat-x !important; border-bottom:1px solid #000 !important;}
.catbg3{color:#FFF !important; background:url('http://img141.imageshack.us/img141/5024/navbgs.png') !important;}
.catbg3 a{color:#FFF !important; text-decoration:none !important;}
.catbg a, .catbg2 a, .catbg a:hover, .catbg2 a:hover{color:#fff !important; text-decoration:none !important;}
.catbg a img, .catbg2 a img, .catbg3 a img{border:none !important;}
.smalltext a{color:#DDD !important; text-decoration:none !important;}
.smalltext a img, .smalltext a:hover img{border:0 !important;}
.smalltext a:hover{color:#777 !important; border-bottom:solid 1px #777 !important;}
.signature a img{border:none !important; text-decoration:none}
.error{color:red}
#header{background:url('http://img408.imageshack.us/img408/8404/headerbgb.png') repeat-x !important;}
#header-l{background:url('http://img714.imageshack.us/img714/8087/headerla.png') 0 0 no-repeat !important;}
#header-r{background:url('http://img715.imageshack.us/img715/1386/headerreh.png') 100% 0 no-repeat !important; }
#logo-bg, #logo-bg a{background:url('http://img221.imageshack.us/img221/7074/logobg.png') no-repeat !important;}
#logo, #logo a{background:url('http://img151.imageshack.us/img151/3576/logomy.png') no-repeat !important;}
#news{background-color:#444 !important; border:1px solid #ccc !important;}
div.profile_info{color:#000 !important}
div.profile_info a{color:#222 !important}
div.profile_info a:hover{color:#000 !important}
#toolbar{background:url('http://img708.imageshack.us/img708/9389/navbg2.png') repeat-x !important}
#nav{color:#FFF !important; background:url('http://img141.imageshack.us/img141/5024/navbgs.png') !important;}
#nav li a{color:#FFF !important}
#nav a:hover{background:url('http://img708.imageshack.us/img708/9389/navbg2.png') !important}
#showcase{background:#fff !important; color:#444 !important;}
#footer{background:url('http://img40.imageshack.us/img40/8987/footerbgd.png') repeat-x !important; color:#eee !important;}
#footer-l{background:url('http://img208.imageshack.us/img208/5641/footerbgl.png') 0 0 no-repeat !important; padding-left:20px !important;}
#footer-r{background:url('http://img263.imageshack.us/img263/4379/footerbgr.png') 100% 0 no-repeat !important; height:83px; padding-right:20px !important;}
#footer a{ color:#000 !important}
#footer a:hover{color:#CCC !important}
#footer2{color:#999 !important}
body{color:#E7E7E7 !important}
#page_bg{background:#252525 !important;}
a{color:#BBB !important; outline:none !important}
a:hover{color:#FFF !important; text-decoration:none !important}
a:link,a:visited{text-decoration:none !important}
a:hover{text-decoration:none !important}
h1{padding-bottom:5px}
h2{padding-bottom:5px}
h3{padding-bottom:0px}
h4{padding-bottom:5px}
.small{color:#999 !important}
.createdate,.modifydate{color:#999 !important}
#ajax_in_progress{background:#444; color:white; text-align:center; font-weight:bold; font-size:18pt; padding:3px; width:100%; position:fixed; top:0; left:0}
.geshi{color:#111 !important; background-color:#DDD !important; border:1px solid #222 !important;}
}
Para Chrome:
Hagan click derecho en la "S" que aparece al lado de la barra de URL (omnibar) y ponen opciones, clickean en "Add new style". Le ponen un nombre, con Enabled Activado. En la parte de "Applies To" presionan "Especify" y seleccionan "URL starting with" poniendo la url del foro, con el protocolo que usen (HTTP o HTTPS). Deberia quedar "http://foro.elhacker.net" (en mi caso) y en codigo ponen el codigo de mas abajo y ponen "save" y listo
Código:
img[src="https://foro.elhacker.net/Themes/newgeneration/images/on.gif"]{height: 0 !important; width: 0 !important; padding-left: 50px !important; padding-top: 34px !important; background: url('http://img810.imageshack.us/img810/2725/30970175.png') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/on2.gif"]{height: 0 !important; width: 0 !important; padding-left: 50px !important; padding-top: 34px !important; background: url('http://img130.imageshack.us/img130/4936/on2a.png') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/off.gif"]{height: 0 !important; width: 0 !important; padding-left: 50px !important; padding-top: 36px !important; background: url('http://img821.imageshack.us/img821/3663/offi.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/topic/normal_post.gif"]{height: 0 !important; width: 0 !important; padding-left: 20px !important; padding-top: 20px !important; background: url('http://img17.imageshack.us/img17/7943/normalpost.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/topic/hot_post.gif"]{height: 0 !important; width: 0 !important; padding-left: 20px !important; padding-top: 20px !important; background: url('http://img153.imageshack.us/img153/3956/hotpost.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/topic/veryhot_post.gif"]{height: 0 !important; width: 0 !important; padding-left: 20px !important; padding-top: 20px !important; background: url('http://img838.imageshack.us/img838/7171/veryhotpost.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/topic/my_normal_post.gif"]{height: 0 !important; width: 0 !important; padding-left: 20px !important; padding-top: 20px !important; background: url('http://img684.imageshack.us/img684/57/mynormalpost.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/topic/my_hot_post.gif"]{height: 0 !important; width: 0 !important; padding-left: 20px !important; padding-top: 20px !important; background: url('http://img651.imageshack.us/img651/4724/myhotpost.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/topic/my_veryhot_post.gif"]{height: 0 !important; width: 0 !important; padding-left: 20px !important; padding-top: 20px !important; background: url('http://img337.imageshack.us/img337/5421/myveryhotpost.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/post/xx.gif"]{height: 0 !important; width: 0 !important; padding-left: 20px !important; padding-top: 20px !important; background: url('http://img585.imageshack.us/img585/8227/32131385.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/post/exclamation.gif"]{height: 0 !important; width: 0 !important; padding-left: 20px !important; padding-top: 20px !important; background: url('http://img249.imageshack.us/img249/2711/exclamation.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/post/question.gif"]{height: 0 !important; width: 0 !important; padding-left: 20px !important; padding-top: 20px !important; background:url('http://img214.imageshack.us/img214/4929/questionv.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/poll_left.gif"]{height: 0 !important; width: 0 !important; padding-left: 6px !important; padding-top: 12px !important; background: url('http://img713.imageshack.us/img713/8357/pollleft.gif') no-repeat !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/poll_middle.gif"]{content: url('http://img337.imageshack.us/img337/425/pollmiddle.gif') !important;}
img[src="https://foro.elhacker.net/Themes/newgeneration/images/poll_right.gif"]{height: 0 !important; width: 0 !important; padding-left: 6px !important; padding-top: 12px !important; background: url('http://img707.imageshack.us/img707/9328/pollrightn.gif') no-repeat !important;}
*#hora{color:#FFF !important;}
input, textarea, select{border:#222 1px solid !important;color:#FFF !important;background-color:#666 !important;}
#shadow-l{background:url('http://img130.imageshack.us/img130/1262/shadowld.png')!important}
#shadow-r{background:url('http://img233.imageshack.us/img233/5595/shadowrz.png')!important}
#mainbody{background:#222 !important}
a img{border:none !important}
.quote{color:#222 !important; background-color:#AAA !important; border:1px solid #232833 !important;}
.quote a{color:#444 !important}
.code{color:#111 !important; background-color:#DDD !important; border:1px solid #000 !important;}
.quoteheader, .codeheader{color:#EEE !important;}
.highlight{background-color:yellow !important; font-weight:bold !important; color:black !important}
.windowbg, tr.windowbg td{background:#444 !important; border-bottom:1px solid #555 !important}
.windowbg2, tr.windowbg2 td{background:#333 !important}
.windowbg3, tr.windowbg3 td{background:#222 !important}
.calendar_today{}
table.nopad .titlebg, tr.titlebg th, tr.titlebg td, table .titlebg2, tr.titlebg2 th, tr.titlebg2 td, tr td.titlebg{color:#FFF !important; background: url('http://img141.imageshack.us/img141/5024/navbgs.png') #DDC repeat-x !important;}
.titlebg, .titlebg a:link, .titlebg a:visited{color:#CCC !important;}
.titlebg2 a{color:#CCC !important;}
.titlebg a:hover{color:#FFF !important;}
.titlebg, .titlebg2{background:#444 !important;}
.bordercolor{ border:1px solid #000 !important;}
.tborder{ border:2px solid #000 !important;}
.catbg, .catbg2{color:#fff !important; background:#232833 url('http://img141.imageshack.us/img141/5024/navbgs.png') repeat-x !important; border-bottom:1px solid #000 !important;}
.catbg3{color:#FFF !important; background:url('http://img141.imageshack.us/img141/5024/navbgs.png') !important;}
.catbg3 a{color:#FFF !important; text-decoration:none !important;}
.catbg a, .catbg2 a, .catbg a:hover, .catbg2 a:hover{color:#fff !important; text-decoration:none !important;}
.catbg a img, .catbg2 a img, .catbg3 a img{border:none !important;}
.smalltext a{color:#DDD !important; text-decoration:none !important;}
.smalltext a img, .smalltext a:hover img{border:0 !important;}
.smalltext a:hover{color:#777 !important; border-bottom:solid 1px #777 !important;}
.signature a img{border:none !important; text-decoration:none}
.error{color:red}
#header{background:url('http://img408.imageshack.us/img408/8404/headerbgb.png') repeat-x !important;}
#header-l{background:url('http://img714.imageshack.us/img714/8087/headerla.png') 0 0 no-repeat !important;}
#header-r{background:url('http://img715.imageshack.us/img715/1386/headerreh.png') 100% 0 no-repeat !important; }
#logo-bg, #logo-bg a{background:url('http://img221.imageshack.us/img221/7074/logobg.png') no-repeat !important;}
#logo, #logo a{background:url('http://img151.imageshack.us/img151/3576/logomy.png') no-repeat !important;}
#news{background-color:#444 !important; border:1px solid #ccc !important;}
div.profile_info{color:#000 !important}
div.profile_info a{color:#222 !important}
div.profile_info a:hover{color:#000 !important}
#toolbar{background:url('http://img708.imageshack.us/img708/9389/navbg2.png') repeat-x !important}
#nav{color:#FFF !important; background:url('http://img141.imageshack.us/img141/5024/navbgs.png') !important;}
#nav li a{color:#FFF !important}
#nav a:hover{background:url('http://img708.imageshack.us/img708/9389/navbg2.png') !important}
#showcase{background:#fff !important; color:#444 !important;}
#footer{background:url('http://img40.imageshack.us/img40/8987/footerbgd.png') repeat-x !important; color:#eee !important;}
#footer-l{background:url('http://img208.imageshack.us/img208/5641/footerbgl.png') 0 0 no-repeat !important; padding-left:20px !important;}
#footer-r{background:url('http://img263.imageshack.us/img263/4379/footerbgr.png') 100% 0 no-repeat !important; height:83px; padding-right:20px !important;}
#footer a{ color:#000 !important}
#footer a:hover{color:#CCC !important}
#footer2{color:#999 !important}
body{color:#E7E7E7 !important}
#page_bg{background:#252525 !important;}
a{color:#BBB !important; outline:none !important}
a:hover{color:#FFF !important; text-decoration:none !important}
a:link,a:visited{text-decoration:none !important}
a:hover{text-decoration:none !important}
h1{padding-bottom:5px}
h2{padding-bottom:5px}
h3{padding-bottom:0px}
h4{padding-bottom:5px}
.small{color:#999 !important}
.createdate,.modifydate{color:#999 !important}
#ajax_in_progress{background:#444; color:white; text-align:center; font-weight:bold; font-size:18pt; padding:3px; width:100%; position:fixed; top:0; left:0}
.geshi{color:#111 !important; background-color:#DDD !important; border:1px solid #222 !important;}
Ahora si, si hicieron todo bien, los cambios ya deberian verse (o al menos presionen F5 para actualizar)
Espero que les sirva y que mas de uno lo use!
Si alguno tiene problemas, pondre imagenes