Direfentes, autor en DIREFENTES

¿Cuál es el GTIN en los productos de PrestaShop?

En muchas ocasiones, cuando necesitamos exportar un feed con todos los productos de nuestra tienda online, se nos pide que se exporte el GTIN del producto. En cantidad de ocasiones nos habéis preguntado que dónde está ese campo en el backoffice de vuestro PrestaShop ya que lo necesitáis rellenar para Google Merchant Center y sus campañas de Google Shopping o para sincronizar vuestro catálogo con Instagram o Facebook.

¿Dónde está GTIN del producto en vuestro PrestaShop?

El GTIN es un identificador único de producto a nivel mundial. Este número podrás encontrarlo normalmente junto con el código de barras. Aquí Google nos explica con detalle todo lo que necesitas saber sobre este atributo [gtin] (por si necesitas profundizar en el tema).

En PrestaShop vamos a encontrar el campo para rellenar este número bajo el nombre de «EAN-13 o código de barra JAN», dentro de la pestaña «opciones» de vuestro producto.

¿Dónde está GTIN del productos con combinaciones?

En muchas ocasiones, nos encontramos con tiendas cuyos proveedores facilitan un EAN13 por cada combinación de producto. En este caso, el producto en sí no lo tendrá, pero sí cada combinación que exista. Por tanto, debemos insertarlo en cada combinación de la siguiente forma:

Entramos en el apartado de combinaciones y editamos la combinación en la que queramos insertar el EAN-13

Editar combinaciones producto PrestaShop

Dentro de la combinación, podemos buscar el campo de «EAN-13 o código de barra JAN».

Insetar GTIN EAN13 Producto con Combinaciones

Sencillo, ¿verdad? Solo es cuestión de saber dónde está el campo en el que tenemos que insertar nuestro EAN13.

Nosotras nos encargamos de generar feed de productos para hacer campañas en Google Shopping o redes sociales. Si nos necesitas, puedes echar un vistazo a nuestro servicio de Gestión de Google Shopping o llámanos y cuéntanos qué necesitas.

¿Cómo redactar las categorías de Prestashop?

Seguro que has escuchado hablar de posicionamiento SEO en alguna ocasión, de que es muy importante que lo trabajes en tu tienda online si quieres ascender en los resultados de búsqueda de Google y bla bla bla… Todo eso es verdad. Es fundamental optimizar la tienda todo lo posible para que Google te vea con buenos ojos, te considere relevante y te ascienda hasta lo más alto.

Son cientas las mejoras que se pueden hacer en un Prestashop con el fin de optimizarlo, pero las que vamos a tratar en este artículo son aquellas relacionadas con las categorías. A veces, cuando la competencia entre tiendas del mismo sector es muy alta, son los detalles como estos los que marcan la diferencia. Por eso vamos a tratar de ayudarte todo lo posible en cuanto a redacción y organización de categorías se refiere.

Continuar leyendo «¿Cómo redactar las categorías de Prestashop?»

¿Qué tener en cuenta a la hora de subir una imagen a tu web?

A veces nos ha pasado que entregamos proyectos y el cliente tiene la necesidad de cambiar alguna de las imágenes de la web . Lo que ocurre en muchas ocasiones es que, al modificarla, por desconocimiento, pereza o qué se yo, no se tienen en cuenta parámetros importantes que pueden afectar a la velocidad o a la estética del sitio. Ni tamaño, ni peso, ni resolución, ni proporciones. Es lo que ocurre cuando no se tienen muchos conocimientos del tema, algo de lo más lógico si te dedicas a vender calcetines y acabas de adentrarte en el maravilloso mundo online.

Por eso, para ayudar un poco, hemos preparado este post, para que veas que el tamaño sí que importa cuando hablamos de web.

¿Qué hay que tener en cuenta antes de subir una imagen a nuestra web?

Dimensión de la imagen

Este punto es muy importante. Hemos visto que en muchos casos se compran imágenes de muy buena calidad a tamaños tan grandiosos que incluso nos darían para hacer una lona que tape todo un bloque de edificios. Si quieres comprarla a ese tamaño y guardarla en tu disco duro, no hay problema, puede servirte para otros usos y nadie sufrirá las consecuencias de tanta cantidad de píxeles en un mismo archivo.

Sin embargo, si la tienes que publicar en unos de tus post o subirla a alguna de las páginas de tu web, lo mejor es que investigues qué dimensiones necesitas tener como referencia. Ten en cuenta que si tenemos un bloque de 600×500 píxeles no servirá de nada que subamos una imágenes de 1.200x 1.000 píxeles. Lo único que ocurrirá es que, cuando un usuario entre en tu web, tendrá que esperar un poco más a que se carguen todos los elementos que hay en ella corriendo el riesgo de que, como son muy pesados, se aburra y se marche.

Por eso, si el ancho de tu bloque o tus productos no es superior a 600 píxeles, de nada te servirá subir imágenes de un tamaño mayor.

Y ahora te preguntarás….

¿Cómo saber cuánto mide la imagen que tengo que cambiar? Formas de saberlo hay muchas.

Puedes guardarte la imagen en tu ordenador haciendo clic en ella con el botón derecho del ratón y pulsando «Guardar imagen como…» Luego puedes ver la información del archivo, la cual te mostrará las dimensiones, el peso, etc. También puedes abrirlo con Photoshop y ver sus dimensiones (Imagen > Tamaño de imagen).
También puedes medirla con una extensión que puedes añadir a tu navegador. Se trata de una regla de píxeles, Page Ruler. Cuando vayas a medir, recuerda ampliar la ventana del navegador todo lo posible ya que si está reducida, puede que la imagen esté adaptada al tamaño de la ventana y se esté visualizando más pequeña. Para utilizar esta forma de medir debemos tener ciertos conocimientos de maquetación ya que hay determinadas páginas web que están diseñadas con ancho completo y las dimensiones de la imagen pueden variar según el tamaño de la ventana del navegador.
Otra opción válida es tener instalada la extensión de navegador Image Size Info. Nos permitirá conocer tanto las dimensiones como el peso con solo hacer clic con el botón derecho del ratón sobre cualquier imagen de la web.

Resolución

La resolución en pantalla es de 72 píxeles/pulgada. Es cierto que para imprimir se utilizan más altas (normalmente 300 ppp), pero en web lo recomendable es usar 72 ppp. Esto es así porque, a diferencia del papel, en la pantalla no podemos controlar la densidad o proximidad de los píxeles.

Peso

Hay que ser muy precavido con esto y revisar siempre que nuestras imágenes estén en forma. El peso de ellas tiene que ver con los dos puntos anteriores: si subimos una imagen de grandes dimensiones y con una resolución muy alta, el peso del archivo será mucho mayor que si optimizamos estos dos parámetros. Pero además, hay otras informaciones como los metadatos, perfil de color, etc. que se almacenan junto a nuestras fotografías sumando Kilobytes y haciendo al archivo aún más pesado.

Para dejar nuestras imágenes estilizadas y eliminar toda esa información adicional, te recomendamos un par de herramientas. Hay muchas más. Si quieres, busca en Google «Herramientas para optimizar imágenes» y te saldrán cientos de artículos de otros blog con recopilaciones de las que ellos consideran mejores.

Por supuesto, también te sirve Photoshop. Si elegimos «Guardar para web…» tendremos diferentes opciones de configuración. Asegúrate de que la imagen que generes se vea bien, que no esté pixelada, que no sufra pérdida de calidad y sobre todo, que pese poco. El tamaño total de la página debe ser de menos de 1MB así que, ¡imágenes ligeritas de peso!

Guardar para web Photoshop

Proporción

Esto es algo que molesta mucho a la vista de los diseñadores. También a la del resto de mortales, pero a ellos especialmente (o eso dicen). No hay que olvidarse de que si subimos una imagen a nuestra web con una proporción diferente a la que tenía inicialmente, luego la maquetación no cuadra. La tienda online que era bonita cuando te la entregaron se empieza a convertir en un pequeño mercaillo de imágenes bailongas. No es eso lo que queremos.

Por ejemplo, si en una galería de fotos de nuestra web teníamos varias imágenes en una misma fila de 500×500 píxeles, es decir, cuadradas; no podemos cambiar una de ellas por una imagen que no mantenga esa proporción ya que ocurrirían cosas como estas:

Imagen desmaquetada por proporción

Espacio en blanco por arriba y por abajo. Poco estético a menos que tenga alguna intención, ¿no?

Otro tema similar que nos encaja para tratarlo brevemente en este punto es el de las imágenes alargadas o achatadas. Recordamos que siempre que queramos escalar una imagen, debemos hacerlo manteniendo pulsada la tecla de «mayúscula» o «SHIFT» de nuestro teclado o bien marcando «restringir proporciones» en Photoshop.

Escalar imágenes proporcionalmente

Gif de Chris Phillips

Nombre del archivo

No queríamos pasar por alto este apunte. Los nombre de los archivos que subimos a nuestra web indican a Google el contenido de los mismos. Por eso, no será igual tener una imagen con el nombre «Sin-título.jpg» que otra con el nombre «anillo-de-plata.jpg». Evidentemente es mucho más descriptivo el segundo.

Además, para no tener problemas con tu servidor, recuerda:

Para separar palabras, utiliza guiones. Ejemplo: cesta-de-frutas.jpg
No utilices tildes, la letra Ñ o caracteres especiales como !, @, #, $, %, ^, &, *, :, ‘.
Evita los nombres demasiado largos.

¿Cómo puedo reemplazar una imagen de la web forma sencilla?

Antes de decirte cómo hacerlo, debemos entender cómo funcionan la mayoría de gestores de contenido como Prestashop o WordPress a la hora de subir imágenes. Muchas veces, tanto en las tiendas online como en las páginas web, las imágenes que subimos generan unas miniaturas que la propia plataforma utiliza luego en algunas ubicaciones de la plantilla. Por eso, es importante que si lo que queremos hacer es cambiar una imagen que ya está subida, localicemos la «imagen madre», aquella a partir de la cual se generan todas las hijitas más pequeñas. Debemos asegurarnos de que la que modificamos es esa.

Si no tienes demasiada experiencia en el mundo web igual todo esto no te parece tan sencillo, pero bueno, nuestro fin es enseñarte a hacerlo sin que tengas que depender de nadie. Por eso, para no equivocarte a la hora de modificar una imagen de tu sitio, te recomendamos hacer algo tan sencillo como, con el cursor sobre la imagen que quieres reemplazar, haz clic con el botón derecho en «guardar imagen» para almacenarla en tu ordenador. Luego, ábrela con Photoshop o cualquier otro programa de edición y diseña sobre ella. De esta forma te aseguras de que estás tomando las dimensiones y la resolución correcta.

Para el tema del peso, no olvides «guardar para web» desde Photoshop o limpiar la imagen antes de subirla con alguna de las herramientas que os hemos facilitado cuando hemos hablado de la optimización del peso de los archivos.

¿Por qué debo optimizar las imágenes de mi web?

Por si todo esto que te hemos contado te da pereza digital, vamos a darte algunas razones por las que deberías obligarte a cuidar las imágenes de tu web.

Para mejorar la velocidad de carga: El porcentaje de usuarios que ven tu web en móviles cada vez es más alto. Por esa razón, y porque en Internet la paciencia no existe, tienes que reducir el peso de tus imágenes. Mientras más ligeras sean, menos tiempo tardará el móvil o el ordenador de turno en descargarlas para mostrarlas al usuario. Si el tiempo de carga es muy alto, probablemente se marche a otro lugar más rápido que ofrezca servicios o productos similares a los que está buscando. Haz la prueba contigo mismo, ¿cuánto estarías dispuesto a esperar para que se cargue una página?
Para que la web siga siendo como era al principio: Te entregan el proyecto, todo en orden, bien colocado, alineado, fotos chulas, velocidad de carga aceptable… De nada sirve todo esto si luego no seguimos el camino que nos marcaron las personas que se encargaron de desarrollar nuestro proyecto. Recuerda aplicar todo lo relativo a optimización de imágenes y cuida el diseño de los banners y slide.

Con esto que te hemos contado ya tienes una base para que, a partir de ahora, tus imágenes sean lo más light posible. Ten en mente a tus usuarios, tienen poco tiempo y no quieren perderlo.

–

Foto de ian dooley elegida con cariño en Unsplash.

¿Qué es el id_product_attribute de Prestashop 1.7?

¿Te está mareando ese numerito nuevo de la URL de los productos de tu tienda online Prestashop 1.7?

Con el cambio de versión de Prestashop hay quien se ha encontrado con un pequeño inconveniente en la URL de los productos con combinaciones, el :id_product_attribute. En esta entrada vamos a explicar qué es exactamente y qué quebraderos de cabeza puede darte si tienes en mente cambiar de versión de Prestashop o simplemente trabajar el posicionamiento SEO.

La URL de los productos en Prestashop hasta ahora

Hasta el cambio de versión de Prestashop a 1.7, la URL de los productos (independientemente de si tuvieran combinaciones de atributo o no) seguían el siguiente patrón:

www.tudominio.com/categoria/2-nombre-producto.html

O lo que es lo mismo:

{category:/}{id}-{rewrite}.html

Ese «2»de la URL de ejemplo es el ID del producto, el número que lo identifica dentro de tu tienda online. Evidentemente varia en función del producto que estemos visualizando (cada producto tiene el suyo) y es muy util para las redirecciones 301 cuando, por ejemplo, modificamos el nombre de un producto y su URL. Como decíamos, hasta la versión 1.6 de Prestashop, si teníamos una blusa con diferentes tallas y colores, la URL del producto era la misma independientemente de la combinación que eligiera el usuario. Es decir, daba igual si cogías la talla S en blanca que la XL en negra, la URL de la ficha del producto siempre era: www.tudominio.com/moda/2-blusa.html.

Pero ya, nada es igual.

El id_product_attribute en la URL de los productos de Prestashop

¿Qué ha ocurrido con el cambio de versión de Prestashop a 1.7? Pues que todo lo anterior ya no es exactamente así.

Ahora, la URL de los productos con combinaciones de atributos ya no siguen la misma estructura que hemos explicado en el punto anterior. La novedad es que incluye otro número más, el ID de la combinación de atributos, el id_product_attribute. Con esta nueva norma, para una blusa que existe en dos colores (blanca y negra) y en dos tallas (M y L) tenemos las siguientes URLs de producto:

www.tudominio.com/moda/2-blusa.html. [Genérica del producto]

www.tudominio.com/moda/2-2-blusa.html. [Blanca M]

www.tudominio.com/moda/2-3-blusa.html. [Blanca L]

www.tudominio.com/moda/2-4-blusa.html. [Negra M]

www.tudominio.com/moda/2-5-blusa.html. [Negra L]

La primera URL podríamos decir que es la que había en la versión de Prestashop 1.6. Es la que manda sobre el resto, la canonical. De hecho, si nos vamos a ver el código de cualquiera de las otras URLs que llevan el ID de la combinación, podremos observar como apunta a ella.

<link rel="canonical" href="http://www.tudominio.com/moda/2-blusa.html">

El resto de URLs, las que tienen marcado un número en rojo, son las que a más de uno le traen por la calle de la amargura. Ese número es el id_product_attribute del que hemos hablado, el ID de la combinación de atributos del producto, el protagonista de este post.

Entonces, ¿qué hay que saber sobre el id_product_attribute?

Que en Prestashop 1.7 cada producto tendrá tantas URLs como combinaciones de atributos tenga, con sus ventajas y sus inconvenientes, pero así es.
Que no podremos quitarlo de forma sencilla desde el backoffice de la tienda ya que, si lo hacemos, nos saltará un error que nos viene a decir que Prestashop no puede vivir si este parámetro: Keyword «{id_product_attribute}» required for route «product_rule» (rule: «{category:/}{id}-{rewrite}{-:ean13}.html»)

Nota para volver a la configuración inicial si la has cambiado:

Os dejamos el formato del enlace de productos original por si lo habíais cambiado o borrado y queréis volver a la configuración por defecto:

{category:/}{id}{-:id_product_attribute}-{rewrite}{-:ean13}.html

id product attribute prestashop 1.7

Cómo eliminar el id_product_attribute de la URL de productos

Si por cualquier motivo consideras que este nuevo ID no hace más que estorbar en tus URLs, existe un módulo en Addons que puede ayudarte a limpiarlas sin modificar el núcleo de Prestashop.

Os dejamos el enlace:

Módulo SEO Performance (limpiador de URL)

Nada más que contarte por el momento. Iremos actualizando esta entrada conforme vayamos conociendo más casos y experiencias con este nuevo cambio. ¿Cuál ha sido tu impresión? ¿crees que este cambio es una ventaja o un inconveniente para las tiendas online Prestashop?

–

Foto de Kaley Dykstra elegida con cariño en Unsplash.

Subir vídeos, mapas e imágenes responsive a Prestashop

Si tienes una tienda online Prestashop, puede que te encuentres con un pequeño inconveniente con el responsive de la web a la hora de subir vídeos de Youtube, incrustar mapas de Google Maps o imágenes en el editor HTML de las descripciones de tus productos. Probablemente, te ocurra algo como esto:

Iframe Google Maps Responsive Prestashop

Iframe Youtube Responsive Prestashop

El hecho de que el mapa o el vídeo se desborde de la caja que debería contenerlos, aparte de ser estéticamente feo, no gustará ni a tus usuarios ni a Google ya que en la versión móvil el tema empeora. Como el elemento se sale del bloque blanco, en algunos casos aparece una barra para hacer scroll horizontal, nada usable y que hace que se desmaquete la ficha de producto. Por tanto, para solucionarlo, lo primero que debemos saber es porqué ocurre.

Tomando como ejemplo el vídeo de Youtube y si observamos el código que copiamos para insertarlo en el editor HTML de nuestro Prestashop, podemos ver varias cosas: que es un iframe y que le estamos indicando un ancho y un alto al vídeo (width=»560″ height=»315″).

<iframe width="560" height="315" src="https://www.youtube.com/embed/-R5R0Us0P4w" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe>

Es por eso, que si Youtube nos ha puesto automáticamente un ancho de 560 píxeles pero la web la estamos viendo en un móvil de un ancho inferior al que se ha definido, el vídeo se desborda de la caja que lo contiene. Como solución lógica podríamos decir: «Le ponemos un ancho más pequeñito y solucionado». Pero no, no nos serviría puesto que cuando veamos la página desde una pantalla de ordenador, el vídeo va a ser de un tamaño minúsculo. Lo ideal es que se adapte al dispositivo, que sea responsive. Entonces, ¿qué hay que hacer?

¿Cómo subir los vídeos de Youtube o mapas de Google (iframe) a Prestashop?

1. Cambiar un par de detalles de la configuración de Prestashop

En primer lugar, hay que asumir cierta rebeldía ya que tenemos que irnos a la configuración de nuestra tienda online para activar y desactivar un par de parámetros que Prestashop nos recomienda dejar justo al contrario de como vamos a ponerlo.

[En Prestashop 1.7] Parámetros de la tienda > Configuración

Permitir Iframe Prestashop

Marca «Permitir iframes en los campos HTML» -> SÍ (ya que tanto los vídeos de Youtube como los mapas de Google Maps lo son)

Marca «Utilizar la librería HTMLPurifier» -> NO (para que Prestashop nos deje insertar código adicional en su editor de textos).

2. Añadir código al iframe para que sea responsive

El siguiente paso es sencillo. Se trata de añadir la siguiente línea de código al que hemos copiado de Youtube o Google Maps (marcado en rojo a continuación).

<iframe width="560" height="315" style="width: 100%; height: auto; min-height: 315px;" src="https://www.youtube.com/embed/-R5R0Us0P4w" frameborder="0" gesture="media" allow="encrypted-media" allowfullscreen></iframe>

width: 100% -> Indica que el ancho será completo, ocupará todo la caja que lo contenga.

height: auto -> Indica que la altura se ajustará en función del ancho.

min-height: 315px -> Establece una altura mínima. Podemos cambiarla en función de nuestras necesidades.

Al añadir esta línea de código, la información sobre la anchura del 100% del iframe va a prevalecer sobre los 560 píxeles de los que hablábamos al principio. Ahora sí, problema solucionado:

Responsive Prestashop Iframe Youtube

¿Y cómo subimos una imagen a Prestashop para que sea responsive?

El proceso es más o menos similar al anterior. En primer lugar, tenemos que comprobar que el punto uno esté configurado como hemos comentado en el ejemplo anterior.

Luego, subiremos la imagen a Prestashop como lo hacemos normalmente. Puede que la plantilla venga preparada correctamente y no sea necesario hacer nada para que el responsive funcione bien. Sin embargo, hay casos en los que la imagen, al igual que ocurre con los iframe, se desborda de la caja que lo contiene. En esos casos, bastará con añadir la siguiente línea de código a la imagen que hayamos subido (marcado en rojo a continuación).

<img src="http://dummy17.loadingproject.es/img/cms/tu-imagen.jpg" style="height: auto; width: 100%;"/>

Esto es todo. Esperamos que haya servido de ayuda. Y ya sabes, frase de influencer, «si te ha gustado puedes comentarnos o compartir el post en redes sociales».

—

Foto de Ilya Pavlov elegida con cariño en Unsplash y mockup de Freepik.

Cómo configurar el envío gratis en Prestashop

Cantidad de estudios han demostrado que el envío gratis le gusta a la gente. ¿Para que negarlo? Nos encanta comprar online porque es muy cómodo, pero a veces nos molesta tener que pagar más. ¿Egoísmo? Puede ser. Pero lo cierto es que ocurre.

Un día incluso hicimos nuestro mini-esudio de mercado (sin garantías) en Facebook. Preguntamos a nuestros seguidores si en una tienda online preferían la entrega en un día o el envío gratis. La gran mayoría apostó porque lo mejor era no pagar ni un céntimo más de lo que mostraba la web. Sabemos que estos datos no son extrapolables al resto de la población, sin embargo, hay que reconocer que el envío gratis se lleva.

Nosotros no seremos los que te digamos si tienes que ofrecer envío gratis a tus clientes o no. Para eso es importante que sepas cuáles son tus números, tus costes, tus márgenes y con qué reglas puedes jugar. Es cuestión de hacer cuentas y ver el camino que nos queremos marcar.

Lo que sí parece bastante claro es que hay cantidad de ventajas al añadir esta funcionalidad. La palabra gratis gusta, por eso muchos usuarios se esforzarán en añadir algunos productos más al carrito para no tener que pagar por el envío. Además, en muchas tiendas online existe la incertidumbre de no saber cuánto habrá que pagar por el transporte hasta que no te registras, motivo por el que muchos usuarios abandonan sus carritos. El simple hecho de saber que no se le va a cobrar a partir de cierta cantidad, hará que esos abandonos se reduzcan.

Por tanto, vamos a explicar cómo configurar el envío gratis en Prestashop (versión 1.6):

Gastos de envío gratis en Prestashop a partir de un importe para todos los clientes

Es la forma sencilla de configurar el envío gratis en tu tienda. Dentro de la administración de nuestra tienda, nos vamos a Transporte > Preferencias. En el primer bloque llamado «Mantenimiento» encontramos dos campos en los que podemos incluir una cantidad. Por ejemplo, en el caso de que queramos establecer envío gratis a partir de 50 euros, pondremos importe en el campo «Envío gratuito a partir de __ €».

Activar envío gratis en Prestashop para todos los clientes

De esta forma, cuando un usuario añada productos a su carrito por un valor superior a 50 euros, los gastos de envío no se le sumarán. Hay que tener en cuenta en esta opción que Prestashop ignorará el transportista que haya seleccionado y la ciudad en la que vive la persona. Es decir, dará igual que viva en Canarias y que haya elegido un transportista que entrega en 24 horas. Igualmente, no se le cobrarán los gastos de envío.

Gastos de envío gratis en Prestashop según el importe y la zona de envío

Esta es la opción más común ya que lo habitual es que los gastos de envío sean diferentes según la zona a la que tengamos que mandar nuestros productos. En España ocurre principalmente con las islas, en las que el precio del envío desde la península es más elevado.

Por ese motivo, o porque tengamos una política de envío gratis diferente según el lugar desde el que nos compren, existe una herramienta en Prestashop que va a ayudarnos a combinar todas las estrategias.

Para ello, desde la administración de nuestra tienda, nos vamos a Transporte > Transportistas. Como puede verse en la imagen, lo primero es marcar «De acuerdo con el precio total» y a continuación tenemos que establecer son los diferentes rangos de importes que vamos a tener. En el caso del ejemplo que mostramos en la imagen, hemos marcado:

De 0€ a 50€
De 50€ a 100€
De 100€ a 5.000€

Luego, seleccionamos las zonas que va a tener definidas ese transportista y vamos especificando el gasto de envío que hemos decidido para cada área.

En nuestro caso, tenemos un primer tramo que va de 0€ a 50€ donde hemos fijado un importe para cada zona: 8€ para las islas, 4€ para nacional y 3€ para los pedidos que se repartan en la provincia en la que tenemos nuestro almacén.

Luego, en el rango que va de 50€ a 100€ ya ofrecemos envío gratis en península. Sin embargo, en las islas sigue costando 5€ el envío del paquete.

Por último, en el tramos de 100€ a 5.000€, todos tienen marcado el envío gratis, 0€.

Configurar envío gratis prestashop según importe y zonas

Listo. Esperamos que esta breve explicación te haya servido para configurar el envío gratis en tu tienda Prestashop. Si tienes preguntas o quieres comentarnos algo relacionado con este tema, no dudes en dejarnos un comentario. El tema de los transportistas y los gastos de envío da mucho de sí.

–

Foto de Bench Accounting elegida con cariño en Unsplash.

Añadir Google Analytics en Prestashop [versión 1.6]

Esta es una de las preguntas que surgen en cuanto tenemos nuestra tienda online en marcha por primera vez. ¿Cómo podemos ver el comportamiento de nuestras visitas? ¿en qué páginas aterrizan? ¿cuánto tiempo se llevan navegando? Para cantidad de respuestas relacionadas con el comportamiento de los usuarios existe Google Analytics, una herramienta gratuita de analítica web que, si nunca la has probado, seguro que te encantará. También te decimos que no es sencilla de manejar, pero si lo que quieres es ir probándola y aprendiendo un poco, puedes empezar por configurarla en tu tienda Prestashop.

1. Crear la cuenta en Google Analytics

Lo primero que tenemos que hacer es entrar en la página de Google Analytics para iniciar sesión o crear una cuenta nueva con un correo de Gmail. Una vez dentro, si es la primera vez que entramos en Google Analytics, tendremos que crear la cuenta siguiendo los pasos que nos indica la propia herramienta.

Hacemos clic en el botón «Regístrese» y rellenamos los datos de nuestra nueva cuenta. Por último, pinchamos en «Obtener ID de seguimiento» y aceptamos los términos del servicio. Nos encontraremos con la siguiente pantalla en la que tendremos que localizar nuestro ID de seguimiento (con esta apariencia tal que así UA-XXXXXXXXX-X). Éste será el que nos haga falta en la configuración del módulo de Google Analytics en Prestashop.

Obtener ID de seguimiento en Google Analytics — Recuadro pequeño: ID de seguimiento | Subrayado en amarillo: ID de seguimiento insertado en el código

Para los que ya tenéis cuenta en Google Analytics, solo tendréis que localizar vuestro ID de seguimiento dentro de vuestra cuenta. Podéis hacerlo pinchando en la rueda dentada (Administrar) situada en la zona inferior de la columna izquierda de vuestra pantalla. Luego, de las tres columnas que os aparecen, localizamos la del centro y buscamos «información de seguimiento». Ahí podréis localizar la información del ID que necesitamos para el módulo de Prestashop.

2. Cómo configurar Google Analytics en Prestashop

Para hacer la configuración de Google Analytics en Prestashop tenemos dos opciones que detallamos a continuación. Y ¿para qué sirve? El módulo o código que implementemos enviará una serie de datos a Google Analytics para que podamos medir infinidad de datos relacionados con nuestra tienda online.

Configurar Google Analytics manualmente

Esta es la opción más común entre los que trastean código ya que no necesita de ningún módulo adicional. Para hacerlo, solo tendremos que localizar el fichero header.tpl de la plantilla que estemos utilizando en nuestra tienda online. Lo abrimos y, antes de que se cierre la etiqueta </head>, añadimos el código que el mismo Google Analytics nos ha proporcionado. El código sería el siguiente teniendo en cuenta que habría que modificar el UA que hemos puesto de ejemplo para insertar el tuyo.

No olvidéis añadir al código que copiáis de Analytics las etiquetas {literal} {/literal} antes y después de insertar el script.

{literal}
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-108727392-1"></script>
<script>
 window.dataLayer = window.dataLayer || [];
 function gtag(){dataLayer.push(arguments);}
 gtag('js', new Date());

gtag('config', 'UA-555555555-5');
</script>
{/literal}

Configurar Google Analytics con módulo

La otra opción, no menos válida que la anterior, es utilizar un módulo de Prestashop. Para ello, vamos a la administración de nuestra tienda online y pinchamos en el apartado de módulos. Una vez dentro, buscamos en el buscador por la palabra «google analytics» para que nos aparezca. En el caso de que no lo tengamos, podemos descargarlo gratuitamente de la página de Prestashop e instalarlo.

Una vez instalado, el proceso es bastante sencillo. El botón verde de «instalar» pasará a ser «configurar». Si hacemos clic en él, entraremos en la configuración del módulo y veremos la siguiente pantalla en la que solo tendremos que insertar nuestro ID de seguimiento (subrayado en amarillo en la imagen del punto 1). Luego le damos a guardar y listo.

Como veis, también existe la posibilidad de activar el seguimiento User-ID. De momento, como estamos en una configuración básica, vamos a dejarlo desmarcado pero si quieres puedes leer más información sobre este tema aquí.

Configuración módulo Analytics Prestashop

Comprobar que Analytics está bien configurado

Para comprobar que la etiqueta de Google Analytics está implantada correctamente en nuestra tienda online, podemos hacer uso de una extensión de navegador llamada Tag Assistant que nos indicará si nuestro código está bien implementado.

Tag assistant ok

Si no, también podemos «ver el código fuente de la página» pulsando el botón derecho de nuestro ratón sobre cualquier página de nuestra tienda online. Luego, podemos buscar en el código (con la ayuda del Ctrl+F) si nuestro ID de seguimiento se está cargando correctamente.

3. Configuración de comercio electrónico en Google Analytics

Para hacer el proceso completo, nos quedaría indicar en Google Analytics que estamos trabajando con una tienda online, un e-commerce. Para ello, nos vamos a la administración de nuestra cuenta, concretamente a la tercera columna (vista) y buscamos «Configuración de comercio electrónico». Lo marcamos de la siguiente manera:

Habilitar comercio electrónico Google Analytics

A continuación marcamos como «Sí» los informes de comercio electrónico mejorado y pulsamos en «enviar».

Habilitar comercio electrónico mejorado Google Analytics

Para finalizar, tendríamos que especificar la moneda dentro del apartado «Configuración de la vista» > «Moneda mostrada como» de nuestro panel de administración de Google Analytics.

Especificar moneda Google Analytics

Ya con esto tenemos una base para empezar a ver datos. Google Analytics es un mundo, así que seguiremos dando algunos consejos más para descubrir nuevos rincones que la plataforma y vuestra tienda online Prestashop. Esperamos que os haya servido esta pequeña explicación.

–

Foto de Edho Pratama elegida con cariño en Unsplash.

¿Cómo quitar «Tienda creada con PrestaShop» cuando compartes?

Si estás empezando con Prestashop puede que te haya surgido esta pregunta. El problema aparece cuando al compartir tu tienda online en Facebook o cualquier otra red social se muestra la maldita frase que revela la potente herramienta en la que has construido tu web: «Tienda creada con Prestashop».

Esto no es más que la metadescripción de tu tienda online, concretamente la que viene por defecto en el index o página de inicio cuando instalas el Prestashop. Para modificarla el proceso de bastante sencillo.

Entramos en la administración de nuestra tienda online y vamos a Preferencias > SEO + URLs. Entre todas las páginas que se nos muestran, buscamos «index» y pinchamos en el botón de «modificar».

Quitar tienda creada por prestashop

Una vez dentro, se nos mostrará una pantalla en la que podremos insertar el título de la página, la metadescripción, las meta palabras claves y la URL reescrita.

eliminar tienda creada con Prestashop

Para el «título de la página», recomendamos poner alguna frase descriptiva, no muy extensa, que incluya la palabra clave que resume tu negocio.

Luego, el campo «meta descripción»es el que aloja la frase que queremos modificar. En su lugar, pondremos una descripción acorde con nuestra tienda online.

A continuación, las «meta palabras clave». Podemos eliminarlas e insertar otras que verdaderamente se identifiquen con nuestro sector. De todas formas, Google ya no las tiene muy en cuenta.

Por último, la «URL reescrita», mejor no tocar a menos que se tengan conocimientos de lo que se está haciendo. En este caso, no es necesario reescribir nada.

Guardamos y listo.

Con estas modificaciones, aparte de contribuir positivamente al SEO de tu tienda online, también estarás consiguiendo que no se muestre el texto que Prestashop trae por defecto al compartir tu sitio en redes sociales.

Y para terminar un último apunte. Si haces este cambio correctamente pero no ves resultados, puede que sea porque Facebook tenga guardada (cacheada) una versión de tu tienda online anterior a la modificación. Para ello, borra caché del navegador y prueba de nuevo.

¡Esperamos que te haya servido!

–

Foto de Jaelynn Castillo elegida con cariño en Unsplash.

¿Cuánto cuesta una tienda online Prestashop?

Esta es unas de las preguntas más buscadas en el mundillo del comercio electrónico, sobre todo entre aquellos que necesitan montar una tienda online y ya se han decidido por hacerla con Prestashop. Y es normal. A todos nos gusta saber en qué gastamos (o invertimos) nuestro dinero. De esa necesidad de saber «cuánto cuesta» surge esta entrada.

No queremos que dejes de leer este artículo, pero la pregunta no tiene solución exacta (con lo cuadriculados que somos por aquí). Aunque no la tenga, como no queremos marearte, si lo que estás buscando es una cifra en euros te decimos la respuesta desde ya: El precio de una tienda online depende de muchos factores.

Sí, es una respuesta odiosa. No querías saber eso, pero es que no es tan sencillo de contestar.

Ya lo decía Jarabe de Palo en sus canciones: «que según como se mire todo depende». Así que, si te interesa saber todas esas dependencias malditas que no nos permiten decirte «una tienda online en Prestashop vale tanto«, aquí te dejamos algunos de los puntos más importantes que influyen en el precio.

Decide qué quieres hacer tú

Claro está que el tiempo es dinero. Si tenemos en cuenta esta premisa será sencillo entender qué variables pueden influir en que el precio de una tienda online sea mayor o menor. Mientras más cosas hagamos nosotros, menos nos va a costar la tienda, o lo que es lo mismo, mientras menos tiempo tenga que dedicarle la agencia a nuestro proyecto, menor será el precio que tendremos que pagar por él. Evidentemente, el precio/hora de cada agencia y los costes que tenga cada e-commerce serán los que marquen la diferencia. Podríamos entrar a valorar en base a qué se fijan esos precios/hora, pero ya sería meternos en averiguar la fórmula de la Coca-Cola de cada empresa.

Nota: Prestashop es gratuito y libre para todo el mundo mundial. Si te animas a hacerlo tú mismo, solo tendrías que tener en cuenta el coste del alojamiento, el dominio y el SSL. Si en cambio tu idea es encargarlo a una agencia o freelance, sigue leyendo. Esperamos ayudarte.

1. El grado de personalización del diseño

He aquí uno de los temas que más hacen variar el precio de un proyecto: el diseño. Así es. Solo hay que coger un ejemplo sencillo de la vida cotidiana para entender porqué tener una tienda online personalizada cuesta más que tener una con plantilla.

Supongamos lo siguiente.

Si quieres comprarte un traje para un fiesta, puedes hacerlo comprándolo en Zara; comprándolo en Zara y llevándolo a un sastre para que le haga algunos ajustes que no te convencen demasiado; o directamente acudiendo a unos diseñadores para que te lo hagan a medida. En el primer caso no hay personalización, llevarás un traje que otra persona también podrá tener. En el segundo, ya cuentas con una prenda con un toque personal, con modificaciones. En la última opción, tienes un traje exclusivo y totalmente hecho para ti.

Con una tienda online Prestashop sucede lo mismo.

Podemos decidirnos por un diseño de los grandes almacenes, es decir, por un diseño con una estructura predefinida, lo que se denomina una plantilla. Probablemente, en este gran mundo online, no serás el/la únic@ que la tenga. Si eliges bien, el resultado suele ser bastante bueno, aunque el tema de las plantillas nos da para otro artículo (algunas pueden contener errores, pueden ser pesadas en la carga, pueden ser complicadas de configurar, etc.) Es la opción más económica pero no por ello una mala opción. Te sorprenderías de la gran cantidad de tiendas que hay con una plantilla predefinida de base.
También podremos optar por basar la estructura de nuestra tienda en una plantilla pero haciéndole ajustes en el diseño. Por ejemplo, si somos una mercería, podemos poner detalles en la cabecera de la web simulando un punteado con hilo. De esta forma, estaríamos dándole algunos toques de customización. Esa tienda sería el término medio en cuanto a personalización del diseño se refiere. Algo así como la zona de confort de un proyecto: ni lo más básico, ni lo más pro.
Como última opción, el diseño 100% a medida. Poco tiene que explicar. Exclusividad total, una tienda hecha (casi) como quieras. Decimos «casi» porque no hay que olvidar que trabajamos sobre una plataforma Prestashop que tiene sus «normas» y que hay que respetar. Aquí estaríamos tratando con un proyecto diseñado completamente desde cero con cantidad de horas de gestión, diseño y maquetación que tienen su efecto en el precio de la tienda online.

¿Qué elegir? Todas las opciones son bonitas si las tratas con cariño y profesionalidad. Pregúntate a ti mismo si verdaderamente necesitas (o quieres) exclusividad o no.

2. El desarrollo y las funcionalidades extras

En nuestra web ya explicamos cuánto cuesta una tienda online Prestashop comparándola con un coche. Ahora vamos a volver a poner el mismo ejemplo pero en versión extendida.

Cuando queremos comprarnos un vehículo nuevo, echamos un vistazo al catálogo y vemos una gran variedad de coches para un mismo modelo. Podemos coger el coche sin extras (el de la ventanilla trasera con manivela) o incluirle todo lo que se nos ocurra. Podemos equiparlo con un sistema de ayuda de aparcamiento, con techo solar o con una tapicería de cuero. Sin embargo, aunque puedas añadirle mil mejoras hasta convertirlo en el carro de Michael Knight, todos los coches cuentan con un mínimo de accesorios y funciones para que sea digno de recibir tal nombre.

Igual le ocurre a las tiendas online. Un e-commerce básico hecho en Prestashop ya cuenta con cientos de funcionalidades que lo hacen ser una herramienta más que válida para vender en Internet. Pero como lo estándar a veces no resulta suficiente, es necesario añadir «funcionalidades extras», unas de las responsables de que el precio de una tienda online se incremente. Normalmente, éstas suelen incluirse con módulos ya predefinidos que la empresa en cuestión tiene que encargarse de configurar correctamente. En otras ocasiones, si son necesidades muy concretas, es necesario desarrollar el módulo o la funcionalidad a medida, hecho que aumenta el presupuesto.

3. El contenido

Esta es la otra rama importante de las tiendas online que también puede influir en la oferta económica del proyecto. Es obvio que si queremos montar una tienda, hay que tener subidos todos los productos que vamos a vender en ella. También apartados que informen sobre las condiciones de compra, quiénes somos o la forma de contacto.

Seguramente, dependiendo de la agencia o profesional que os realice el trabajo, vais a encontrar diferentes opciones a la hora de tratar el contenido. Hay quien os propondrá encargarse de subir todos los productos, hay quien dejará en vuestras manos este trabajo, y hay quien os dejará preparados algunos productos de ejemplo para que luego sigáis subiéndolos vosotros. Claro está que hacer esta subida de contenido a la tienda online lleva tiempo y por tanto incrementa el presupuesto. Ya es vuestra decisión dejar esta tarea a cargo de otro trabajador o asumirla vosotros.

Sin embargo, hay tantos proyectos como negocios, ninguno es igual que otro. Por eso, hay ocasiones en la que nos enfrentamos a otros escenarios más complejos a la hora de dotar la tienda Prestashop de contenido. Es el caso de las tiendas online que necesitan migrar (traer) el contenido de otra que ya tenían anteriormente; de tiendas que necesitan enganchar con un ERP en el que gestionan su catálogo (y puede que otras cosas más) para que todo esté sincronizado; de negocios que cuentan con un archivo propio para importar sus productos; o de empresas que necesitan vincular su tienda con un proveedor de dropshipping.

Porque como ves ningún proyecto se parece a otro, es importante aclarar siempre con la agencia que vaya a desarrollar tu tienda Prestashop cómo vais a tratar el tema del contenido.

4. El alojamiento, el dominio y el SSL

No es este el artículo para hablarte de la cantidad de opciones que se ofrecen en el mercado sobre este tema. Para ofertarte y aconsejarte sobre cuál es la mejor opción para alojar una tienda online hecha en Prestashop ya están las empresas de hosting. Lo que sí queremos decirte es que, aparte del coste de la tienda online, tienes que tener en cuenta que el alojamiento y el dominio también debes contratarlos. Son mensualidades que según la empresa que elijas te permitirá abonarlas de una forma u otra.

No hay que olvidar el certificado SSL. No es imprescindible si no almacenas datos, pero si es recomendable tenerlo contratado. El hecho de comprar en Internet todavía supone un reto para muchas personas que sienten desconfianza a la hora de pagar online. Por eso y porque Google no para de decirnos que las páginas web mejor con SSL que sin él, no debes pasarlo por alto.

La horquilla de precios de alojamiento es muy amplia ya que dependerá de la envergadura de tu proyecto. Puede salirte desde 5 a 130 euros al mes según el modelo que elijas.

5. Marketing

Respecto al marketing solo queríamos hacer un apunte. Guarda parte de lo que tengas pensado invertir en tu proyecto para dedicárselo al posicionamiento en Google, a hacer anuncios, lo que se te ocurra. Ten en cuenta que la tienda online es el coche que te has comprado, será la herramienta de trabajo. Necesitarás «echarle gasolina» para que pueda andar.

Conclusión

En resumidas cuentas: Precios en el mercado hay muchos. Nosotros hacemos tiendas online en Prestashop y por tanto, nuestra opinión en el tema está totalmente condicionada por nosotros mismos. No vamos a decirte: «no me fiaría de que te monten una tienda online de X euros». Mejor te decimos que:

«Busca, compara, y si encuentras algo mejor, cómpralo».

Esperamos que esta entrada te haya servido para aclarar dudas y aprender cosas nuevas que quizás desconocías del trabajo que hay detrás de una tienda online Prestashop. Si quieres ayudarnos a completarla, coméntanos tus impresiones. Estaremos encantados de leerte.