Problema al visualizar tipografía en Wordpress

  • Autor Autor mweb
  • Fecha de inicio Fecha de inicio
M

mweb

Alfa
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Hola!!

tengo una consulta acerca de por qué no puedo visualizar correctamente una tipografia que quiero instalar en una web realizada en Wordpress.

La tipografia es de pago, por lo que no puedo hacerlo a través de GoogleFont que sería lo más rápido. Pero tengo la tipografia instalada en mi ordenador. Por lo que he subido la tipografia descargando primero el Kit en Font-Squirrell.
Al instalarlo en Wordpress y visualizarlo online en ordenadores MAC y tablet lo veo perfecto, pero al verlo en un PC se ve fatal.

¿ Alguien sabe por qué? Y Como podría solucionarlo? Muchas gracias!!
 
¿Cuales archivos subiste en total? Digo, extensiones.

Enviado desde mi SGH-I897 usando Tapatalk 2
 
Además de las extensiones de los archivos que has empleado, como ha comentado WindHack, sería interesante que reprodujeras aquí las líneas de CSS que has incluido
 
Claro recuerda que tienes que subir ttf y los demás, luego hacer la implementación en el head y luego ver el css
 
He añadido a la carpeta de "fonts" las extensiones: .eot, .svg, .ttf, .woff.
Y en el CSS he añadido lo siguiente:

@font-face {
font-family: 'Conv_MOD20';
src: url('fonts/MOD20.eot');
src: local('☺'), url('fonts/MOD20.woff') format('woff'), url('fonts/MOD20.ttf') format('truetype'), url('fonts/MOD20.svg') format('svg');
font-weight: normal;
font-style: normal;
}

En realidad son varias tipografias que quiero instalar. Y tengo otra duda, porque a través de Font Squirrell he podido descargar el kit con todas las extensiones para una tipografia. Pero en otras al tratar descargar el kit sale el siguiente mensaje: "Adobe has requested that their font Bauer Bodoni Std 2 Black be blacklisted by the Generator. You will not be able to convert this font". Por lo que he optado por descargarlo a través de otra página y si he podido hacerlo.

En cualquier caso, todas las fuentes que he instalado las sigo viendo peor en los PC...
 
Primero se me ocurre que, según donde hayas incluido estas líneas de CSS, los archivos con las fuentes no estén correctamente direccionados por las rutas relativas y tu navegador, al no encontrarlos, simplemente esté tirando de la fuente local instalada. Prueba a acceder a tu web desde otro equipo que no tenga esta fuente instalada para descartar que sea esto lo que está pasando.

Segundo, la sintaxis que estás utilizando es "bulleproof smiley". Yo personalmente nunca la he utilizado, así que no sé hasta que punto es realmente "bulletproof". Podrías probar con otra sintaxis más "conservadora" como esta:

@font-face {
font-family: 'MyWebFont';
src: url('webfont.eot'); /* IE9 Compat Modes */
src: url('webfont.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
url('webfont.woff') format('woff'), /* Modern Browsers */
url('webfont.ttf') format('truetype'), /* Safari, Android, iOS */
url('webfont.svg#svgFontName') format('svg'); /* Legacy iOS */
}

Espero que esto pueda ayudarte en algo.
 
Hola Maize, gracias, he probado el código que me has pasado, se ve mejor alguna tipografia, pero no todas ( y la que más me interesa utitlizar justamente se ve fatal, las demás podría buscar alguna tipo similar). La verdad no sé que mas puedo hacer. ¿ Alguna sugerencia? Lo volveré a revisar pero la ruta está bien y creo que está todo correcto...
 
Una mejora siempre es una mejora 😉 Entiendo que en Mac y tablet sigue renderizando bien, ¿qué tablet? En PC, ¿en qué SO y navegador tienes el problema?
 
Atrás
Arriba