# Ejecuta tu tienda Shopify en local > Levanta tu tema en tu computadora con shopify theme dev, ve cada cambio al instante en http://127.0.0.1:9292 y trabaja con tranquilidad: tus clientes siguen viendo la tienda publicada. - Página canónica (herramienta interactiva): https://adigitalcreativo.com.mx/herramientas/tienda-shopify-en-local/ - Idioma: es-MX (México) · Moneda: MXN - Tema: Técnicas y SEO — [mapa del tema](https://adigitalcreativo.com.mx/herramientas/temas/tecnicas.md) - Actualizado: 2026-10-25 (misma fecha que muestra la página) - Mantenido por: aDigital (adigitalcreativo.com.mx) - Pregunta que responde: ¿Cómo ejecuto mi tienda Shopify en local? Este documento es la versión en texto de la página. La calculadora o generador funciona en la página canónica (requiere JavaScript; los datos no salen del navegador). Las tarifas son de referencia y el usuario puede ajustarlas allí. --- Levanta tu tema en tu computadora con `shopify theme dev`, ve cada cambio al instante en `http://127.0.0.1:9292` y trabaja con tranquilidad: tus clientes siguen viendo la tienda publicada. ## ¿Cómo ejecuto mi tienda Shopify en local? Instala Shopify CLI, descarga tu tema con shopify theme pull y ejecuta shopify theme dev --store tu-tienda.myshopify.com. El CLI crea un tema de desarrollo y abre una vista previa en http://127.0.0.1:9292 que se recarga cada vez que guardas un archivo, sin tocar la tienda publicada. Fuente: [shopify theme dev (shopify.dev)](https://shopify.dev/docs/api/shopify-cli/theme/theme-dev). Sigue con: [Guía de Shopify CLI](https://adigitalcreativo.com.mx/herramientas/shopify-cli/) y [Calculadora de comisiones Shopify México](https://adigitalcreativo.com.mx/herramientas/calculadora-comisiones-shopify/). ## Paso a paso Trabajar en local significa editar los archivos del tema (Liquid, CSS, JavaScript, JSON) en tu computadora con tu editor de código y ver el resultado en el navegador en segundos, sin usar el editor de código del administrador ni arriesgar la tienda publicada. ### Instala los requisitos Necesitas Node.js 22.12 o superior, Git 2.28.0 o superior y Shopify CLI. Las instrucciones por sistema operativo están en nuestra [guía de Shopify CLI](https://adigitalcreativo.com.mx/herramientas/shopify-cli/). En resumen: ``` npm install -g @shopify/cli@latest shopify version ``` ### Duplica tu tema y no toques el publicado En el administrador ve a **Tienda online › Temas**, abre el menú del tema publicado y elige **Duplicar**. Esa copia es tu red de seguridad. Si empiezas de cero, puedes crear un tema base con `shopify theme init mi-tema`, que clona el Skeleton theme de Shopify. ### Descarga el tema Crea una carpeta, entra en ella y descarga el tema. La primera vez, `--store` indica tu tienda y el CLI abre el navegador para que inicies sesión; después la recuerda (verifícalo con `shopify theme info`). ``` mkdir mi-tienda && cd mi-tienda shopify theme list --store mitienda.myshopify.com shopify theme pull --theme 123456789 ``` Si tu tema ya vive en GitHub, clónalo en lugar de hacer pull: ``` git clone https://github.com/tu-usuario/mi-tema.git cd mi-tema ``` ### Ponlo bajo control de versiones Git te permite deshacer cualquier error. Haz un commit antes de cada cambio importante. ``` git init git add . git commit -m "Tema original descargado de Shopify" ``` ### Levanta el servidor local Dentro de la carpeta del tema ejecuta: ``` shopify theme dev --store mitienda.myshopify.com ``` El CLI sube tu carpeta a un **tema de desarrollo**: oculto, temporal y que no cuenta para tu límite de temas. En la terminal verás tres enlaces: la vista previa local en `http://127.0.0.1:9292`, el editor de temas de ese tema de desarrollo y un enlace de vista previa para compartir. Si tu tienda aún tiene contraseña de acceso, agrégala: ``` shopify theme dev --store mitienda.myshopify.com --store-password tu-contraseña ``` ### Edita con recarga en vivo Abre la carpeta en tu editor y guarda un cambio: el CSS y las secciones se recargan en caliente sin refrescar la página (modo `hot-reload`, el predeterminado). Si prefieres que siempre recargue la página completa usa `--live-reload full-page`; para desactivarlo, `--live-reload off`. ¿El puerto 9292 está ocupado? Usa `--port 9293`. ### Sincroniza el editor de temas Si tú o tu cliente mueven secciones o cambian textos desde el editor visual del tema de desarrollo, esos cambios viven en archivos JSON. Con `--theme-editor-sync` el CLI los baja a tu carpeta para que no se pierdan en el siguiente push: ``` shopify theme dev --theme-editor-sync ``` ### Sube y publica con seguridad Cuando todo esté listo, súbelo como tema nuevo sin publicar, revísalo en celular y escritorio, y publícalo: ``` shopify theme push --unpublished shopify theme list shopify theme publish --theme 987654321 ``` ## Git y la integración con GitHub Shopify tiene una integración oficial con GitHub: desde **Temas › Agregar tema › Conectar desde GitHub** vinculas una rama de tu repositorio con un tema de la biblioteca. Cada push a esa rama actualiza el tema, y los cambios hechos en el editor de temas se guardan como commits en la rama. Un flujo práctico: rama `main` conectada al tema publicado, y ramas de trabajo que pruebas en local con `theme dev` antes de fusionarlas. Así nunca editas el tema en vivo directamente. ## Buenas prácticas - Trabaja siempre sobre el tema de desarrollo o una copia; nunca uses `--allow-live` en tu día a día. - Antes de un push, haz `theme pull --only "templates/*.json" --only config/settings_data.json` para traer lo que cambiaron en el editor. - Corre `shopify theme check` antes de publicar. - Optimiza las imágenes nuevas con el [optimizador a WebP](https://adigitalcreativo.com.mx/herramientas/optimizador-imagenes-webp/) y mide el resultado con el [auditor de velocidad](https://adigitalcreativo.com.mx/herramientas/auditor-velocidad/). - Recuerda que el tema de desarrollo se borra tras siete días sin uso o al ejecutar `shopify auth logout`; tu carpeta local sí se conserva. ## Solución de problemas - **"Invalid theme directory" o similar:** no estás en la raíz del tema. Debes ver carpetas como `layout`, `sections` y `templates`. - **La página local pide contraseña o redirige:** agrega `--store-password` con la contraseña de la tienda en línea (no la de tu cuenta). - **Error 401 o "not authorized":** tu cuenta no tiene permiso de Temas o iniciaste sesión con otra. Ejecuta `shopify auth logout` y vuelve a entrar. - **Los cambios no se reflejan:** revisa la terminal; si un archivo tiene error de Liquid, el CLI lo marca y no lo sube. Prueba `--live-reload full-page`. - **El checkout se ve igual:** es normal; la vista previa local no muestra personalizaciones del checkout. - **Puerto ocupado:** otra sesión sigue abierta. Ciérrala con Ctrl + C o usa `--port`. ## Preguntas frecuentes ### ¿Mis clientes ven los cambios que hago con theme dev? No. `theme dev` sube tu carpeta a un tema de desarrollo oculto, que no cuenta para tu límite de temas. Tus clientes siguen viendo el tema publicado hasta que tú lo cambies. ### ¿Cuánto dura el tema de desarrollo? Shopify lo borra después de siete días sin actividad o cuando ejecutas `shopify auth logout`. Para una vista previa permanente, sube el tema como tema sin publicar con `theme push --unpublished` o `theme share`. ### ¿Puedo ver el checkout en local? No. La vista previa en 127.0.0.1 no muestra personalizaciones del checkout; esas se revisan en la tienda. ### ¿Necesito el plan Shopify Plus? No. Shopify CLI funciona con cualquier plan y con tiendas de desarrollo. Solo necesitas una cuenta con permiso de Temas. Comandos y comportamiento verificados contra la documentación de Shopify (shopify.dev) en octubre de 2026. Si algo cambió, `shopify theme dev --help` muestra las opciones vigentes. --- ## Herramientas relacionadas - [Guía de Shopify CLI](https://adigitalcreativo.com.mx/herramientas/shopify-cli/index.md): Instalación y comandos esenciales de Shopify CLI para temas, explicados paso a paso. - [Calculadora de comisiones Shopify México](https://adigitalcreativo.com.mx/herramientas/calculadora-comisiones-shopify/index.md): Lo que recibes después de Shopify Payments o de una pasarela externa con su comisión adicional. - [Auditor de velocidad web](https://adigitalcreativo.com.mx/herramientas/auditor-velocidad/index.md): Puntaje de rendimiento y Core Web Vitals de cualquier página, con plan de acción en español. - [Optimizador de imágenes a WebP](https://adigitalcreativo.com.mx/herramientas/optimizador-imagenes-webp/index.md): Convierte tus imágenes a WebP en el navegador y mide cuánto peso ahorras. [Mapa completo de herramientas](https://adigitalcreativo.com.mx/herramientas/sitemap.md) · [llms.txt](https://adigitalcreativo.com.mx/herramientas/llms.txt)