Después de muchas horas de trabajo y algunos momentos de desesperación, he conseguido pasar de la versión 1.4.5.1 de PrestaShop a la 1.6.1.0. La verdad es que, después de todo, ha resultado más laborioso que difícil. Como puedes imaginar, la ayuda de la comunidad existente alrededor de esta plataforma ha resultado vital. Con un poco de paciencia, he podido encontrar solución a todos los problemas que han ido surgiendo.

Voy a hacer un resumen de todos los pasos que he seguido, por si a alguien le sirve de ayuda.

1. Instalar Xampp en un ordenador

Realizaremos la actualización de la base de datos en un servidor local, así nuestra tienda seguirá funcionando normalmente mientras preparamos la migración. En este servidor, crearemos una base de datos con phpMyAdmin. Puedes encontrar fácilmente multitud de tutoriales e información al respecto.

2. Instalar PrestaShop en el servidor local

Descargar PrestaShop 1.4.5.1, y crear una carpeta donde copiaremos los archivos descargados. Seguir las instrucciones para instalar una nueva tienda online. Seleccionaremos la opción de instalación más sencilla, con el menor número de módulos posible.

3. Exportar la base de datos

Exportaremos la base de datos que utiliza la versión 1.4.5.1. Dejaremos las opciones como aparecen por defecto, y marcaremos “Agregar sentencia DROP TABLE / VIEW / PROCEDURE / FUNCTION / EVENT”.

Se puede seleccionar algún tipo de compresión si nuestra base de datos es muy grande.

Desde el back office de nuestra tienda: Herramientas > Traducciones, importaremos todas las traducciones.

Descargar, utilizando un programa de FTP, la carpetas:

  • upload
  • download
  • img

Es posible que hayamos realizado cambios importantes en nuestro tema, mails, y módulos. Por desgracia, al finalizar la actualización deberemos utilizar un nuevo tema compatible con la versión 1.6. Lo mismo ocurre con la mayoría de los módulos.

En cuanto a los mails, no se si funcionarán los de la versión 1.4 en la versión 1.6. Pero vale la pena utilizar los correos de la versión 1.6, que son responsive (se adaptan a diferentes tamaños de pantalla), y adaptarlos a nuestras necesidades.

4. Importar la base de datos al servidor local

En la tabla ps_configuration, deberemos buscar PS_SHOP_DOMAIN y PS_SHOP_DOMAIN_SSL, y sustituir los valores existentes de nuestro dominio por localhost.

Al migrar la base de datos, la cookie que controla el acceso del administrador nos hace imposible la entrada al back-office. Deberemos abrir el fichero config/settings.inc.php de nuestra instalación local y copiar la clave correspondiente al valor ‘_COOKIE_KEY_’. Es necesario realizar una consulta SQL utilizando el valor de la cookie:
UPDATE ps_employee SET passwd=md5(“tPtVXM9ETCyh1a5bF6dgTad91ZfGMKNrMFuLmyND3r7jPKm3qa0QnCDvcontraseña") WHERE email="mail@mail.es"

Hay más información sobre este paso en estos enlaces:

Después, en Herramientas > Generadores, deberemos volver a generar el archivo .htaccess para visualizar las fotos.

5. Actualizar a PrestaShop 1.4.11.0

Antes de nada, es necesario actualizar el módulo 1-Click Upgrade, yo utilicé la versión 1.6.4.

Después, hay que desactivar la tienda y, dentro del módulo, elegir el modo experto.

Seleccionamos actualizar desde directorio local, y cargar el tema por defecto de la nueva versión. Deberemos copiar los archivos correspondientes de PrestaShop en el directorio que se nos indica. Los archivos de versiones antiguas de PrestaShop se pueden descargar aquí.

El último paso antes de actualizar es cambiar los permisos a “Leer y escribir” de la carpeta raíz de tu sitio y todo su contenido.

6. Actualizar a PrestaShop 1.5.0.17

Seguiremos el mismo proceso que para actualizar a la versión 1.4.11.0

Al terminar la actualización, no aparecían las imágenes. Tuve que mover las imágenes al nuevo sistema. Se puede realizar en Preferencias > Imágenes.

7. Actualizar a PrestaShop 1.6.0.14

Al actualizar a PrestaShop 1.6.0.4, siguiendo el mismo procedimiento que en los pasos 5 y 6, de nuevo desaparecen las imágenes de nuestros productos. Esto es debido a la existencia de tamaños de imágenes duplicados. Es necesario borrar todos los que no pertenecen a la versión 1.6 de PrestaShop, que son los siguientes:

  • cart_default
  • small_default
  • medium_default
  • home_default
  • large_default
  • thickbox_default
  • category_default
  • scene_default
  • m_scene_default

Después de eliminar los tamaños sobrantes, deberemos regenerar las imágenes.En este post puedes encontrar más información.

8. Actualizar a Prestashop 1.6.1.0

Siguiendo una vez más el proceso de los pasos anteriores, actualizamos a la versión 1.6.1.0. Una vez que esta actualización ha finalizado, es necesario instalar un tema compatible con esta versión. Como he comentado anteriormente, el que utilizabamos con la versión 1.4 no funcionará correctamente.

También será necesario renovar la mayoría de nuestros módulos por nuevas versiones u otros diferentes que realicen la misma función. Es el momento de trabajar el diseño y probar nuevas funcionalidades, para dejar todo a punto y que la subida a producción no nos lleve mucho tiempo.

9. Instalar PrestaShop 1.6.1.0 en nuestro servidor remoto

Durante los pasos 9 y 10 nuestra tienda dejará de funcionar, es necesario actuar lo más rápido posible. Si no dispones de una muy buena conexión, es aconsejable subir todos los archivos que vayas a necesitar a una carpeta del servidor. Cambiar de localización los archivos es mucho más rápido que subirlos.

10. Copiar la base de datos local en el servidor remoto

Utilizando phpMyAdmin importaremos la base de datos actualizada desde el servidor local de nuestro ordenador. También será necesario copiar la carpeta que contiene el nuevo tema, así como las carpetas de módulos, imágenes, upload, download, etc.

Espero que seguir estos pasos te lleven a actualizar tu PrestaShop sin errores. Antes de empezar, te aconsejo que eches un vistazo a este post de Flat 101, con los errores más típicos de una migración.

Carrito oculto en PrestaShop

Quizás porque situar el carrito en una columna lateral ya no se estila, me ha costado mucho encontrar información acerca de cómo mantenerlo plegado cuando no hay productos añadidos. Así que comparto la solución que he utilizado (para la versión 1.6.1.0).

En themes/my-theme/modules/blockcart/blockcart.tpl añadimos la clase “empty_cart” al div que contiene el carrito:
<div class="shopping_cart {if $cart_qties == 0}empty_cart{/if}">

Añadimos a la hoja de estilos del módulo, themes/my-theme/css/modules/blockcart/blockcart.css, esta línea:
#left_column .empty_cart .cart_block .cart_block_list {display:none;}

En themes/my-theme/js/modules/blockcart/ajax-cart.js es necesario añadir una línea de código para eliminar la clase “empty_cart” cuando añadimos un producto. De esta manera, el carrito se mantendrá desplegado cuando contenga algún producto:
if ($('.cart_block:first dl.products').length == 0)
{
$('.cart_block_no_products').before('<dl class="products"></dl>');
$('.cart_block_no_products').hide();
$( "#left_column .shopping_cart" ).removeClass( "empty_cart" );
}

First do it, then do it right, then do it better.

Addy Osmani

El mal marketing cuesta vidas

El mal marketing cuesta vidas

Diseñar en la cuerda floja from EXPERIENCE FIGHTERS on Vimeo.

“La mejor manera de entender el funcionamiento del mundo no es a través de las explicaciones racionales, que ligan causas con efectos, sino a través de las historias. Las historias nos hacen comprender sin necesidad de racionalizar. Comprendemos, y punto. Es la grandeza del storytelling, de la narratividad.”

Daniel Solana

Utilizar textos alternativos de las imágenes de un email

El mismo email con imágenes bloqueadas y sin imágenes bloquedadas.

Dado que muchos de los clientes de email bloquean por defecto las imágenes de un envío, añadir estilos CSS a los textos alternativos de nuestros emails nos puede ayudar a mejorar los resultados de una campaña. Podemos definir composiciones que transmitan de forma eficaz nuestro mensaje sin necesidad de imágenes. Para ello, necesitaremos jugar con los textos de nuestro email, los atributos de las tablas y los estilos en los textos alternativos.

Este es un ejemplo de cómo aplicar CSS al texto alternativo de una imagen:
<img src=”logo.jpg” width=”400″ height=”149″ alt=”Nombre de la empresa” style=”font-family: Arial; color: #000; font-size: 30px;”>

A la hora de sacar el máximo partido de las visualizaciones con imágenes bloqueadas, es también interesante que las llamadas a la acción no necesiten de imágenes para ser las protagonistas de nuestros mails. Para ello, utilizaremos bulletproof buttons. Cómo crear uno de estos botones está muy bien explicado aquí y aquí.

No todos los clientes de email muestran estos estilos correctamente, en esta guía de Litmus se dan todos los detalles. También en Litmus hay un post muy detallado sobre este tema y una recopilación de buenos ejemplos en su Pinterest.

¿Quieres ver más ejemplos?  Suscríbete a la newsletter de Threadless.com. Hacen muy buen uso de este recurso.

Xavier Colomés: “Online Marketing Sophistication” en #cw13

Buen-diseno
via Luis Maram

Agile y Diseño: ¿son incompatibles?