Articles

WooCommerce Docs

WooCommerce Customizer forma parte de WordPress > Customize y permite seleccionar opciones que se aplican a todo el sitio para el Aviso de la Tienda, el Catálogo de Productos y las Imágenes de los Productos sin tocar ningún código.

Dónde encontrar WooCommerce Customizer Volver arriba

Desde el panel de control de WordPress, vaya a: Apariencia > Personalizar.

En el menú Personalizar, selecciona WooCommerce:

Debajo de WooCommerce hay cinco opciones:

  • Aviso de la tienda
  • Catálogo de productos
  • Página de productos
  • Imágenes de productos
  • Pago
Options under WooCommerce in the Customizer

Cada una de ellas se trata en detalle a continuación.

Aviso de la tienda Volver al principio

El aviso de la tienda le permite introducir un mensaje para todo el sitio que se muestra a todos los que visitan su tienda. El mensaje puede ser:

  • Informativo – Una nota que informa a los clientes de los retrasos en los envíos debido a las condiciones meteorológicas. Un aviso de «ausencia» si está de vacaciones.
  • Promocional – Una nota que anuncia un evento, un especial de vacaciones, un paquete, una venta en todos/algunos artículos o un envío gratuito.

Mostrar un aviso de la tienda Volver arriba

Para mostrar a los clientes un aviso de la tienda en todo el sitio:

1/ Ir a: Apariencia > Personalizar > WooCommerce > Aviso de tienda:

Display a Store Notice from the Customizer in the WooCommerce section

2/ Introduzca un mensaje en el área de texto.

3/ Marque la casilla de Activar Aviso de Tienda.

4/ Previsualice el aspecto del Aviso de Tienda en su sitio/tienda.

5/ Publicar cuando esté satisfecho y listo para que su Aviso de tienda se ponga en marcha.

Qué ven los visitantes Volver arriba

Así es como se muestra el Aviso de tienda en la parte frontal de su tienda/sitio. Los visitantes pueden optar por descartar el aviso después de verlo una vez.

*La ubicación y la apariencia del Aviso de la tienda variarán, dependiendo del tema que esté utilizando. La captura de pantalla anterior es con nuestro tema gratuito Storefront.

Editar o eliminar un Aviso de tienda Volver arriba

Para cambiar o dejar de mostrar un Aviso de tienda en todo el sitio:

1/ Ir a: Apariencia > Personalizar > WooCommerce > Aviso de tienda:

Display a Store Notice from the Customizer in the WooCommerce section

2/ Para modificar el Aviso de tienda:

  • Edita el mensaje en el área de texto para cambiarlo.
  • Desmarque la casilla de Activar Aviso de Tienda para dejar de mostrarlo a los visitantes.

3/ Publique para guardar los cambios.

Programar un Aviso de Tienda Volver al principio

Utilizar la opción Programar para el Aviso de Tienda puede ser útil cuando se ejecuta una promoción por tiempo limitado o se termina una venta/descuento a medianoche en una fecha específica.

En este ejemplo, queremos suspender la oferta de Envío Gratuito cuando expire al final del día el 28 de febrero.

1/ Vaya a Apariencia > Personalizar > WooCommerce > Aviso de la tienda para ver y acceder a la promoción actual/publicada.

2/ Desmarque la casilla de Activar aviso de la tienda.

3/ Seleccione la rueda dentada. Se abre un panel.

4/ Seleccione Programar en el menú de la derecha y, a continuación, introduzca la Fecha y la Hora en que desea que el cambio surta efecto.

5/ Seleccione Programar para que los cambios introducidos se realicen en la Fecha y la Hora futuras indicadas.

*Es necesario desactivar los descuentos por rebajas, los códigos de cupones o las ofertas por tiempo limitado. Eliminar el aviso no hace que la promoción deje de ejecutarse automáticamente.

Catálogo de productos Volver arriba

Todas las opciones del Catálogo de productos se encuentran en: Apariencia > Personalizar > WooCommerce > Catálogo de productos.

Product Catalog under WooCommerce in the Customizer

Catálogo de productos le permite elegir:

  • Qué mostrar en la página de la Tienda
  • Qué mostrar en las páginas de Categoría
  • Cómo ordenar los productos en una Categoría
  • Cuántos productos mostrar en una fila
  • Cuántas filas de productos mostrar en una página

Página de la tienda Volver arriba

Su página de la tienda puede mostrar Productos, Categorías, o ambos. Recomendamos seleccionar uno para una apariencia limpia.

1/ Seleccione Productos o Categorías del menú desplegable.

2/ Previsualice su selección en vivo. Usted debe estar viendo la página de la Tienda.

3/ Publicar para guardar e ir en vivo.

Páginas de Categoría Volver arriba

Sus Páginas de Categoría pueden mostrar Productos o Subcategorías dentro de una Categoría, o ambos. Se recomienda seleccionar una de ellas.

Si sólo tiene unos pocos productos, o no tiene subcategorías, puede que no haya diferencia en la apariencia.

1/ Seleccione Productos o Subcategorías en el desplegable.

2/ Previsualice su selección en vivo. Debe estar viendo una página de Categoría.

3/ Publicar para guardar e ir en vivo.

Ordenación de productos por defecto Volver arriba

La ordenación de productos por defecto le permite controlar el orden en que se muestran los productos, lo que influye en cómo se ven los productos por defecto en las páginas de Tienda y Categoría. Los visitantes siguen teniendo la opción de ordenar los productos de forma diferente, si así lo desean.

Ordenación por defecto (ordenación personalizada + nombre) – mostrar los productos alfabéticamente por nombre. Cuando el orden de clasificación de los productos se ha personalizado, ese orden personalizado se considera en primer lugar, y alfabéticamente por nombre en segundo lugar (si los productos comparten las mismas posiciones de orden). En su tienda, el cliente verá esto como Ordenación por defecto.

Ordenar por popularidad (ventas) – mostrar los productos según las cantidades vendidas, de mayor a menor. Los clientes ven Ordenar por popularidad.

Ordenar por Valoración media: muestra los productos según la valoración media de las reseñas, de mayor a menor.

Ordenar por más reciente – mostrar los productos en el orden en que fueron añadidos a la tienda, de más reciente a más antiguo. Cliente ver Ordenar por más reciente.

Ordenar por precio (ascendente / descendente) – ordenar el producto por precio ya sea de menor a mayor (ascendente) o de mayor a menor (descendente). El cliente ve Ordenar por precio: de menor a mayor, o Ordenar por precio: de mayor a menor.

En este ejemplo, hemos elegido Ordenar por precio (asc) (Ordenar por precio: de menor a mayor, mostrado con un ✔), y el cliente está a punto de seleccionar Ordenar por novedad.

Para elegir un Ordenamiento por defecto:

1/ Seleccione una opción del desplegable:

2/ Previsualice su selección en vivo. Puede estar viendo la página de la Tienda o una página de Categoría.

3/ Publicar para guardar y salir en directo.

Productos por fila Volver arriba

Productos por fila le permite elegir el número de artículos que aparecen en una sola fila en las páginas de la Tienda y la Categoría.

Tenga en cuenta:

  • El tamaño de la imagen de un producto
  • El espacio en un ordenador/portátil, tableta o dispositivo móvil
  • La experiencia óptima para que un cliente vea y compre sus productos

1 Utilice las flechas para aumentar/disminuir el número de productos.

2/ Previsualice su selección en directo. Puede estar viendo la página de la Tienda o una página de Categoría.

3/ Prueba en diferentes dispositivos. A continuación se muestra un ejemplo de diferentes vistas, utilizando la misma configuración.

  • En la pantalla de un ordenador/portátil
  • En una tableta
  • En un dispositivo móvil

*La escala del tamaño de la imagen y la apariencia variarán dependiendo del tema que estés utilizando. Las capturas de pantalla de arriba son con nuestro tema gratuito Storefront.

4/ Publicar para guardar e ir en vivo.

Filas por página Volver al principio

Las filas por página le permiten elegir el número de filas que aparecen en las páginas de la tienda y la categoría.

Tenga en cuenta:

  • El tamaño de las imágenes de los productos
  • El número de productos que vende
  • El espacio en un ordenador/portátil, tableta o dispositivo móvil
  • La experiencia óptima para que un cliente vea y compre sus productos

1/ Utilice las flechas para aumentar/disminuir el número de filas.

2/ Previsualice su selección en directo. Puede estar viendo la página de la Tienda o una página de Categoría.

3/ Prueba en diferentes dispositivos. A continuación se muestra un ejemplo de diferentes vistas, utilizando la misma configuración.

  • En la pantalla de un ordenador/portátil
  • En una tableta
  • En un dispositivo móvil

*La escala del tamaño y la apariencia de la imagen variará dependiendo del tema que estés utilizando. Las capturas de pantalla de arriba son con nuestro tema gratuito Storefront.

4/ Publicar para guardar e ir en vivo.

Página de producto Volver arriba

La página de producto tiene dos opciones que se aplican a las páginas de productos individuales:

  • Sticky Add-to-Cart – Es una pequeña barra de contenido en la parte superior de la ventana del navegador que incluye información relevante del producto y un botón de añadir al carrito. Se desliza a la vista una vez que el botón estándar de añadir al carrito se ha desplazado fuera de la vista.
An example of what the Sticky Add-to-Cart content bar looks like with Storefront theme active.
  • Paginación de productos – Muestra los enlaces siguiente y anterior en las páginas de productos. Se muestra una miniatura del producto con el título revelado al pasar por encima.

Imágenes de productos Volver al principio

Imágenes de productos tiene dos características:

  • Le permite seleccionar el tamaño y el recorte de las imágenes del Catálogo y de las Miniaturas
  • Reconfigura automáticamente el tamaño de las imágenes del Catálogo y de las Miniaturas en todo el sitio de su tienda cuando se realiza un cambio publicado*

Esto le ahorra tiempo y energía en recortar y redimensionar manualmente cada una.

Tipos de imágenes Volver al principio

  • Las imágenes de catálogo son imágenes de tamaño medio que aparecen en la página de la tienda, en las páginas de las categorías y en los productos relacionados, en las ventas ascendentes y en las ventas cruzadas.
  • Las imágenes en miniatura son las imágenes más pequeñas que se utilizan en el carrito, en los widgets y en las imágenes de la galería (opcional) que se encuentran debajo de la imagen del producto único en las páginas de detalles de los productos individuales.
  • La imagen del producto único es la imagen más grande y se refiere a la imagen principal/destacada. La configuración de las Imágenes de Producto en el Personalizador de WooCommerce no se aplica a estas. Para añadir, editar o eliminar la Imagen Única de Producto o la Galería de Imágenes de Producto, consulte: Añadir imágenes y galerías de productos.

* Anteriormente, las miniaturas necesitaban ser regeneradas usando un plugin de terceros. WooCommerce 3.3x ahora maneja esto por usted. La regeneración no se activará para los cambios realizados sólo en el modo de vista previa.

Cambiar el tamaño y recortar las imágenes en miniatura Volver arriba

1/ Ir a: Apariencia > Personalizar > WooCommerce > Imágenes de producto.

2/ Seleccione uno:

  • 1:1 – Imagen cuadrada
  • Personalizado – Usted selecciona la proporción en la que se recortan las imágenes. En este ejemplo, se introduce 1:2; y no se puede ampliar una imagen para cumplir este requisito.
  • Sin recortar – Las imágenes aparecen tal cual, lo que puede dar lugar a que todas sean diferentes, a menos que se utilicen fotos de tamaño y resolución uniformes. La captura de pantalla de abajo es un ejemplo de esto: Una es perfectamente cuadrada, la siguiente es un cuadrado más pequeño y la última es un rectángulo.

3/ Prueba en diferentes dispositivos. A continuación se muestra un ejemplo de diferentes vistas, utilizando la misma configuración.

  • En la pantalla de un ordenador/portátil
  • En una tableta.
  • En un dispositivo móvil.

4/ Publicar para guardar y salir en vivo.

Comprobar Volver arriba

Todas las opciones de Comprobación se pueden encontrar en: Apariencia > Personalizar > WooCommerce > Checkout.

Ahora puedes establecer si ciertos campos son obligatorios u opcionales en función de los datos que quieras recoger. También puede optar por resaltar los campos obligatorios con un asterisco, que es el valor predeterminado.

Se recomienda crear páginas de Política de Privacidad y Términos y Condiciones, y luego puede establecerlas aquí. Las páginas configuradas se enlazan junto con el texto que introduzcas y aparecen en la página de Pago así:

El enlace «política de privacidad» abre la página en una nueva ventana, mientras que el enlace «términos y condiciones» abre un cuadro en la página que muestra el contenido de la página de términos y condiciones. No se puede realizar un pedido sin marcar la casilla de términos y condiciones requerida.

FAQs Volver arriba

No encuentro el personalizador de WooCommerce. Volver arriba

Las tiendas que utilizan WooCommerce 3.3x+ tienen esta opción disponible en: Apariencia > Personalizar > WooCommerce. Las tiendas que utilicen una versión de WooCommerce anterior a la 3.3.0 verán el Aviso de la tienda y las Imágenes de producto en: WooCommerce > Configuración > Productos > Sección de visualización; Catálogo de productos es nuevo.

Recomendamos actualizar a la última versión de WooCommerce para aprovechar las nuevas y mejoradas características y funcionalidades. Gracias.

¿Puedo seguir utilizando el plugin Regenerate Thumbnails? Volver al principio

Sí, puede. Pero no es necesario si se utiliza WooCommerce 3.3.0 o superior porque un cambio a un nuevo o diferente ellos, o cualquier cambio en vivo en el Catálogo de Productos o Imágenes de Productos, desencadena WooCommerce para auto-tamaño y auto-actualización de las imágenes en miniatura y el catálogo de productos para usted.

También puede utilizar la opción Regenerar miniaturas de la tienda en: WooCommerce > Estado > Herramientas.