Los comandos de la sección Ajustes

Paso 4 - Páginas > Objeto Catálogo de Productos >

Los comandos de la sección Ajustes

Previous pageReturn to chapter overviewNext page

Por medio de las opciones disponibles en esta sección es posible definir algunos ajustes gráficos relativos a las fichas a través de las cuales se presentan los productos añadidos a la lista.

La Ficha de un producto está compuesta por los siguientes elementos, todos configurados de acuerdo a lo establecido en Carrito de la compra | Ventana Configuración del producto:

Fondo
Portada: toma la primera de las imágenes añadidas para el Producto en la sección Imagen de la ventana Configuración del producto;
Nombre del Producto;
Descripción;
Detalles: comprende la Categoría, las Variantes de Producto, la Disponibilidad, el Precio, la indicación del IVA, el Campo Cantidad;
Botón: tiene activo el enlae que lleva al añadido del Producto al carrito.

Naturalmente, en el caso de que elementos como la Portada o las Variantes de Producto no hayan sido especificados, estos datos no se incluirán en la Ficha.

Por lo que se refiere a la disponibilidad, trabajando con la edición Pro, en la Ficha Producto se muestra no solo el icono para la Disponibilidad Indicativa sino también el número que especifica su Disponibilidad Efectiva.

Antes de nada es preciso, mediante las opciones disponibles en la sección Ajustes de las fichas, definir cómo estas deben estar conformadas y estructuradas eligiendo un tipo de vista entre los siguientes:

Portada a la izquierda, título y contenidos a la derecha

Título y contenidos a la izquierda, portada a la derecha

Portada arriba, título y contenidos abajo

Título y contenidos arriba, portada abajo

Independientemente del tipo elegido, en el nombre y en su caso en la imagen de las Fichas de Producto se activa automáticamente el enlace configurado mediante la opción Enlace (ej. Página de la ficha del producto) de la ventana Configuración del producto | General.

Una vez definido el tipo de vista, es entonces posible modificar las siguientes opciones:

Fichas por fila: permite especificar cuántas Fichas de Producto deben estar una junto a otra en una única fila.
Altura fichas: permite especificar el valor en píxeles que debe asumir en altura cada Ficha de Producto. En función de este parámetro, el tamaño de las imágenes asociadas a los productos es modificado automáticamente. Si los textos de descripción de los productos son demasiado largos para poder ser visualizados completamente, se muestra la barra de desplazamiento.
Margen de las Fichas: define el valor en píxeles de la distancia que debe ser mantenida entre las Fichas.
Tamaño portada (%): configura el ancho de la imagen de Portada respecto a los contenidos, en caso de que esté situada a la izquierda o a la derecha; o respecto a la altura de la Ficha, en el caso de que esté situada arriba, sobre o bajo el Nombre del Producto.
Margen de portada. / Margen de contenidos: definen respectivamente el valor en píxeles de la distancia entre la imagen de Portada o el contenido (Nombre y Descripción) y los bordes de la Ficha.

Una vez definidos estos parámetros, es también posible configurar las propiedades gráficas de los diferentes elementos que componen las Fichas de los Productos. Tras seleccionar el Elemento que se quiere configurar, estas son las opciones disponibles ofrecidas:

Visible: hace que el elemento de la Ficha sea visible o no. Esta opción no está disponible para el Fondo y la Portada. Tras seleccionar el elemento Detalles, por contra, es posible especificar si se quieren ver o no datos como la Categoría, la Disponibilidado el Precio.
Fuente: especifica el tipo de carácter, el tamaño y el Estilo del texto para el Nombre del Producto, la Descripción, los Detalles y el Botón. El menú desplegable propone: la opción para aplicar la Fuente predeterminada (definida por el estilo del elemento Texto de la página en la ventana Estilo de los textos); la lista de las Fuentes Seguras, es decir fuentes presentes en todos los dispositivos y para las cuales por tanto no es necesaria ninguna publicación; todas las Fuentes Web y las Google Fonts añadidas mediante la ventana Añadir Fuentes Web que se abre con la opción Otros tipos de carácter.
Color Texto: especifica el color del texto para el Nombre del Producto, la Descripción, los Detalles y el Botón. Seleccionando el elemento Detalles, el color definido para el Texto se usa también para la línea situada bajo la Descripción.
Color Fondo: especifica el color del Fondo de la Ficha y del Botón.
Grosor: especifica el espesor de los bordes del Fondo de la Ficha y del Botón.
Color: especifica el color de los bordes del Fondo de la Ficha y del Botón.
Esquinas redondeadas: define el factor de redondeo para las esquinas del Fondo de la Ficha y del Botón.
Sombra: aplica una sombra al Fondo de la Ficha, definiendo su color, la posición, la difusión y el tamaño.
Adaptar tamaño: si está activa, hace que la imagen de Portada ocupe todo el espacio disponible dentro de la Ficha, tanto a lo ancho como a lo alto. En caso de que las proporciones no se correspondan, la imagen será centrada y cortada. Si no está activa, por contra, la imagen de Portada se adaptará al ancho o al alto del espacio disponible.
Mostrar Categoría: muestra en la Ficha de Producto la Categoría en la que -de acuerdo a lo definido en la ventana Carrito de la compra | Lista de productos- se incluye el Producto.
Mostrar campo cantidad: muestra en la Ficha de Producto un Campo Cantidad para dar al cliente la posibilidad de especificar la cantidad de unidades del producto que quiere añadir al carrito de la compra.
Mostrar Disponibilidad: muestra en la Ficha de Producto, además del icono para la Disponibilidad Indicativa, también el número que indica su Disponibilidad Efectiva.

Si se activa la opción Mostrar Disponibilidad y hay al menos un Producto para el que se contempla la indicación de este tipo de disponibilidad, para la Página en la que está el Objeto Catálogo de Productos debe estar configurada la extensión .PHP: es posible hacerlo mediante la opción Extensión del archivo generado de la ventana Propiedades de la página | Avanzado.

Mostrar precio: muestra el precio asociado al producto, con o sin IVA, en la Ficha de Producto.
Modalidad: especifica si como Botón se debe utilizar un Texto o una Imagen. En el primer caso es posible servirse de las opciones disponibles para definir el estilo del enlace textual; por contra en el segundo se tomará como imagen la que se hubiese definido en la sección Imágenes de la ventana Carrito de la compra | Opciones.
Márgenes: define el valor en píxeles para el margen entre el texto y el borde del Botón.

Solo en la edición Pro, es posible aplicar las Lazos sobre la Ficha de Producto:

Tipo de lazo: permite definir los ajustes para los lazos que se mostrarán en las Fichas de Producto en los casos de "Nuevo producto" o "Producto en oferta".
Archivo imagen: define la imagen que se usará como lazo. Es posible pulsar sobre la flecha que hay en el campo para seleccionar una imagen de la librería disponible o pulsar el botón e importar el archivo gráfico (.JPG, .GIF, .PNG.) de la imagen que se quiere utilizar.
Alineación: especifica cómo debe alinearse el lazo al interior de la Ficha de Producto.
Ancho (%): especifica la anchura del lazo en porcentaje respecto al tamaño de la Ficha de Producto.

Por último, mediante las funciones del recuadro Opciones es posible definir:

Añadir sin mostrar el Carrito de la compra: hace que pulsando el botón de compra el Cliente añada directamente el producto al pedido sin ser automáticamente reenviado al Carrito de la compra.
Activar vínculo sobre la imagen: activa en las diferentes imágenes de la Ficha de Producto el enlace a las imágenes ampliadas correspondientes. Dichas imágenes ampliadas son visualizadas mediante la ventana ShowBox. Este enlace se sustituye con el eventualmente configurado mediante la opción incluida al efecto en la ventana Configuración del producto | General.

La apariencia de la ventana de ShowBox se puede personalizar completamente: a través de las opciones Paso 2 que hay en la sección Ventana emergente ShowBox se pueden ajustar, por ejemplo, los colores, la sombra, la opacidad y efectos de apertura.