C�mo personalizar la imagen de los producto en una WooCommerce

Mejorar la experiencia de los visitantes a una tienda virtual es una meta que todo administrador desea cumplir. Y uno de los peque�os cambios que se pueden hacer es personalizar cada imagen de producto en WooCommerce.

Cómo Personalizar la Imagen de los Productos en una WooCommerce

Poder determinar c�mo se mostrar�n las im�genes en el cat�logo y para cada elemento es muy importante, pues est� es la cara del mismo y lo que el comprador aspira a adquirir.

Pero esto puede parecer un poco complicado para qui�n no maneja a�n todas las herramientas y programas que WordPress incluye, como el WooCommerce.

WooCommerce adem�s te da la posibilidad de que todas tus ventas se hagan de forma limpia, r�pida y organizada. Puedes crear y ofrecerle a tus clientes facturas electr�nicas y adjuntar archivos de pago gracias a WooCommerce Checkout Manager.

�Qu� necesito para tener una imagen de producto en WooCommerce?

Para poder trabajar con esta herramienta de comercio electr�nico, ser� necesario contar con una cuenta en la plataforma de WordPress y estar suscrito a alg�n plan.

Esto �ltimo es imprescindible pues, como ya se debe saber, WooCommerce es un plugin para dicho servicio de gesti�n de contenido. Y todas las extensiones son exclusivas de los clientes suscritos.

Adem�s de esto, es recomendable tener a la mano las im�genes a utilizar, as� como el resto de la informaci�n pertinente con relaci�n a los productos.

Al tener esto listo y presente, ya se puede comenzar a trabajar en funci�n de instaurar y personalizar una imagen de producto en WooCommerce.

Desde cero: creando el producto

Antes de poder a�adir o personalizar cualquier imagen, ser� necesario crear el elemento o producto con el cual se trabajar� y que estar� disponible para los clientes.

dise�o de woo commerce

 

Para esto, se debe abrir e iniciar la sesi�n en WordPress, seguidamente se ubica del panel lateral izquierdo el personalizador o �WP Admin�.

De esta manera, nos redirigir� a la pantalla de administrador de la cuenta, d�nde se podr� acceder, desde el men� lateral, en el apartado �WooCommerce� a la pesta�a �Producto�.

As�, se abrir�n las opciones de las que se optar� por �A�adir nuevo�, por lo que podremos rellenar los campos con la informaci�n correspondiente al art�culo o servicio.

Antes de darle a �Publicar� se debe insertar la imagen, de no ser as�, la plataforma le colocar� una por defecto, que se ver� al acceder al enlace del producto.

Personalizando la imagen por defecto

Ahora bien, para personalizar la imagen que se mostrar� por defecto, lo mejor es tener la imagen a vincular en la �Biblioteca de medios� de nuestro WordPress.

A continuaci�n, habr� que dirigirse hacia el mismo �WP Admin�, pero esta vez eligiendo la pesta�a �Medios� y luego en �Biblioteca� para poder dar clic sobre el archivo deseado.

Al abrirse la vista del mismo, se podr� copiar desde el lateral derecho el enlace de la imagen. Mediante este link, es que se a�adir� la imagen de producto en WooCommerce.

El siguiente paso, consta de acceder al archivo �funtions.php� o directamente al plugin de �Snippets�, siendo este �ltimo el m�s recomendado.

app de woo commerce

Entonces, ubicamos la pesta�a �Snippets� desde el panel lateral, y pulsamos sobre la modalidad �A�adir nuevo�, y procedemos a pegar el siguiente c�digo:

add_filter( 'woocommerce_placeholder_img_src', 'bp_woo_placeholder', 10 );

function bp_woo_placeholder( $image_url ) {

$image_url = '';

return $image_url;}

Por �ltimo, se pegar� entre las comillas el enlace a la imagen de la biblioteca que hemos copiado antes, y de esta manera se habr� cambiado la imagen predeterminada.

Personalizar una imagen de producto con WooCommerce

Si lo que se quiere es personalizar una imagen espec�fica a cierto producto, se debe abrir el �WP Admin� y en �WooCommerce� ir hac�a las �Im�genes de producto�.

En esta secci�n, ser� posible caracterizar tanto las im�genes del producto individual, como las mostradas en miniatura en el cat�logo.

Entonces, se podr� cambiar el �Ancho de la imagen principal� y el �Ancho de la miniatura� colocando en n�meros los valores que se quieran.

Asimismo, est� permitido establecer ajustes para el recorte espec�fico en las im�genes de las miniaturas en �1:1�, �Personalizado� y �Sin recortar�.

Por lo que, quedar� a decisi�n del usuario c�mo personalizar la imagen de producto con WooCommerce, luego habr� que esperar a que los cambios se realicen satisfactoriamente.

Si el producto que deseas personalizar es muy solicitado y ya se te agoto del Stock WooCommerce te da la posibilidad de poder ocultarlos moment�neamente.�

Si te interesa el mundo de la venta en l�nea recuerda apoyarte tambi�n en la aplicaci�n de Instagram Shooping para hacer m�s p�blicos tus productos.

Subir