Editar código de tema

Puedes editar el código de tu tema para realizar cambios específicos en tu tienda online. La mayoría de los archivos que componen un tema contienen Liquid, el lenguaje de plantillas de Shopify. Los archivos de los temas también contienen HTML, CSS y JavaScript. Edita el código de un tema solo si sabes utilizar HTML y CSS, y tienes conocimientos básicos de Liquid.

Antes de personalizar tu tema

Antes de personalizar tu tema, es recomendable realizar las siguientes tareas:

  • Duplica tu tema para crear una copia de seguridad. Así será fácil descartar tus cambios y comenzar nuevamente si fuese necesario.
  • Asegúrate de comprender qué nivel de soporte está disponible.
  • Leer más sobre los requerimientos y las prácticas correctas para subir imágenes

Edita el código de tu tema

Puedes editar el código de tu tema.

Pasos:

  1. Haz clic en Acciones > Editar Código.

El editor de código muestra un directorio de archivos de temas a la izquierda y un espacio para ver y editar los archivos a la derecha:

La página del editor de código

Puedes expandir el editor de código para llenar la pantalla haciendo clic en el ícono expandir:

El ícono expandir

Puedes volver a la vista normal de la página haciendo clic en el ícono de minimizar:

El ícono de minimizar

Cuando haces clic en un archivo en el directorio de la izquierda, se abre en el editor de código. Puedes abrirlo y editar varios archivos a la vez. Cualquier archivo que modifiques tendrá un punto morado junto al nombre del archivo:

El directorio de archivos de temas con un punto morado junto a los archivos que se han modificado

Esto puede ayudarte a hacer un seguimiento de los cambios realizados.

Si deseas revertir cualquier cambio en un archivo después de hacer clic en Guardar, abre el archivo y haz clic en Versiones anteriores. Un menú desplegable muestra la fecha y la hora de cada cambio guardado. Selecciona la versión a la que deseas regresar y haz clic en Guardar.

El menú desplegable de las versiones anteriores

Mientras el editor de código se expande a pantalla completa, puedes alternar el esquema de color del editor entre Claro y Oscuro haciendo clic en los botones en la parte inferior de la página:

El editor de códigos con el esquema de colores oscuros

Para leer más sobre los beneficios de usar el editor oscuro, consulta el artículo The Power of the Dark Side: Dark User Interfaces en el blog de Shopify Partners.

Tutoriales de personalización de códigos de temas

Puedes utilizar los tutoriales de personalización de código de temas como guía para realizar cambios en tu tienda online. Los tutoriales están organizados según el tipo de página o característica que modifican.

Obtén ayuda para personalizaciones

Si necesitas ayuda para realizar cambios en tu tema, puedes contactar al desarrollador de tu tema para recibir ayuda.

Para ver qué otros recursos están disponibles para ayudarte con las personalizaciones de temas, dirígete a la secciónRecursos adicionales para soporte de temas.

¿Estas listo(a) para comenzar a vender con Shopify?

Pruébala gratis