Centro de Atención Nube Configurá tu tienda Diseño Personalizar el diseño Edición avanzada de CSS

¿Cómo insertar un código CSS en mi Tiendanube?

Pasos para insertar un código de lenguaje CSS en tu administrador de Tiendanube con el cual modificar elementos del estilo de tu diseño

Última actualización: 06/02/2024

Editar el código CSS de la tienda permite hacer pequeñas modificaciones en el diseño, sin cambiar el código HTML. Esto es más complejo, requeriría trabajar con una persona con conocimientos de diseño web y abrir el FTP (o código fuente) de tu diseño para modificarlo.

Para poder aprovechar mejor las diversas posibilidades de personalización con edición en CSS, es recomendable tener un conocimiento básico de este lenguaje. Para empezar, podés hacer algún curso básico, como el de 🌐 Freecodecamp.

Delete

Info

Si ya tenés conocimientos básicos del lenguaje CSS, podés seguir también nuestro tutorial 👉 ¿Cómo obtener los códigos de CSS para hacer cambios en el diseño de mi Tiendanube?, para generarlos.

En este tutorial, te mostramos los pasos para localizar la herramienta de edición en CSS dentro del administrador de tu tienda. Para eso, podés seguir nuestra guía interactiva o el paso a paso explicativo.

▶️ Guía interactiva

Podés seguir los pasos en nuestra 👉 guía interactiva. Para una mejor experiencia, te recomendamos verla desde una computadora.

📝 Paso a paso explicativo

1. Ingresar a "Mi Tiendanube > Diseño" dentro del administrador de tu tienda.

2. Hacer clic en "Personalizar el diseño actual".

3. Una vez dentro de la sección de personalización, hacer clic en "Edición avanzada de CSS" en las opciones del menú lateral. Barra lateral de la sección "Personalizar diseño", con El botón para edición con código CSS resaltado

4. Pegar el código que quieras usar en el campo correspondiente (Ctrl+V en Windows o Command + V en Mac) y hacer clic en "Probar CSS"Campo de texto para agregar el código CSS con un código de ejemplo. Botón "Probar CSS" resaltado

5. Hacer clic en el botón de "Publicar cambios" en la parte inferior.

¡Listo! 🙌

Si tu código está bien redactado, vas a ver los cambios aplicados en tu tienda.

En caso de que quieras hacer más cambios, te sugerimos pegar los distintos códigos uno arriba del otro, separados por un espacio. Sin embargo, no es recomendable hacer muchos cambios por CSS, ya que si cambiás de plantilla, se van a perder

Delete

Info

Podés conocer más sobre las modificaciones que podés hacer con este lenguaje en 📝 ¿Qué partes del diseño se pueden modificar con códigos CSS?.

Si querés hacer cambios mayores, podés acceder al FTP de tu tienda siguiendo 📝 ¿Cómo modificar el diseño desde el código de mi tienda?

Además, podés contactar a uno de los 👉 Tiendanube Especialistas en caso de que necesites ayuda en la personalización del diseño de tu tienda vía el FTP o código CSS.