Cómo alojar una fuente personalizada en tu sitio

Objetivos del artículo

Aprende cómo subir una fuente que no esté alojada en Google o Adobe a tu sitio de ecommerce, para importarla a tu formulario de registro de Klaviyo. Hay 2 opciones si deseas usar una fuente importada en tu formulario de registro:

1. Usar la fuente pública alojada en tu sitio web.
2. Alojar públicamente tu propia fuente y usar su URL para importarla a tu formulario de registro.

Cómo usar la fuente de tu sitio web

Para comenzar, puedes usar el URL público de tu sitio para subir la fuente a Klaviyo.

1. Dirígete a tu sitio.
2. Haz clic con el botón derecho del mouse para seleccionar Inspeccionar o Inspeccionar elemento, según tu navegador de Internet.
3. Desde ahí, ve a Red > Fuentes.
4. Actualiza la página.
   Verás todas tus fuentes en forma de lista. Si no aparece el nombre de la fuente y en su lugar ves una cadena de números y letras, selecciona la pestaña de vista previa para decidir qué fuente deseas usar en tu formulario de registro.
5. En Nombre, haz clic en la fuente que deseas importar.
6. Selecciona la pestaña Encabezados.
7. Copia el URL de la fuente que deseas usar.
8. En Klaviyo, navega a Contenido > Imágenes y marca > Fuentes.
9. Selecciona Importar fuente.
10. Sube tu fuente personalizada pegando el URL en la Dirección de origen.

Cómo subir una fuente autoalojada

Empieza por descargar la fuente a tu computadora si todavía no está alojada públicamente en Internet. Ten en cuenta de que el archivo debe estar en los formatos WOFF, WOFF2, TTF, EOT o SVG para que puedas usarlo en Klaviyo. Además, ten cuidado al descargar archivos de fuentes de Internet, ya que pueden contener malware. Después:

1. Sube la fuente a los recursos de tu sitio de ecommerce. Tendrás que hacerlo dentro del código de tu sitio.
2. Guárdala.

Para obtener más información acerca de cómo añadir un recurso a tu sitio, visita el centro de ayuda de la plataforma de ecommerce correspondiente.

• Shopify
• BigCommerce

Una vez obtenido el URL, navega de nuevo a Klaviyo y selecciona Contenido > Imágenes y marca > Fuentes. Desde aquí, haz clic en la pestaña Importar fuente e importa tu fuente.

Impacto de Klaviyo.js sobre la fuente de tu sitio

El seguimiento de Con actividad en el Sitio de Klaviyo (Klaviyo.js) se debe instalar manualmente o usando tu integración de ecommerce para publicar formularios de registro de Klaviyo en tu sitio web. Si solo subiste algunas variantes de fuentes, Klaviyo.js subirá las demás variantes de tu biblioteca cuando se inyecte en tu sitio. Debido a esto, es posible que se editen levemente las fuentes de tu sitio en este proceso; como por ejemplo, que se cambie el grosor del encabezado del sitio. 

Tienes 2 opciones para resolver cualquier cambio que Klaviyo.js haga en tus fuentes:

• Elimina las fuentes relevantes de tu biblioteca de fuentes Klaviyo. O 
• Actualiza la CSS del encabezado de tu sitio para que no se sobrescriba cuando Klaviyo.js suba las variantes adicionales. 
  

  Esta opción requeriría un conocimiento exhaustivo del lenguaje CSS, de modo que posiblemente necesites la ayuda de un desarrollador. Aunque Klaviyo no puede ayudarte a ajustar la CSS de tu sitio, contamos con una amplia red de socios.

Recursos adicionales

• Cómo usar fuentes personalizadas en los formularios de registro
• Curso: Creación de una estrategia de adquisición eficaz usando formularios de registro
• Cómo añadir fuentes personalizadas en plantillas de correo electrónico