Child pages
  • Navegando por el front-office

Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

Tenga en cuenta que todo el contenido puede ser modificado por el propietario de la tienda desde el propio panel de administración (back-office), ya sea a través de la configuración de preferencias o mediante la configuración del módulo.

The default theme's left column only appears on a category page, when activated from the back office. It mainly serves as a handy placeholder for navigation and tools.

A category is a hierarchical way of sorting items: it can contain any number of sub-categories, making it possible to easily browse from the more general category listings to the more specific products by following a logical path.

A PrestaShop shop can have as many categories and sub-categories as needed, with an infinite number of products in a given category level. All categories are actually sub-categories of the root category, "Home."

The faceted navigation displays a block with different criteria available to filter the products, mostly attributes, features, and price ranges. It is very handy to help the customers easily find a product.

This is where the magic happens. The central section changes constantly in response to the customer's choices.

The default front page gives the customer a broad overview of the shop and its possibilities. An image slider serves as an introduction to the shop, with three alterning images.

The slider is followed by a list of "Popular products" that highlights products depending on their popularity.

Tip

Most seasoned web surfers will visit a shop via a search engine, landing directly on a product or category. Few stumble upon the home page, and this is why it should be tailored to new users.

Categories, tags, brands, suppliers, search, specials page, best sellers page or new products page: PrestaShop has many paths to a product, but in the end, the customers are given a familiar listing of products, within the chosen context.

Despite the differing content, these listing designs are very similar, in order to keep it familiar even for the newcomers. They all display a list of concerned products organized in a grid, with:

  • A thumbnail,
  • Discount or state flags on the top-left hand side,
  • Product name
  • Product price

This list view enables the customer to see at a glance the products' main information when they already know everything they need about a product, allowing for a quicker decision process.

Hovering over the product triggers a quick animation, displaying the different combinations and a "Quick view" link. By clicking the "Quick view" link, a pop-up window opens with the main product information and an "Add to cart" button.

Categories can feature a header image with an introductory message, as set by the shop owner.

Product listing by category or brand can be further sorted by price (low to high or high to low), name (A to Z or Z to A) or relevancy.

This is where all the information entered by the shop owner is available to the user. Depending on the theme design, a product page can be very thorough, with extensive information, or simply present the most essential facts. The default theme is typical in that its most prominent feature is the product images, with a tool below it enabling customers to view the various available images.

Next to the images are two blocks:

...

La columna izquierda del tema predeterminado sólo aparece en páginas de categoría, cuando se activa desde el panel de administración. Ésta tiene como objetivo ser un práctico marcador de navegación y de herramientas.

Una categoría es una manera jerárquica de organizar artículos: esta puede contener un número cualquiera de sub-categorías, por lo que esta facilita  navegar partiendo desde las categorías más generales a los productos más específicos, siguiendo un camino lógico.

na tienda PrestaShop puede tener tantas categorías y subcategorías como sea necesariocon un número infinito de productos en cada categoría determinada. Todas las categorías son en realidad subcategorías de la categoría raíz "Inicio".

La navegación por facetas muestra un bloque con diferentes criterios disponibles para filtrar los productos, en su mayoría atributos, características y rangos de precios. Es muy útil para ayudar a los clientes a encontrar fácilmente un producto.

Aquí es donde ocurre la magia. La sección central cambia constantemente en respuesta a las elecciones del cliente.

La página de inicio predeterminada ofrece al cliente una amplia visión general de la tienda y sus posibilidades. Un carrusel de imágenes, sirve como una introducción a la tienda, con tres imágenes que se alternan una tras otra.

El carrusel de imágenes viene seguido del bloque de “Productos Destacados”, presentando productos que el propietario de la tienda desea resaltar, ya sean por ser novedosos o por tener descuentos en sus precio.

Tip

La mayoría de los navegantes llegarán a la tienda a través de un buscador, entrando directamente en un producto o categoría. Algunos lo harán a través de la página de inicio, y este es el motivo por el cual esta tiene que estar confeccionada para nuevos usuarios, con una presentación adecuada.

Categorías, etiquetas, marcas, búsquedas, promociones, mejores ventas o nuevos productos: PrestaShop tiene muchos caminos hacia un producto, pero al final se les daa los clientes una lista conocida de los productos, en el contexto elegido.

Pese a la diferencia de contenido, estos diseños de listas son muy similares para mantener la familiaridad del contenido incluso para los usuarios recién llegados. Todos ellos muestran un listado de productos relacionados entre sí, organizados en una cuadrícula, con:

  • Miniatura de imagen,
  • Descuento o indicaciones en el lado superior izquierdo,
  • Nombre del producto
  • Precio del producto

Esta presentación de la lista permite a los clientes observar de forma resumida la información principal del producto cuando ya conocen lo necesario sobre el producto, permitiendo un proceso de decisión acelerado.

Posicionar el ratón sobre el producto desencadena una animación rápida, mostrando las diferentes combinaciones y un enlace "Vista rápida". Al hacer clic en el enlace "Vista rápida", se abrirá una ventana emergente con la información principal del producto y el botón "Añadir al carrito".

Algunas categorías pueden ofrecer una imagen de encabezado, con un mensaje de presentación, según lo establecido por el propietario de la tienda.

El listado de productos por categoría o marca puede ser ordenado por precio (de más bajo a más caro, o de más caro a más bajo), nombre (de A a Z, o de Z a A) o disponibilidad.

Aquí es donde toda la información introducida por el propietario de la tienda está disponible para el usuario. Dependiendo del diseño del tema, una página de producto puede ser muy minuciosa, con amplia información, o simplemente presentar los datos más esenciales. En el tema por defecto  es el típico en el que lo que más llama la atención son las imágenes de los productos, con una herramienta en la parte inferior que permite a los clientes desplazarse entre las imágenes disponibles.

Junto a las imágenes hay dos bloques:

  • Un bloque "Breve descripción (resumen)", que presenta los datos principales del producto actual.
  • El bloque "Añadir al carrito", con la posibilidad de elegir entre las distintas combinaciones disponibles (definidas por el propietario) y la cantidad solicitada.

Below the cart block you will find a reassurance block, to let your customers know about the various benefits of buying on your shop, or to be more transparent on your payment and delivery policies.

At the bottom of the product page is a tab section. The most usual ones are:

  • Description. This gives the full description for the product, as entered by the shop owner.
  • Product detailsThis tab only appears if the shop owner has entered data in the product's "Features" sheet. This gives all the detailed features that were entered into database. The content of this tab is very sparsely written: these are just raw facts, far from the product description.

Clicking on the "Cart: XX products" link in the header brings the customer to the shopping cart summary page, which is the first step in the order process, En la parte inferior de la página del producto hay una sección que presenta varias pestañas. Los más habituales son:

  • Descripción. Esta ofrece la descripción completa del producto, tal como fue introducida por el propietario de la tienda.
  • Detalles del productoEsta pestaña sólo aparece si el propietario de la tienda ha introducido datos en la página "Características" del producto. Ésta muestra las características detalladas que fueron introducidas en la base de datos.  El contenido de texto de esta pestaña es escaso: son datos sin refinar, lejos de la descripción detallada de la pestaña de “Descripción”.

Al hacer clic en el "Carrito: XX productos" que aparece en la cabecerael cliente ingresará a la página de resumen del carrito de compras, la cual es el primer paso en el proceso del pedido, before entering the checkout page. It sums up the cart and shows again the reassurance block. This is where the customer makes sure that the order only contains the wanted products, no more, no less.

...