El 11 de octubre de 2012. Temas adaptables de Prestashop

Hay diferentes maneras de obtener acceso a Internet: ordenadores, ordenadores portatiles, tablets, smartphones (telefonos inteligentes), eReaders etc. Y tambien hay una gran cantidad de navegadores web y sistemas operativos en uso, por eso es casi imposible ver un sitio web sin cambios utilizando cualquiera de estas maneras o navegadores o sistemas. Para facilitar la navegacion en Internet el diseno web adaptable fue desarrollado que incluye la teoria del diseno fluido, pero utiliza ‘media queries’, scripts y tecnologias que pueden reformatear paginas web y mark-up sin esfuerzo (o automaticamente).

Hoy el diseno web adaptable es muy popular en la Internet. Cada sitio web popular y profesional ha sido adaptado de acuerdo con las necesidades de los usuarios de moviles. Con el diseno web adaptable Usted puede estar seguro que cualquiera puede ver sus paginas web por medio de cualquier dispositivo.

El equipo de TemplateMonster ha trabajado mucho para desarrollar una linea de Temas adaptables de Prestashop.

Tuvimos realmente mucho trabajo de la adaptacion funcional de las tiendas para que ellos se adapten a las dimensiones de la pantalla del movil/tableta. Es decir, no es solo una permutacion de bloques y aumento/reduccion de la cantidad de imagenes y el tamano de tipos de letra, estos temas han sido casi convertidos en “aplicaciones para telefonos inteligentes”. Todos los elementos y modulos de estos temas fueron redisenados. Todo fue cambiado incluso el diseno del carrito de compras, el aumento de la descripcion de producto fue pensado y patentado y los scripts Ajax fueron anadidos para re-cargar las paginas. Los elementos para las pantallas tactiles (touch screen) fueron desarrolados cuidadosamente y desarrollados de la forma mas facil de usar.

Vamos a revisar los rasgos mas interesantes y mas importantes.

En esta entrada Usted puede encontrar tres disenos principales de Temas adaptables de Prestashop. Hay un monton de cosas interesantes.

> Vamos a examinar el panel superior: en la parte derecha del panel se puede ver los simbolos: Language, Currency y Log In (Idioma, Moneda, Ingresarse).

Esto es lo que obtiene al hacer clic en cada boton, las listas desplegables aparecen con 5 idiomas opcionales y 3 monedas.

En un diseno movil este panel solo se cambia el tamano de la ventana del navegador web.

Carrito de compras

Ahora vamos a examinar las nuevas opciones y capacidades del carrito de compra:

Al elegir un producto un usuario de la tienda podra cambiar de opinion y elegir un producto que ha revisado antes, ahora no hay necesidad de abrir la pagina del carrito para administrar la lista de posibles compras, solamente tiene que hacer clic en el Carrito y se aparecera un menu desplegable, apriete la cruz y el producto sera eliminado.

Otra cosa muy importante ha sido anadida al carrito de compras: el producto es agregado al carrito con una agradable animacion.

Al hacer clic en el boton Add to Cart (Agregar al carrito), el thumbnail de este producto vuela al carrito y el desplegable se abre mostrando que el producto ha sido agregado con exito. Una manera sencilla pero muy eficaz para permitir al usuario verificar la lista de productos que ya estan en su carrito.

Ver Producto

Hay otra cosa muy buena que vamos a examinar: un aumento inteligente de vista previa de producto, es especialmente bueno para pantallas tactiles. Simplemente toque el area marcada con la flecha roja y mueva el dedo o el lapiz optico para aumentar la vista previa del producto. Tambien se puede tocar el slider debajo de la imagen del producto, Usted puede revisar las imagenes con la ayuda del dedo o del lapiz.

Categorias

Se puede usar cualquier dispositivo y el panel siempre estara en su pantalla. En las pantallas de mayor resolucion se aparecera sin cambio, pero a partir de la tableta, se convertira en el menu desplegable muy bonito.

Opciones del producto

Cada pagina del producto contiene diversas opciones y parametros del producto especifico. En lib uno puede abrirlas o cerrarlas. Al cerrar cada campo la barra cambia su color de negro a naranja.

Paginas de productos especiales

Vamos a examinar Specials page, por defecto hay dos tipos de vistas previas de producto: Mosiac y List.

Ahora se puede revisar otros Temas adaptables de Prestashop.