• URL del foro: http://www.zonareef.com/
  
• Versión del foro: 1.6.1
  
• Actualización: Desde la 1.6 a la 1.6.1
  

Hola compañeros quiero crear unos botones en css para mi tema deben quedar asi como en este enlace: botones

Ya modifique el global css con las definiciones de los botones:

Cita:@font-face {
font-family: 'SignifyLite';
src: url('signifylite-webfont.eot');
src: url('signifylite-webfont.eot?#iefix') format('embedded-opentype'),
url('signifylite-webfont.woff') format('woff'),
url('signifylite-webfont.ttf') format('truetype'),
url('signifylite-webfont.svg#SignifyLite') format('svg');
font-weight: normal;
font-style: normal;
}

.ico_privado:before { content:"UU"; font-family: 'SignifyLite'; font-weight: lighter; font-size: 0.9em; margin: 0 2px 0 -1px;}
.ico_buscar:before { content:"S"; font-family: 'SignifyLite'; font-weight: lighter; font-size: 0.9em; margin: 0 2px 0 -1px;}
.ico_reputacion:before { content:"U"; font-family: 'SignifyLite'; font-weight: lighter; font-size: 0.9em; margin: 0 2px 0 -1px;}
.ico_favorito:before { content:"~"; font-family: 'SignifyLite'; font-weight: lighter; font-size: 0.9em; margin: 0 2px 0 -1px;}
.ico_megusta:before { content:"H"; font-family: 'SignifyLite'; font-weight: lighter; font-size: 0.9em; margin: 0 2px 0 -1px;}
.ico_editar:before { content:"Y"; font-family: 'SignifyLite'; font-weight: lighter; font-size: 0.9em; margin: 0 2px 0 -1px;}
.ico_citar:before { content:"C"; font-family: 'SignifyLite'; font-weight: lighter; font-size: 0.9em; margin: 0 2px 0 -1px;}
.ico_citarmas:before { content:"C"; font-family: 'SignifyLite'; font-weight: lighter; font-size: 0.9em; margin: 0 2px 0 -1px;}
.ico_reportar:before { content:"Z"; font-family: 'SignifyLite'; font-weight: lighter; font-size: 0.9em; margin: 0 2px 0 -1px;}
.ico_borrar:before { content:"X"; font-family: 'SignifyLite'; font-weight: lighter; font-size: 0.9em; margin: 0 2px 0 -1px;}
.ico_advertir:before { content:"UZ"; font-family: 'SignifyLite'; font-weight: lighter; font-size: 0.9em; margin: 0 2px 0 -1px;}
.ico_responder:before { content:"9"; font-family: 'SignifyLite'; font-weight: lighter; font-size: 0.9em; margin: 0 2px 0 -1px;}
.ico_correo:before { content:"E"; font-family: 'SignifyLite'; font-weight: lighter; font-size: 0.9em; margin: 0 2px 0 -1px;}

/*---------------SMALL BUTTONS---------------*/

/*SMALL BLUE BUTTON*/

.btn_smallblue {
/*Basics*/
display: block;
cursor: pointer;
padding: 2px 6px;
text-align: center;
font: bold 10px/130% Ubuntu,"Helvetica Neue", Helvetica, Arial, Geneva, sans-serif;
color: #ffffff;
text-decoration: none;
border-radius: 3px;
border: 1px solid #0C3891;
text-shadow: 0px -1px 0px #083285;

/*Shadows*/
-moz-box-shadow: inset 0px 1px 0px rgba(255,255,255,0.25), 0px 1px 2px rgba(0,0,0,0.25);
-webkit-shadow: inset 0px 1px 0px rgba(255,255,255,0.25), 0px 1px 2px rgba(0,0,0,0.25);
box-shadow: inset 0px 1px 0px rgba(255,255,255,0.25), 0px 1px 2px rgba(0,0,0,0.25);

/*Gradient*/
background: #1544AA; /* Old browsers */
background: -moz-linear-gradient(top, #49A2EF 0%, #1544AA 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#49A2EF), color-stop(100%,#1544AA)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #49A2EF 0%,#1544AA 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #49A2EF 0%,#1544AA 100%); /* Opera11.10+ */
background: -ms-linear-gradient(top, #49A2EF 0%,#1544AA 100%); /* IE10+ */
filter: progidXImageTransform.Microsoft.gradient( startColorstr='#49A2EF', endColorstr='#1544AA',GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, #49A2EF 0%,#1544AA 100%); /* W3C */
}

.btn_smallblue:hover {
background: #2B5FC5; /* Old browsers */
background: -moz-linear-gradient(top, #5DB6FA 0%, #2B5FC5 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5DB6FA), color-stop(100%,#2B5FC5)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #5DB6FA 0%,#2B5FC5 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #5DB6FA 0%,#2B5FC5 100%); /* Opera11.10+ */
background: -ms-linear-gradient(top, #5DB6FA 0%,#2B5FC5 100%); /* IE10+ */
filter: progidXImageTransform.Microsoft.gradient( startColorstr='#5DB6FA', endColorstr='#2B5FC5',GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, #5DB6FA 0%,#2B5FC5 100%); /* W3C */
}

.btn_smallblue:active {
background: #49A2EF; /* Old browsers */
background: -moz-linear-gradient(top, #1544AA 0%, #49A2EF 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#1544AA), color-stop(100%,#49A2EF)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #1544AA 0%,#49A2EF 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #1544AA 0%,#49A2EF 100%); /* Opera11.10+ */
background: -ms-linear-gradient(top, #1544AA 0%,#49A2EF 100%); /* IE10+ */
filter: progidXImageTransform.Microsoft.gradient( startColorstr='#1544AA', endColorstr='#49A2EF',GradientType=0 ); /* IE6-9 */
background: linear-gradient(top, #1544AA 0%,#49A2EF 100%); /* W3C */
}

Tambien ya modifique el template de posbit_email que es el boton que quiero cambiar:

Cita:<a href="member.php?action=emailuser&amp;uid={$post['uid']}" class="btn_smallblue ico_correo" title="{$lang->postbit_email}" /> Correo</a>

Sale el boton pero no carga la fuente indicada: SignifyLite que es la que hace el simbolo del sobre de correo. Alguien que me pueda echar una mano?

Saludos Cordiales.

Verifica que la url('enlace') sea correcta.

Muchas gracias por ayudarme, efectivamente es una de las primeras cosas que cheque, he intentando con paths relativos y absolutos, copiando las fuentes en el directorio raiz, etc y nada, no las carga. Y como puedes ver en el link que deje los botones se ven bien, pero algo me falta configurar en mybb seguramente.

Saludos Cordiales.

Intenta con enlaces absolutos desde el servidor original de donde estan los botones.

Yo creo que debes enlazar la ruta de la fuente desde el archivo principal o mas bien dicho en la plantilla principal de tu foro bb.

Yo he hecho algunos cambios, por ejemplo meter otras cosas y debo darlas de alta desde la plantilla y luego meto el css en global.css

Asi me ha funcionado, me imagino que si pones la letra o enlace a la fuente desde la plantilla sea que te funcione adecuadamente, si quieres te echo una mano con eso, ponte en contacto y lo revizamos.

Saludos...

Yo entro a tu foro y veo como botones imágenes.

(20 Oct, 2011, 10:12 am)nentab escribió: Yo entro a tu foro y veo como botones imágenes.

Ya somos dos x)

(20 Oct, 2011, 3:32 pm)Jaizu escribió:

(20 Oct, 2011, 10:12 am)nentab escribió: Yo entro a tu foro y veo como botones imágenes.

Ya somos dos x)

Si es correcto, porque actualmente ese es el tema que se esta usando, quiero crear un tema aparte, no voy a experimentar con mis usuarios... jeje Si dan click en el link que deje primero ahi van a ver los botones que hice en css y funcionan bien, pero ya puestos en mybb lo unico que no se carga es la fuente.

Gracias Dark Neo, me pongo en contacto contigo.

Saludos.