Google Fonts

Puede incrustar cualquiera de las fuentes disponibles en la fundición Google Fonts en su sitio. Aunque estas fuentes no se pueden agregar a la biblioteca de fuentes y no aparecerán en el editor insertado de texto, se pueden aplicar a varios elementos de su sitio mediante CSS.

Incrustar una fuente

  1. Abra la fuente que necesita en Google Fonts y selecciónela. En la ventana emergente, copie y guarde el @import url y las líneas de código de la familia de fuentes:

    Importante: en Incrustar código, no copie todo el fragmento de código, incluidas las etiquetas <style></style>. Simplemente copie la línea del @import url.

  2. En el Modo de desarrollador, abra Sitio HTML/CSS > site.css y pegue el código @import url:

Aplique la fuente a través de CSS

Para establecer la fuente que ha incrustado como fuente global de su sitio, agregue la siguiente línea de CSS a site.css: Para obtener más información de cómo agregar CSS personalizado, consulte Modo de desarrollador.

*#dm div.dmContent *, *#dm div.dmFooter *, *#dm div.dm-title {YOUR_GOOGLE_INTEGRATION_CODE} (SU_ CÓDIGO_DE_INTEGRACIÓN_GOOGLE)

Reemplace YOUR_GOOGLE_INTEGRATION_CODE arriba por el código CSS de la familia de fuentes que copió de Google Fonts. Haga clic en Guardar.

Aplicar la fuente a un widget específico

Para aplicar una fuente a un widget individual:

  1. Haga clic con el botón derecho en el widget y en Editar HTML/CSS para abrir la ventana de edición de HTML/CSS del widget.
  2. Agregue el código CSS de la familia de fuentes que guardó en el paso 2 anterior entre los corchetes { } debajo del código CSS general o específico del dispositivo.

La fuente ahora se aplica a los elementos de texto del widget y usted puede utilizar el editor insertado para cambiar los colores y editar el texto de la manera habitual.

Aplicar la fuente a fuentes específicas del sitio global

Para aplicar sus fuentes personalizadas globalmente, debe reemplazar los elementos CSS específicos con el nombre de su fuente personalizada. Para ello:

  1. Haga clic en el botón Modo de desarrolladordev_mode_icon.png en la barra de navegación.
  2. Haga clic en HTML/CSS del sitio y luego haga clic en site-theme.css.
  3. Busque el encabezado o tipo de fuente específico que desea cambiar (por ejemplo, H1, H2, etc.) y reemplace la familia de fuentes actual con el nombre de su fuente personalizada.
  4. Haga clic en Guardar.
  5. Haga clic en Cerrar para cerrar el Modo Desarrollador.
¿Fue útil este artículo?
Usuarios a los que les pareció útil: 0 de 0

Comentarios sobre este artículo

0 comentarios

Inicie sesión para dejar un comentario.

×

Inicie sesión como profesional

El soporte telefónico prioritario está disponible exclusivamente para profesionales. Inicie sesión en su cuenta Pro ahora para ver nuestros números de soporte internacional.

Entrar
¿No es un profesional? ¡Compre un plan Pro!