Para personalizar el diseño de su sitio más allá de lo que permiten los ajustes del back office, puede editar el CSS de su tema.

Este artículo le guiará paso a paso.

1. acceda a los archivos de su sitio

Hay dos formas de acceder a estos archivos.

 

Vía FTP

¡Léalo todo en nuestro artículo dedicado!

 

A través del gestor de archivos de su alojamiento web

Con la mayoría de los alojamientos web, también puede acceder a los archivos de su sitio a través del gestor de archivos.

Ejemplo con el proveedor de alojamiento IONOS:

• Acceda a su interfaz de administración:

  

• Haga clic en "Utilizar espacio web" en la sección "Espacio web":

  

• Esto le llevará a la lista de archivos del servidor:

  

 

2. identifique el archivo CSS que desea editar

En la lista de archivos de su tienda, vaya a la carpeta CSS de su tema: '/themes/your_theme_name/assets/CSS'.

En esta carpeta, puede acceder a la lista de archivos CSS de su tema.

Allí encontrará un archivo 'theme.css', así como un archivo 'custom.css' para la mayoría de los temas. Lo mejor es abrir el archivo 'custom.css'.

Si no existe en la carpeta CSS, abra el archivo 'theme.css' y vaya al final del archivo para añadir sus instrucciones.

3. abra el archivo con un editor de código

Le recomendamos que instale un editor de código para realizar sus cambios. Descubra cómo en el artículo dedicado.

 

4. realice los cambios

Puede hacer sus adiciones/modificaciones CSS en el archivo abierto.

Si desea aprender los conceptos básicos de CSS, también tenemos un artículo que le ayudará.

Una vez que haya guardado los cambios y los haya enviado al servidor, vuelva a su back office y borre la caché yendo a 'Ajustes avanzados/Rendimiento':

Una vez que se haya borrado la memoria caché, podrá ir a la oficina principal y ver qué cambios se han realizado.

 

Preguntas más frecuentes

¿Qué debo hacer si no se visualizan mis cambios?

• Asegúrese de haber borrado la caché de PrestaShop después de añadir o modificar elcustom.css.
• Compruebe que elcustom.css se carga correctamente inspeccionando las fuentes a través del navegador (F12 o haga clic con el botón derecho del ratón en la pestaña Inspeccionar fuentes).
• Asegúrese de haber guardado los cambios en su editor de texto/código y de haberlos enviado al servidor haciendo clic en sí en la ventana de FIleZilla que se abre.

 

 

⚠️Este artículo ha sido traducido por un programa de traducción automática. En caso de duda, consulte el artículo en francés o inglés.