Hola chicos, estoy teniendo un problema a la hora de escribir un CSS.
Estoy usando un tema de Wordpress, Semplice, que tiene servicio de self-hosted fonts. Estoy siguiendo los pasos para lograrlo pero por algún motivo no estoy sabiendo escribir bien la url donde estas webfonts están alojadas.
Detalles:
he metido las tipos en el mismo directorio que wp-admin o wp-content como me dicen.
En este caso: http://home2/tontchoe/public_html/webfonts/Moderat
Y he puesto esta url en el .css que contiene en el espacio habilitado para ello en el tema:
src: url(‘ http://www.tontcho.es/webfonts/ moderat_bold-webfont.woff2') format('woff2'),
Pero me dicen que quizás la url no sea la correcta... pero es que no sé qué ruta tiene que ir ahí...
He probado con y sin www y nada, parece que no localiza las tipos.
Alguna idea?
gracias!
URL del sitio: Contenido solo visible a usuarios registrados
Hola Antonio.
Puedes hacer que se muestren con el método @font-face. El método @font-face te va a permitir, a través de un código introducido en el CSS de tu web, hacer que se muestren los tipos de letra que tu decidas.
Añade los archivo que te descarste (.ttf, .eot, .woff, .woff2 y .svg) dentro de la carpeta “fonts” de tu plantilla. Debes buscarla dentro de: public_html/wp-content/themes/nombre de tu plantilla/fonts
Añade el codigo de la fuente en tu archivo custom.css o el archivo de estilos que utilices para las modificaciones:
@font-face { font-family: ‘NombreDelaFuente’; src: url(‘/wp-content/themes/tuplantilla/fonts/NombreDelaFuente.eot’); src: url(‘/wp-content/themes/tuplantilla/fonts/NombreDelaFuente.eot?#iefix’) format(‘embedded-opentype’), url(‘/wp-content/themes/bridge/tuplantilla/NombreDelaFuente.woff2′) format(‘woff2’), url(‘/wp-content/themes/bridge/tuplantilla/NombreDelaFuente.woff’) format(‘woff’), url(‘/wp-content/themes/bridge/tuplantilla/NombreDelaFuente.ttf’) format(‘truetype’), url(‘/wp-content/themes/bridge/tuplantilla/NombreDelaFuente.svg’) format(‘svg’); font-weight: normal; font-style: normal; }
Una vez esto tienes que modificar tu archivo de estilos para asignarle el tipo de letra que quieres utilizar.
font-family:TipoDeLetra
Puedes utilizar un plugin si no quieres complicarte la vida por ejemplo -> https://wordpress.org/plugins/use-any-font/
Para google -> https://wordpress.org/plugins/easy-google-fonts/
Un saludo
Hola Pepe!
Estoy usando font-face, pero en el tutorial de mi tema, me dice que la carpeta webfonts tiene que estar en el mismo directorio que wp-admin o wp-content y no dentro del tema.
Este es el tutorial muy cortito:
https://www.semplice.com/videos#webfont-self-hosted
Mi problema es la ruta que tengo que poner en el CSS que luego tengo que copiar en el espacio del tema para esto. Creo que que no la estoy poniendo bien, por lo que no hay enlace y no se cargan...
Hola Antonio.
Ok, prueba a utilizar al ruta completa
https://www.tontcho.es/webfonts/moderat_bold-webfont.woff2
De todas formas con la solución que te pase tendría que mostrarse y con los plugins que te indique puedes añadirla también.
Un saludo
Sí, esa es la ruta que tenía puesta pero es la que da error o no conecta... Por eso preguntaba si era la correcta...
De hecho si la escribes en el navegador, te lleva a error 404.
Vale, creo que he solucionado el tema. Dentro de webfonts, tenía una carpeta llamada Moderat y ahí dentro todo el tema. Al mover todo el contenido a webfonts (sin carpeta) ya conecta...
muchas gracias por la ayuda Pep!
Hola Antonio.
Nada, me alegra que lo solucionaras 😉
ya sabes, cualquier cosa que podamos ayudarte estaremos por aquí
Cerramos el tema
Un saludo