Compártelo ya!!
Opt In Image
DESCARGA GRATIS
1.- Guía para crear una tienda online de éxito
2.- Guía SEO para Prestashop
  • Recibe todos los domingos las últimas entradas del blog.
  • Recibe contenidos exclusivos.

Te puedes dar de baja en cualquier momento. Nada de spam

 

En el momento de escribir este post, la plantilla Warehouse nos ofrece hasta 13 demos que podemos utilizar en nuestro Prestashop 1.7

Pero poco a poco los creadores de la plantilla Warehouse van añadiendo nuevas demos que podemos utilizar para la creación de nuestra tienda online.

Podemos utilizar la plantilla Warehouse para construir una tienda online con un diseño a nuestra medida, pues dispone de herramientas muy potentes como el page builder Elementor para construcción de contenido de home y resto de páginas, y de un potente configurador de temas para los diseños de header y footer. Pero podemos partir de alguno de los diseños profesionales que nos regalan los creadores de la plantilla Warehouse.

En este post vamos a aprender a importar esas demos o diseños de tienda de ejemplo a nuestro Prestashop.

 

QUIERO LA PLANTILLA WAREOHUSE

 

 

 

1.- Demos o diseños predefinidos que podemos utilizar con nuestra plantilla Warehouse para Prestashop 1.7

 

En el momento de crear este post hay 13 diseños diferentes, pero poco a poco los creadores de la plantilla Warehouse irán añadiendo más demos nuevas.

Desde este enlace puedes ver todas las demos que podemos reutilizar en nuestro Prestashop 1.7:

VER TODOS LOS DISEÑOS

Si haces clic en alguno de los diseños, verás la demo en vivo de ese diseño.

 

diferentes demos o diseños para cargar en Prestashop

Demos disponibles para cargar en nuestro Prestashop

 

 
 

2.- Acciones previas antes de importar una demo o diseño para la plantilla Warehouse

 

Antes de importar una demo de la plantilla Warehouse es recomendable realizar las siguientes acciones sobre tu Prestashop:

 

i.- Desactivar cache smarty: si tienes activada la caché, desactívala y vacía la caché. Tras hacer la importación y ver el resultado puedes volver a activarla.

Para desactivar la caché ve a: “CONFIGURAR > Parámetros avanzados > Rendimiento” y realiza las siguientes acciones:

a.- Bloque SMARTY: en el bloque smarty, pon el selector “CACHE” en “NO”, y la opción de “Compilación de plantillas” en “Recompilar las plantillas cuando los archivos sean modificados”.

A continuación, haz clic en el botón “Guardar” y después en el botón “Vaciar cache”.

 

desactivar caché smarty y vaciarla

Desactivar caché smarty y vaciar caché

 

b.- CCC: Un poco más abajo verás un bloque denominado: “CCC (COMBINACIÓN, COMPRESIÓN Y CACHÉ)

Pon en “si” los selectores: “Smart cache” para las hojas de estilo (CSS), “Smart cache” para el código de JavaScript y Optimización de Apache.

A continuación, haz clic en el botón “Guardar”.

 

Opciones compresion en si

Opciones de CCC en SI

 

Nota importante: Al activar los elementos del bloque CCC es posible que te aparezca un error en la web, y que posteriormente no puedas acceder al panel de administración.

Algunos hostings tienen desactivada por defecto la función ini_set() en la configuración del servidor por motivos de seguridad.

Si este es tu caso, ponte en contacto con tu empresa de hosting para que te activen la función.

 

Aprende a utilizar el page builder o constructor de páginas de la plantilla Warehouse: Page builder Elementor

 

 

3.- Descargar demos de la plantilla Warehouse

 

Como te comentaba en el apartado 1, puedes ver todas las demos para Warehouse y Prestashop 1.7 haciendo clic en el siguiente enlace

 

Para descargar los archivos de todas las demos, puedes hacer clic en el siguiente enlace:

DESCARGAR DEMOS

 

Obtendrás una carpeta para cada una de las demos disponibles para importar en tu Prestashop con la plantilla Warehouse.

Debes descomprimir el archivo que te has descargado.

 

Aprende a utilizar el Menú de la plantilla Warehouse: Menú Warehouse

 

 

4.- Importar diseño general del tema

 

A la hora de importar una demo, tendremos principalmente dos elementos diferentes a importar: importar el diseño general e importar el diseño de la página de inicio.

Vamos a ver en este apartado como importar el diseño general de la demo (diseño general del tema), que haremos desde el editor de temas tipo backend.

Para ello iremos en el panel de administración de Prestashop a: “MEJORAS > Diseño > IqitThemeEditor – Backoffice”

Ahora, en el menú lateral seleccionaremos la pestaña: “Import/Export configuration”.

En el apartado “Import Configuration”, haz clic en el botón “Examinar” y selecciona dentro de la carpeta correspondiente al diseño que quieras utilizar (del archivo comprimido que nos descargamos en el apartado 3) el archivo de configuración general de la demo, que tendrá un nombre del estilo a este: “iqitthemeeditor_config.json”.

Después, haz clic en el botón “Import”.

 

importar diseño de demo header y footer plantilla warehouse

Importar diseño general de demo

 

formato del archivo a importar para demo warehouse

Formato del tipo de archivo a importar

 

Aprende a configurar los gastos de envío con Prestashop: transportistas Prestashop

 

 

5.- Importar diseño de home page o página de inicio

 

Ya hemos importado la configuración general del tema o plantilla correspondiente a la demo que queremos cargar en nuestro Prestashop. Esto influye principalmente sobre el diseño del header y footer.

Ahora vamos a importar el contenido de la home o página de inicio de la demo.

En principio, lo lógico sería importar la home correspondiente a la misma demo que utilizamos para importar la configuración general del tema. Pero, en realidad podemos importar la home de otra demo diferente.

 

Para importar la home de una de las demos iremos a: “MEJORAS > Diseño > Iqit Elementor – Page builder”.

A continuación, haremos clic en el botón “Modificar” de la página en la cual queramos cargar el diseño de la demo.

A continuación, haremos clic en el botón “Edit with Elementor – Visual Page builder”.

 

 

5.1.- Borrar contenido de la página

 

Lo primero que haremos será borrar el contenido actual de la página. Para ello haremos clic en el “icono de tres rayas” que aparece en la parte superior izquierda.

Se desplegarán varias opciones. Haremos clic en “Delete all content” y luego en “OK”

 

eliminar contenido de la home antes de importar una nueva demo de plantilla warehouse

Borrar contenido de la página antes de importar nuevo diseño

 

 

5.2.- Cargar demo de la página

 

Ahora haremos clic en el icono formado por nueve pequeños cuadrados, que aparece en la parte superior.

A continuación, haremos clic en el “icono en forma de carpeta” que aparece en la parte inferior de la barra lateral, y en el desplegable seleccionaremos: “Templates Library”

 

cargar demo plantilla warehouse, seleccionar demo

Cargar plantilla o demo en la home con plantilla warehouse prestashop

 

En la ventana emergente que nos aparece haremos clic en el icono con una flecha hacia arriba, que aparece en la parte superior derecha.

 

subir diseño de ejemplo en página con plantilla warehouse Prestashop

Subir demo para página con plantilla warehouse

 

Después haz clic en donde dice: “Select template .json file” y se abrirá una ventana para que selecciones un archivo de demo de home.

El tipo de archivo que has de buscar tendrá un nombre como este: “iqitelementor_template.json”

 

seleccionar json de la demo a subir en página con warehouse

Seleccionar archivo de demo a subir

 

A continuación, haz clic en el botón: “LOAD”.

Ya está subido el diseño a la biblioteca. Ahora hay que insertarlo en la página.

Te aparecerá una barra horizontal con el diseño que hayas elegido. Pon el ratón sobre el rectángulo y haz clic en el botón: “INSERT”.

 

insertar demo en home warehouse

Insertar demo cargada en la biblioteca de la plantilla warehouse

 

Ya tienes insertada una demo en la home.

A continuación, guarda con el botón “SAVE”.

 

Ve a la home y:

  • Refresca navegador: CTRL + F5 para refrescar página y volver a cargar archivos CSS
  • Borrar caché del navegador: para que se vuelva a cargar la página

 

 

6.- Importar el diseño de página también para otros idiomas que tengamos activos

 

Para utilizar el diseño o demo que hemos importado para la página de inicio de un idioma, en otros idiomas que tengamos activos en Prestashop haremos lo siguiente:

i.- Seleccionar idioma: en la parte superior de la barra lateral derecha verás un selector con nombre: “Editing”.

Haz clic en el selector y elige el idioma al que quieres añadir la demo.

 

ii.- Borrar diseño: a continuación, haz clic en el icono de tres rayas horizontales que aparece en la parte superior y selecciona: “Delete all content” y “OK”.

 

iii.- Importar diseño de otro idioma: ahora haz clic en el icono con forma de dos páginas que aparece a la derecha del selector Editing.

En el desplegable selecciona el idioma en el que estableciste la demo en el apartado anterior, y luego haz clic en “OK”

 

No olvides hacer clic en el botón “SAVE” para guardar los cambios.

 

 

Bloguer especializado en Woocommerce / WordPress, Divi y Prestashop. Me dedico a impatir formación y a la creación de páginas web, blogs y tiendas online.Mi otro blog, especializado en WordPress y Divi: horizonweb.es
Compártelo ya!!

Uso de cookies

Utilizamos cookies propias y de terceros para mejorar nuestros servicios y su experiencia de navegación. Si continua navegando, consideramos que acepta su uso. Puede cambiar la configuración u obtener más información Aquí,plugin cookies

ACEPTAR
Aviso de cookies