Cómo modificar fuentes en tu tienda Comandia Aprende con estos consejos a modificar la tipografía de tu tienda online

El tipo de letra en una tienda online otorga carácter y personalidad a tu negocio. Si quieres darle un nuevo toque a tu tienda o un buen lavado de cara, y hacerlo fácilmente, te recomendamos seguir esta guía para que puedas insertar la fuente que más te guste en tu tienda online.

Hay dos formas de modificar la fuente tipográfica en una tienda Comandia, formas que dependen del sitio desde el cual se cargue la fuente.

.

1.      Fuente en un archivo local

Si dispone de una fuente tipográfica en un archivo local de su ordenador, primero debe descargarse la plantilla de su tienda en el ordenador. Entre en Diseño >> Plantillas >> Personalizar y, en la barra inferior, haga clic en Exportar plantilla:

Imagen 1

Automáticamente, se descargará la plantilla en un archivo comprimido zip.

Descomprima el archivo y añada el archivo de la fuente que tiene usted en el ordenador a la carpeta fonts (si la plantilla no tiene esa carpeta, cree una carpeta fonts):

Imagen 3

A continuación, comprima todo el archivo de nuevo, vuelva a Diseño >> Plantillas >> Personalizar y haga clic en Importar plantilla.

Imagen 2

Nota: si le da error “Entity too large”, elimine la carpeta template-screenshot, comprima el archivo y vuelva a importarlo.

Una vez importada la plantilla, debe ir a la carpeta CSS y al archivo principal (style.css o main.css, según la plantilla):

Imagen 4

 y modificar las primeras líneas del archivo que hacen referencia a las fuentes.

La llamada será de esta forma:

@font-face {

    font-family: ‘ Nombre de la fuente’;

    src:url(../fonts/Nombre-de-la-fuente.ttf);

}

Nota: la extensión del archivo puede variar debido a que hay varios tipos de extensiones para las fuentes.

.

2.      Fuente en un servidor online

Si la fuente está en un servidor online, cómo es el caso de Google Fonts (https://fonts.google.com/) debe copiar la URL del archivo del servidor en el que esté disponible, ir a la carpeta CSS y al archivo principal (style.css o main.css, según la plantilla) y modificar las primeras líneas del archivo que hacen referencia a las fuentes para incluir la llamada al servidor con la URL.

Para añadir la fuente a nuestra plantilla con la fuente en un servidor online utilizaremos la siguiente línea de código:

@import url(‘https://fonts.googleapis.com/css?family=Roboto’);

Nota: el punto y coma final es requisito necesario

Dentro de los paréntesis, entre las comillas, debemos introducir la URL del servidor en el que esté alojada la fuente.

fuente

Esta línea debemos introducirla, sin sustituir nada, en la línea 1 del archivo main.css/style.css que tenga la plantilla.

En cualquiera de los dos casos, hay que establecer la fuente en los estilos.

Copia este código:

* {

            font-family: ‘Nombre de la fuente’;

}

html, body, h1, h2, h3, h4, h5, h6, a, p {

            font-family: ‘Nombre de la fuente’;

}

Edita el código insertando el nombre de la fuente que quieres aplicar (en ‘Nombre de la fuente’) y pégalo al final del archivo css para que tenga más prioridad que las llamadas anteriores en tu plantilla.

.

.

¿Te ha parecido complicado el proceso o no dispones de tiempo para dedicarle a estas mejoras?

¡Contrata nuestros servicio de diseño y puesta en marcha de tu tienda online! Con Comandia Design, un equipo de diseñadores profesionales montará la tienda por ti dejándola lista para vender.

El equipo de Comandia está formado por grupo de personas multidisciplinares especialistas en transformar las ideas de negocio de los clientes en tiendas online, páginas webs y aplicaciones únicas y personales. Además, damos la oportunidad de vender en cualquier parte del mundo a través de nuestra solución Vender en Marketplaces.

Formado por profesionales con más de 15 años de experiencia en el comercio electrónico, Comandia es una plataforma digital muy intuitiva para desarrollar tu negocio online y vender tus productos sin necesidad de conocimientos técnicos.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *