Configuración del tema
Puedes utilizar la configuración personalizada de temas en el menú de la barra lateral del editor de temas para realizar cambios en la tipografía de tu tienda online, los colores, los enlaces a redes sociales y la página del carrito. Los cambios en la configuración del tema se aplican a toda tu tienda online.
Las secciones y los bloques también tienen una configuración que puedes ajustar para personalizar las secciones individuales de tu tema. Obtén más información sobre secciones y bloques.
En esta página
Logo
Puedes agregar un logo para tu negocio a tu tienda online. Tu logo se muestra en los siguientes lugares:
- encabezado en todas las páginas
- página de contraseña
Personalizar el logo
Las imágenes de logos tienen un ancho máximo de 300 px.
Pasos:
Escritorio
Desde el panel de control de Shopify, ve a Tienda online > Temas.
Busca el tema que deseas editar y luego haz clic en Personalizar.
Haz clic en el ícono de Configuración del tema
.Haz clic en Logo.
En el área Logo, agrega la imagen o utiliza una gratuita:
Para agregar la imagen, haz clic en Seleccionar imagen y luego agrega una nueva o existente:
- Para usar una imagen que ya subiste al panel de control de Shopify, selecciónala y luego haz clic en Listo.
- Para utilizar una imagen de la computadora, haz clic en Agregar imágenes. Selecciona y agrega una imagen, y luego haz clic en Listo.
Para utilizar una imagen gratuita, haz clic en Explorar imágenes gratuitas. Busca una imagen, haz clic en ella para seleccionarla y luego en Seleccionar.
Opcional: Agrega texto alternativo a la imagen del favicon:
- En el área Logo, haz clic en Editar.
- En el campo Texto alternativo, introduce una descripción breve de la imagen.
- Haz clic en Guardar.
Opcional: En el área Ancho del logo de escritorio, usa el control deslizante de rango para ajustar el ancho del píxel del logo.
Haz clic en Guardar.
iPhone
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca ⋮ y luego Configuración del tema.
Toca Logo.
En el área Logo, agrega la imagen o utiliza una gratuita:
Para agregar la imagen, toca Seleccionar imagen y luego agrega una nueva o una ya existente:
- Para usar una imagen que ya subiste al panel de control de Shopify, selecciónala y luego toca Listo.
- Para usar una imagen desde el dispositivo local, toca Agregar imágenes. Selecciona y agrega una imagen del dispositivo local, tócala para seleccionarla y luego toca Listo.
Para utilizar una imagen gratuita, toca Explorar imágenes gratuitas. Busca una imagen, tócala para seleccionarla y luego toca Listo.
Opcional: Agrega texto alternativo a la imagen del favicon:
- En el área Logo, toca Editar.
- En el campo Texto alternativo, introduce una descripción breve de la imagen.
- Toca ✓.
Opcional: En el área Ancho del logo de escritorio, usa el control deslizante de rango para ajustar el ancho del píxel del logo.
Toca ✓.
Android
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca … y luego Configuración del tema.
Toca Logo.
En el área Logo, agrega la imagen o utiliza una gratuita:
Para agregar la imagen, toca Seleccionar imagen y luego agrega una nueva o una ya existente:
- Para usar una imagen que ya subiste al panel de control de Shopify, selecciónala y luego toca Listo.
- Para usar una imagen desde el dispositivo local, toca Agregar imágenes. Selecciona y agrega una imagen del dispositivo local, tócala para seleccionarla y luego toca Listo.
Para utilizar una imagen gratuita, toca Explorar imágenes gratuitas. Busca una imagen, tócala para seleccionarla y luego toca Listo.
Opcional: Agrega texto alternativo a la imagen del favicon:
- En el área Logo, toca Editar.
- En el campo Texto alternativo, introduce una descripción breve de la imagen.
- Toca ✓.
Opcional: En el área Ancho del logo de escritorio, usa el control deslizante de rango para ajustar el ancho del píxel del logo.
Toca ✓.
Agregar un favicon
Puedes agregar un ícono de favoritos o un favicon, que puedes usar para ayudar con la promoción de marca de tu tienda online. Se muestra un favicon en los siguientes lugares:
- La pestaña de tu navegador web
- El historial de tu navegador web
- Íconos en tu escritorio
- Al lado del nombre de la tienda online cuando tu sitio web esté marcado como favorito
Pasos:
Escritorio
Desde el panel de control de Shopify, ve a Tienda online > Temas.
Busca el tema al que desees agregar un favicon y haz clic en Personalizar.
Haz clic en el ícono de Configuración del tema
.Según la versión del tema, haz clic en Logo o Favicon.
En la sección Imagen de favicon, haz clic en Seleccionar imagen y luego agrega una imagen nueva o existente:
- Para seleccionar una imagen que ya subiste a tu panel de control de Shopify, búscala y marca su casilla de verificación.
- Para seleccionar una imagen desde tu computadora, haz clic en Agregar imágenes, abre la imagen en la computadora y marca su casilla de verificación.
Haz clic en Listo.
Opcional: Agrega texto alternativo a la imagen del favicon:
- En la sección Imagen de favicon, haz clic en Editar.
- En el campo Texto alternativo, introduce una descripción breve de la imagen.
- Haz clic en Guardar.
Haz clic en Guardar.
iPhone
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema en el que desees agregar un favicon y luego toca Personalizar.
Toca ⋮ y luego Configuración del tema.
Dependiendo de la versión del tema, haz clic en Logo o en Favicon.
En la sección Imagen de favicon, toca Seleccionar imagen y luego agrega una imagen nueva o existente:
- Para seleccionar una imagen que ya subiste a tu panel de control de Shopify, búscala y marca su casilla de verificación.
- Para seleccionar una imagen desde tu dispositivo local, toca Agregar imágenes, abre la imagen en el dispositivo local y marca su casilla de verificación.
Toca el botón Listo.
Agregar texto alternativo a tu imagen de favicon:
- En la sección Imagen de favicon, toca Editar.
- En el campo Texto alternativo, introduce una descripción breve de la imagen.
- Toca ✓.
Toca ✓.
Android
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema en el que desees agregar un favicon y luego toca Personalizar.
Toca … y luego Configuración del tema.
Dependiendo de la versión del tema, haz clic en Logo o en Favicon.
En la sección Imagen de favicon, toca Seleccionar imagen y luego agrega una imagen nueva o existente:
- Para seleccionar una imagen que ya subiste a tu panel de control de Shopify, búscala y marca su casilla de verificación.
- Para seleccionar una imagen desde tu dispositivo local, toca Agregar imágenes, abre la imagen en el dispositivo local y marca su casilla de verificación.
Toca el botón Listo.
Agregar texto alternativo a tu imagen de favicon:
- En la sección Imagen de favicon, toca Editar.
- En el campo Texto alternativo, introduce una descripción breve de la imagen.
- Toca ✓.
Toca ✓.
Colores
Puedes definir diferentes esquemas de colores en la configuración del tema y aplicarlos a distintas secciones en toda la tienda online con un selector de esquema de colores. Un esquema de colores es un conjunto de colores. El tema tiene aplicado un conjunto de esquemas de colores predeterminados que puedes cambiar en cualquier momento en el editor de temas. Puedes agregar los colores de la marca para lograr un uso coherente de la paleta de colores en toda la tienda online.
Las plantillas no tienen configuraciones de color individuales para que el diseño de tu tienda online sea consistente en todo el sitio web. Una plantilla se considera una página principal o el contenido principal de una tienda. Tener diferentes esquemas de color en toda la tienda podría provocar una mala experiencia del usuario y hacer que los clientes abandonen tu tienda sin comprar ningún producto.
Puedes crear y personalizar hasta 21 esquemas de colores únicos y aplicarlos a diferentes secciones en toda la tienda online.
Esquemas de color
Los esquemas de color son una configuración de tema que agrupa los elementos y sus colores respectivos de manera visualmente representativa. Puedes asignar colores diferentes a varios elementos en un esquema de colores cohesivo que se puede aplicar en todo el tema donde hay un selector de esquema de colores disponible. Puedes tener hasta 21 esquemas de colores. También puedes ver cómo se muestran los colores en la vista previa del esquema.
| Configuración | Descripción |
|---|---|
| Fondo | Se aplica color al fondo de algunas secciones y al del botón con contorno. |
| Degradado de fondo | Se aplica un degradado de colores al fondo de algunas secciones. Los degradados de fondo reemplazan el fondo donde es posible. |
| Texto | Se aplica color al texto del bloque o de la sección. |
| Fondo de botón sólido | Se aplica color al fondo del botón principal. |
| Etiqueta de botón sólido | Se aplica color al texto del botón principal. |
| Botón de contorno | Se aplica color al texto y al borde del botón secundario. |
| Sombra | Se aplica color a las sombras. |
Gestión de tu esquema de colores
El esquema y las opciones de colores de la tienda se establecen en la configuración del tema. Para colores sólidos, usa el selector de color para elegir un nuevo color o introduce el valor del color en el campo de texto. El campo de color acepta los siguientes nombres y valores de color:
- Nombres de colores, como
red,blackoblue. - Códigos de color RGB.
- Valores hexadecimales del color.
Pasos:
Desde el panel de control de Shopify, ve a Tienda online > Temas.
Haz clic en Personalizar junto al tema que deseas personalizar.
Haz clic en el ícono
y, luego, haz clic en Colores.En la sección Esquemas, haz clic en un esquema existente o en Agregar esquema para agregar un nuevo esquema de colores.
Haz clic en la muestra de color para el tipo de contenido cuyo color deseas cambiar.
Para establecer el color, introduce un código de color hexadecimal o elígelo desde el selector de color. Para establecer el color en transparente, elimina el código hexadecimal del campo de texto.
Haz clic en Guardar.
Aplicar tu esquema de colores
Después de definir el esquema de colores en la configuración del tema, puedes asignar un esquema usando el selector de esquemas de colores en las secciones y bloques del tema. El selector de esquemas de colores está disponible solo en ciertas secciones, bloques y configuración general del tema.
Degradados
Puedes configurar un degradado de colores en algunos temas para obtener opciones de fondo visualmente interesantes. La configuración color_background se usa para personalizar la propiedad de fondo CSS.
El selector de degradados permite seleccionar los colores, el estilo, el ángulo, la posición y la opacidad del degradado. Las opciones seleccionadas en el selector de degradados se muestran en tiempo real en el editor de temas. También puedes crear un fondo de degradados con código CSS, que incluye un verificador de validación.
Configuración de degradados
Desde el panel de control de Shopify, ve a Tienda online > Temas.
Haz clic en Personalizar junto al tema que deseas personalizar.
Haz clic en el ícono
y, luego, haz clic en Colores.En la sección Esquemas, haz clic en un esquema existente que desees editar.
Haz clic en la opción de muestra de color de degradado, como Degradado de fondo.
Si aún no configuraste un degradado, se mostrarán algunas opciones preestablecidas para que puedas elegir. Selecciona un degradado preestablecido para abrir el panel de opciones.
Selecciona tus opciones de degradado:
- Elige entre un degradado lineal o radial. Usa los botones para seleccionar tu estilo de degradado preferido.
- Establece el ángulo del degradado con las flechas hacia arriba y hacia abajo. Haz clic en la flecha hacia arriba o hacia abajo para aumentar o reducir el porcentaje del ángulo de cinco en cinco grados.
- Usa el deslizador para seleccionar la Posición de tu degradado o introduce un valor numérico en el campo.
- Introduce un código de color hexadecimal específico o usa el control deslizante de colores para elegir un matiz. Los colores seleccionados recientemente se muestran en la parte inferior del panel de opciones de degradados.
- Para que el degradado sea opaco, usa el control deslizante a la derecha para seleccionar la transparencia del degradado. También puedes introducir un porcentaje en el campo junto al código de color hexadecimal.
Haz clic en Guardar.
Usar CSS para configurar degradados
La mayoría de los valores de la propiedad CSS background se puede usar para configurar un color de fondo. Puedes usar este campo para colores sólidos (por ejemplo #000000, black, rgb(0,0,0,0), rgba(0,0,0,0), hsl(0, 0%, 0%) y hsla(0, 0%, 0%, 1) producen un fondo negro sólido), o para degradados (por ejemplo linear-gradient(red, green), radial-gradient(red, green) o conic-gradient(red, green)). Los degradados también se pueden repetir.
Pasos:
Desde el panel de control de Shopify, ve a Tienda online > Temas.
Haz clic en Personalizar junto al tema que deseas personalizar.
Haz clic en el ícono
y, luego, haz clic en Colores.En la sección Esquemas, haz clic en un esquema existente que desees editar.
Haz clic en el degradado que deseas editar.
Haz clic en la flecha junto a Degradado y luego selecciona CSS.
En el campo código CSS, escribe o pega tu código de degradado. La vista previa del editor de temas muestra tu degradado en la ubicación adecuada.
Haz clic en Guardar.
Eliminar un degradado
Desde el panel de control de Shopify, ve a Tienda online > Temas.
Haz clic en Personalizar junto al tema que deseas personalizar.
Haz clic en el ícono
y, luego, haz clic en Colores.En la sección Esquemas, haz clic en un esquema existente que desees editar.
Haz clic en el degradado que deseas eliminar.
Haz clic en Eliminar degradado.
Haz clic en Guardar.
Tipografía
Puedes definir el estilo y el tamaño de la fuente del texto en tu tienda online. Puedes elegir una fuente de sistema o una personalizada.
Considera usar las fuentes del sistema en la tienda, ya que están instaladas en la computadora del usuario. Su uso evita la descarga de fuentes nuevas en la computadora del cliente, lo que puede afectar negativamente la velocidad de carga de la tienda. La fuente que se muestra en la computadora del cliente depende del sistema operativo.
Personalizar los tipos de fuente
Consulta la biblioteca de fuentes de Shopify para ver una lista de las fuentes disponibles.
Pasos:
Escritorio
Desde el panel de control de Shopify, ve a Tienda online > Temas.
Busca el tema que deseas editar y luego haz clic en Personalizar.
Haz clic en el ícono de Configuración del tema
.Haz clic en Tipografía.
Para cambiar el tipo de fuente del texto de los títulos o el cuerpo de la tienda, haz clic en Cambiar en la sección Títulos o Cuerpo.
Haz clic en el nombre de la fuente que desees usar y luego en Seleccionar.
Haz clic en Guardar.
iPhone
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca ⋮ y luego Configuración del tema.
Pulsa Tipografía.
Para cambiar el tipo de fuente del texto de los títulos o el cuerpo en la tienda, toca Cambiar en la sección Títulos o Cuerpo.
Toca el nombre de la fuente que desees usar y luego Listo.
Toca ✓.
Android
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca … y luego Configuración del tema.
Pulsa Tipografía.
Para cambiar el tipo de fuente del texto de los títulos o el cuerpo en la tienda, toca Cambiar en la sección Títulos o Cuerpo.
Toca el nombre de la fuente que desees usar y luego Listo.
Toca ✓.
Personaliza los tamaños de fuente
Puedes establecer los tamaños de fuente predeterminados para el texto de los títulos y el cuerpo con la configuración del tema Tipografía.
El tamaño de fuente mínimo es 100% y el máximo es 150%. Cada incremento de la escala aumenta el tamaño de fuente en un 5%. La configuración predeterminada es 100%.
Pasos:
Escritorio
Desde el panel de control de Shopify, ve a Tienda online > Temas.
Busca el tema que deseas editar y luego haz clic en Personalizar.
Haz clic en el ícono de Configuración del tema
.Haz clic en Tipografía.
Para cambiar el tamaño de fuente predeterminado del texto de los títulos, utiliza el control deslizante de rango Escala de tamaño de fuente para seleccionar el tamaño de fuente predeterminado.
Para cambiar el tamaño de fuente predeterminado del texto del cuerpo, utiliza el control deslizante de rango Escala de tamaño de fuente para seleccionar el tamaño de fuente predeterminado.
Haz clic en Guardar.
iPhone
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca ⋮ y luego Configuración del tema.
Pulsa Tipografía.
Para cambiar el tamaño de fuente predeterminado del texto de los títulos, utiliza el control deslizante de rango Escala de tamaño de fuente para seleccionar el tamaño de fuente predeterminado.
Para cambiar el tamaño de fuente predeterminado del texto del cuerpo, utiliza el control deslizante de rango Escala de tamaño de fuente para seleccionar el tamaño de fuente predeterminado.
Toca ✓.
Android
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca … y luego Configuración del tema.
Pulsa Tipografía.
Para cambiar el tamaño de fuente predeterminado del texto de los títulos, utiliza el control deslizante de rango Escala de tamaño de fuente para seleccionar el tamaño de fuente predeterminado.
Para cambiar el tamaño de fuente predeterminado del texto del cuerpo, utiliza el control deslizante de rango Escala de tamaño de fuente para seleccionar el tamaño de fuente predeterminado.
Toca ✓.
Diseño
Puedes establecer el ancho máximo en el que se mostrará la tienda online, así como el espacio vertical y horizontal entre las secciones.
Pasos:
Escritorio
Desde el panel de control de Shopify, ve a Tienda online > Temas.
Busca el tema que deseas editar y luego haz clic en Personalizar.
Haz clic en el ícono de Configuración del tema
.Haz clic en Diseño.
Usa el control deslizante de rango Ancho de la página para elegir un ancho de página de entre 1.000 y 1.600 px. La configuración predeterminada es de 1.600 px.
Opcional: Usa el control deslizante de rango para agregar espacio vertical entre las secciones de la plantilla en las páginas, hasta un máximo de 100 px entre una y otra.
Opcional: Si tienes un diseño de cuadrícula, usa los controles deslizantes de rango Espacio horizontal y Espacio vertical para agregar espacio entre el contenido de la cuadrícula en las páginas. Horizontalmente, podrás agregar un máximo de 40 px de espacio a las filas de contenido en las páginas y, verticalmente, un máximo de 40 px de espacio a las columnas de contenido en las páginas.
Haz clic en Guardar.
iPhone
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca ⋮ y luego Configuración del tema.
Toca Diseño.
Usa el control deslizante de rango Ancho de la página para elegir un ancho de página de entre 1.000 y 1.600 px. La configuración predeterminada es de 1.600 px.
Opcional: Usa el control deslizante de rango para agregar espacio vertical entre las secciones de la plantilla en las páginas, hasta un máximo de 100 px entre una y otra.
Opcional: Si tienes un diseño de cuadrícula, usa los controles deslizantes de rango Espacio horizontal y Espacio vertical para agregar espacio entre el contenido de la cuadrícula en las páginas. Horizontalmente, podrás agregar un máximo de 40 px de espacio a las filas de contenido en las páginas y, verticalmente, un máximo de 40 px de espacio a las columnas de contenido en las páginas.
Toca Guardar.
Android
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca … y luego Configuración del tema.
Toca Diseño.
Usa el control deslizante de rango Ancho de la página para elegir un ancho de página de entre 1.000 y 1.600 px. La configuración predeterminada es de 1.600 px.
Opcional: Usa el control deslizante de rango para agregar espacio vertical entre las secciones de la plantilla en las páginas, hasta un máximo de 100 px entre una y otra.
Opcional: Si tienes un diseño de cuadrícula, usa los controles deslizantes de rango Espacio horizontal y Espacio vertical para agregar espacio entre el contenido de la cuadrícula en las páginas. Horizontalmente, podrás agregar un máximo de 40 px de espacio a las filas de contenido en las páginas y, verticalmente, un máximo de 40 px de espacio a las columnas de contenido en las páginas.
Toca ✓.
Animaciones
Las animaciones te permiten agregar movimiento e interés visual a la tienda online. Puedes activar una animación con efecto de fundido de entrada que muestre las secciones de la tienda al desplazar el cursor y un efecto de movimiento para las tarjetas y botones.
Pasos:
Escritorio
Desde el panel de control de Shopify, ve a Tienda online > Temas.
Busca el tema que deseas editar y luego haz clic en Personalizar.
Haz clic en el ícono de Configuración del tema
.Haz clic en Animaciones.
Opcional: Para activar una animación que muestre las secciones de la tienda online al desplazar el cursor, selecciona Mostrar secciones al desplazar el cursor.
Opcional: Para agregar una animación con efecto de movimiento a las tarjetas y botones, selecciona una de las siguientes opciones de la configuración Efecto de movimiento:
- Elevación vertical: cuando un cliente pasa el cursor sobre una tarjeta o un botón, el elemento se desplaza hacia arriba.
- Elevación 3D: cuando un cliente pasa el cursor sobre una tarjeta o un botón, el elemento se desplaza hacia adelante, lo que le da un efecto 3D. También tiene un brillo sutil que se mueve por todo el elemento, lo que le da otra capa de dimensión.
Haz clic en Guardar.
iPhone
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca ⋮ y luego Configuración del tema.
Toca Animaciones.
Opcional: Para activar una animación que muestre las secciones de la tienda online al desplazar el cursor, selecciona Mostrar secciones al desplazar el cursor.
Opcional: Para agregar una animación con efecto de movimiento a las tarjetas y botones, selecciona una de las siguientes opciones de la configuración Efecto de movimiento:
- Elevación vertical: cuando un cliente pasa el cursor sobre una tarjeta o un botón, el elemento se desplaza hacia arriba.
- Elevación 3D: cuando un cliente pasa el cursor sobre una tarjeta o un botón, el elemento se desplaza hacia adelante, lo que le da un efecto 3D. También tiene un brillo sutil que se mueve por todo el elemento, lo que le da otra capa de dimensión.
Toca Guardar.
Android
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca … y luego Configuración del tema.
Toca Animaciones.
Opcional: Para activar una animación que muestre las secciones de la tienda online al desplazar el cursor, selecciona Mostrar secciones al desplazar el cursor.
Opcional: Para agregar una animación con efecto de movimiento a las tarjetas y botones, selecciona una de las siguientes opciones de la configuración Efecto de movimiento:
- Elevación vertical: cuando un cliente pasa el cursor sobre una tarjeta o un botón, el elemento se desplaza hacia arriba.
- Elevación 3D: cuando un cliente pasa el cursor sobre una tarjeta o un botón, el elemento se desplaza hacia adelante, lo que le da un efecto 3D. También tiene un brillo sutil que se mueve por todo el elemento, lo que le da otra capa de dimensión.
Toca ✓.
Configuración de personalización de elementos visuales
Puedes ajustar la apariencia de los elementos de tu tema, como los botones, las tarjetas del producto y las variantes desde la página Configuración del tema. Cada opción contiene la configuración relevante para ese elemento.
Puedes ajustar la configuración de los siguientes elementos de tu tema:
Botones: los botones incluyen botones de llamada a la acción en secciones como una presentación de diapositivas o una imagen con texto, así como botones en un formulario de contacto, en tus páginas de producto y páginas del carrito.
Botones de variantes: los botones de variantes te permiten mostrar las variantes de un producto en una página de producto o en una sección de productos destacados. Los clientes pueden seleccionar la variante que deseen para agregar el producto a su carrito sin necesidad de cambiar de página. Puedes personalizar cómo se muestran los botones de variantes en tu tienda online.
Entradas: las entradas son áreas interactivas que requieren que los clientes introduzcan información, por ejemplo, un selector de cantidad, un formulario de suscripción por correo electrónico o notas del carrito. Puedes ajustar la apariencia de las entradas de tu tienda online.
La configuración de las tarjetas de producto, tarjetas de colección y tarjetas de blog te permite personalizar el estilo de cada tipo de tarjeta cuando se muestran en las secciones de la página. - Tarjetas de productos: las tarjetas de productos muestran información sobre tus productos en áreas de tu tema en las que se enumeran varios productos, como plantillas de colección, secciones de colección y resultados de búsqueda. - Tarjetas de colección: las tarjetas de colección muestran información acerca de tus colecciones en áreas de tu tema que incluyen colecciones, como una plantilla o sección de lista de colecciones. - Tarjetas de blog: las tarjetas de blog muestran información sobre tus artículos de blog en áreas de tu tema que incluyen varios productos, como plantillas de blog, secciones de blog y resultados de búsqueda.
Contenedores de contenido: los contenedores se utilizan para el elemento de texto de las secciones de contenido, por ejemplo, el cuadro de texto en una presentación de diapositivas, un banner de imagen o las columnas en secciones multicolumna. Puedes personalizar la apariencia de los contenedores de contenido de la tienda online.
Elementos multimedia: los elementos multimedia son el componente visual de las secciones, por ejemplo, los elementos multimedia de productos o una imagen en la sección Imagen con texto. Puedes agregar bordes y sombras a tus elementos multimedia.
Menús desplegables y ventanas emergentes: puedes ajustar la apariencia de los menús desplegables, los modales emergentes y los mensajes emergentes del carrito en tu tienda online.
Cajones: los cajones son contenedores ocultos e interactivos que se muestran cuando los tocas o haces clic en ellos, como las opciones de un filtro de colección o los menús plegables. Puedes personalizar el borde y la sombra de los cajones de la tienda online.
Emblemas: los emblemas Oferta y Agotado se agregan automáticamente a las imágenes de tu producto cuando bajas el precio o cuando el recuento de inventario llega a cero. Puedes ajustar individualmente la posición, la forma y el color de los emblemas Oferta y Agotado en la configuración del tema. Los emblemas Página y Blog se muestran en los resultados de búsqueda relevantes. Puedes personalizar la posición y la forma de los emblemas Página y Blog, pero no puedes cambiar su color.
Información de marca: puedes incluir información sobre tu marca en la tienda online. Después de completar los siguientes pasos, puedes agregar el bloque Información de la marca en el pie de página de tu tienda online.
Pasos:
Escritorio
Desde el panel de control de Shopify, ve a Tienda online > Temas.
Haz clic en Personalizar junto al tema que desees editar.
Haz clic en el ícono de
.Haz clic en un elemento para abrir la configuración.
Ajusta cualquiera de las configuraciones disponibles. Para revisar los cambios, ve a las diferentes áreas de tu tema en la ventana de vista previa.
Haz clic en Guardar.
iPhone
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Personalizar, que está al lado del tema que quieres editar.
Toca el ícono de
.Toca un elemento para abrir la configuración.
Ajusta cualquiera de las configuraciones disponibles. Para revisar los cambios, ve a las diferentes áreas de tu tema en la ventana de vista previa.
Toca ✓.
Android
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Personalizar, que está al lado del tema que quieres editar.
Toca el ícono de
.Toca un elemento para abrir la configuración.
Ajusta cualquiera de las configuraciones disponibles. Para revisar los cambios, ve a las diferentes áreas de tu tema en la ventana de vista previa.
Toca ✓.
Redes sociales
Puedes agregar enlaces a tus cuentas de redes sociales que se muestran en el pie de página de la tienda online.
Pasos:
Escritorio
Desde el panel de control de Shopify, ve a Tienda online > Temas.
Busca el tema que deseas editar y luego haz clic en Personalizar.
Haz clic en el ícono de Configuración del tema
.Haz clic en Redes sociales.
Para agregar enlaces a tus cuentas de redes sociales, introduce las direcciones de sitio web de tus cuentas en los campos Cuentas de redes sociales correspondientes. Debes introducir enlaces completos, como https://instagram.com/shopify o https://tiktok.com/@shopify.
Haz clic en Guardar.
iPhone
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca ⋮ y luego Configuración del tema.
Toca Redes sociales.
Para agregar enlaces a tus cuentas de redes sociales, introduce las direcciones de sitio web de tus cuentas en los campos Cuentas de redes sociales correspondientes. Debes introducir enlaces completos, como https://instagram.com/shopify o https://tiktok.com/@shopify.
Toca ✓.
Android
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca … y luego Configuración del tema.
Toca Redes sociales.
Para agregar enlaces a tus cuentas de redes sociales, introduce las direcciones de sitio web de tus cuentas en los campos Cuentas de redes sociales correspondientes. Debes introducir enlaces completos, como https://instagram.com/shopify o https://tiktok.com/@shopify.
Toca ✓.
Comportamiento de búsqueda
La tienda online incluye la búsqueda predictiva, que muestra sugerencias cuando los clientes empiezan a escribir en el campo de búsqueda. Las sugerencias de productos pueden ayudar a los clientes a redactar y refinar sus búsquedas, y ofrecen nuevas formas para explorar la tienda online. También permiten a los clientes navegar rápidamente en los resultados sin tener que abandonar su página actual para ver otra lista de resultados de búsqueda.
Para más información sobre cómo funcionan las sugerencias de búsqueda, consulta Búsqueda predictiva.
Puedes personalizar cómo se muestran las sugerencias de búsqueda a los clientes.
Pasos:
Escritorio
Desde el panel de control de Shopify, ve a Tienda online > Temas.
Busca el tema que deseas editar y luego haz clic en Personalizar.
Haz clic en el ícono de Configuración del tema
.Haz clic en Comportamiento de búsqueda.
Para activar o desactivar las sugerencias de búsqueda, selecciona o deselecciona Activar sugerencias de búsqueda.
Opcional: Para mostrar u ocultar el proveedor del producto en las sugerencias de búsqueda, selecciona o deselecciona Mostrar proveedor del producto.
Opcional: Para mostrar u ocultar el precio del producto en las sugerencias de búsqueda, selecciona o deselecciona Mostrar precio del producto.
Haz clic en Guardar.
iPhone
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca ⋮ y luego Configuración del tema.
Toca Comportamiento de búsqueda.
Para activar o desactivar las sugerencias de búsqueda, selecciona o deselecciona Activar sugerencias de búsqueda.
Opcional: Para mostrar u ocultar el proveedor del producto en las sugerencias de búsqueda, selecciona o deselecciona Mostrar proveedor del producto.
Opcional: Para mostrar u ocultar el precio del producto en las sugerencias de búsqueda, selecciona o deselecciona Mostrar precio del producto.
Toca ✓.
Android
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca … y luego Configuración del tema.
Toca Comportamiento de búsqueda.
Para activar o desactivar las sugerencias de búsqueda, selecciona o deselecciona Activar sugerencias de búsqueda.
Opcional: Para mostrar u ocultar el proveedor del producto en las sugerencias de búsqueda, selecciona o deselecciona Mostrar proveedor del producto.
Opcional: Para mostrar u ocultar el precio del producto en las sugerencias de búsqueda, selecciona o deselecciona Mostrar precio del producto.
Toca ✓.
Formato de moneda
Puedes elegir que se muestre el código de moneda con los precios de los productos.
Pasos:
Escritorio
Desde el panel de control de Shopify, ve a Tienda online > Temas.
Busca el tema que deseas editar y luego haz clic en Personalizar.
Haz clic en el ícono de Configuración del tema
.Haz clic en Formato de moneda.
Para mostrar los códigos de moneda, selecciona Mostrar códigos de moneda.
Haz clic en Guardar.
iPhone
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca ⋮ y luego Configuración del tema.
Toca Formato de moneda.
Para mostrar los códigos de moneda, selecciona Mostrar códigos de moneda.
Toca ✓.
Android
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca … y luego Configuración del tema.
Toca Formato de moneda.
Para mostrar los códigos de moneda, selecciona Mostrar códigos de moneda.
Toca ✓.
Carrito
Puedes cambiar el estilo del carrito en la tienda online. Cuando un cliente agrega un producto de la tienda a su carrito, este último se puede mostrar como un carrito lateral una página o una notificación emergente. Para mantener al cliente en la página de producto, utiliza la opción de carrito lateral o notificación emergente. Para llevar al cliente a la página del carrito, usa la opción de página. Cuando el carrito del cliente está vacío, puedes mostrar una colección destacada en el carrito lateral.
Pasos:
Escritorio
Desde el panel de control de Shopify, ve a Tienda online > Temas.
Busca el tema que deseas editar y luego haz clic en Personalizar.
Haz clic en el ícono de Configuración del tema
.Haz clic en Carrito.
Usa el menú desplegable Tipo de carrito para seleccionar el estilo de carrito Lateral, Página o Notificación emergente.
Opcional: Para mostrar los proveedores de los artículos en el carrito de un cliente, selecciona Mostrar proveedor.
Opcional: Para ofrecer a los clientes un cuadro de texto donde puedan introducir solicitudes especiales o agregar información adicional del pedido, selecciona Habilitar nota del carrito.
Opcional: Si seleccionas Lateral como tipo de carrito, puedes mostrar una colección en el carrito lateral cuando esté vacío:
- En el área Carrito lateral, haz clic en Seleccionar colección.
- Haz clic en el nombre de la colección que desees mostrar y luego en Seleccionar.
Opcional: Si seleccionas Lateral como tipo de carrito, puedes cambiar el esquema de colores del carrito lateral si sigues los siguientes pasos:
- En el área Carrito lateral > Esquema de colores, haz clic en Cambiar.
- Selecciona un esquema de colores que desees usar para el carrito lateral.
Haz clic en Guardar.
iPhone
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca ⋮ y luego Configuración del tema.
Toca Carrito.
Selecciona el tipo de carrito entre las opciones Lateral, Página o Notificación emergente.
Opcional: Para mostrar los proveedores de los artículos en el carrito de un cliente, selecciona Mostrar proveedor.
Opcional: Para ofrecer a los clientes un cuadro de texto donde puedan introducir solicitudes especiales o agregar información adicional del pedido, selecciona Habilitar nota del carrito.
Opcional: Si seleccionas Lateral como tipo de carrito, puedes mostrar una colección en el carrito lateral cuando esté vacío:
- En el área Carrito lateral, toca Seleccionar colección.
- Toca el nombre de la colección que desees mostrar y luego Listo.
Opcional: Si seleccionas Lateral como tipo de carrito, puedes cambiar el esquema de colores del carrito lateral si sigues los siguientes pasos:
- En el área Carrito lateral > Esquema de colores, toca Cambiar.
- Selecciona un esquema de colores que desees usar para el carrito lateral y luego toca Listo.
Toca ✓.
Android
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca … y luego Configuración del tema.
Toca Carrito.
Selecciona el tipo de carrito entre las opciones Lateral, Página o Notificación emergente.
Opcional: Para mostrar los proveedores de los artículos en el carrito de un cliente, selecciona Mostrar proveedor.
Opcional: Para ofrecer a los clientes un cuadro de texto donde puedan introducir solicitudes especiales o agregar información adicional del pedido, selecciona Habilitar nota del carrito.
Opcional: Si seleccionas Lateral como tipo de carrito, puedes mostrar una colección en el carrito lateral cuando esté vacío:
- En el área Carrito lateral, toca Seleccionar colección.
- Toca el nombre de la colección que desees mostrar y luego Listo.
Opcional: Si seleccionas Lateral como tipo de carrito, puedes cambiar el esquema de colores del carrito lateral si sigues los siguientes pasos:
- En el área Carrito lateral > Esquema de colores, toca Cambiar.
- Selecciona un esquema de colores que desees usar para el carrito lateral y luego toca Listo.
Toca ✓.
CSS personalizado
La sección CSS personalizado te permite introducir tu propio código CSS, por ejemplo, para personalizar la apariencia de los botones de la tienda online aparte de la configuración predeterminada que está disponible o a fin de aplicar un estilo único a elementos de texto específicos.
El CSS personalizado en la configuración del tema afecta a todas las páginas de la tienda online, excepto la pantalla de pago.
Obtén más información sobre cómo agregar CSS personalizado al tema.
Estilo del tema
Un estilo de tema es una colección de opciones de configuración elegidas por un diseñador de temas. Puede aplicar un estilo del tema a la tienda para darle una apariencia perfeccionada. Todos los temas tienen un estilo aplicado de forma predeterminada. Las demás opciones de estilo que tengas dependerán del tema que utilices.
Cuando personalizas una plantilla, la configuración del estilo del tema se reemplaza con tu versión personalizada. Cuando aplicas un estilo a tu tema, cambias los ajustes actuales, como colores y tipografía.
Pasos:
Escritorio
Desde el panel de control de Shopify, ve a Tienda online > Temas.
Busca el tema que deseas editar y luego haz clic en Personalizar.
Haz clic en el ícono de Configuración del tema
.Haz clic en Estilo del tema.
Selecciona el estilo del tema que desees usar y luego haz clic en Cambiar estilo.
Haz clic en Guardar.
iPhone
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca ⋮ y luego Configuración del tema.
Toca Estilo del tema.
Selecciona el estilo del tema que desees usar y luego toca Listo.
Toca ✓.
Android
En la aplicación de Shopify, toca el ícono de
.En la sección Canales de ventas, toca Tienda online.
Toca Gestionar todos los temas.
Busca el tema que deseas editar, y luego toca Personalizar.
Toca … y luego Configuración del tema.
Toca Estilo del tema.
Selecciona el estilo del tema que desees usar y luego toca Listo.
Toca ✓.