Optimizar imágenes para web

Imágenes comprimidas y optimizadas para web

Para la mayoría de imágenes (fotografías, etc) hay que utilizar el formato JPG optimizado para web. Si tienes Adobe Photoshop, puedes utilizar la función de Guardar para web con calidad alta (60%). Aquí os explicamos los pasos a seguir. Si no tienes ningún software que lo permita, hay numerosas herramientas online para comprimir imágenes de forma óptima: TinyJPG, Optimizilla

Para las imágenes con colores planos puedes usar PNG o GIF, te dará mejores resultados tanto de peso como de calidad.

Nombres de archivo con un formato compatible

Evitar el uso de caracteres especiales como acentos o ñ en los nombres de archivo. Evitar también el uso de espacios, en su defecto se recomienda usar el guión medio (-). Esto da problemas a la hora de cargar las imágenes en Safari y iOS, y además puede dar problemas posteriores en migraciones de plataforma, etc.

Nombres de archivo adecuados para SEO

Nombrar los archivos con palabras clave relevantes, de esta forma fomentarás el SEO de tu contenido multimedia y podrá aparecer más fácilmente en Google Images.
Si tienes más de una imagen en cada página, puedes enumerarlas. Ejemplo: nombre-marca-producto-referencia-1.jpg, nombre-marca-producto-referencia-2.jpg…

Texto alternativo

Es obligatorio poner un texto alternativo en las imágenes. Dentro de WordPress puedes hacerlo en el campo Texto Alternativo correspondiente  que encontrarás al editar cada imagen, ya sea desde el apartado Media como directamente desde un post o página.

 

Usando WooCommerce Table Rate Shipping

WooCommerce Table Rate Shipping permite configurar el envío de nuestra tienda de forma avanzada. Podemos hacerlo en base a tablas de precios que pueden variar en función del peso, precio o volumen de los productos y también en función de la zona de envío de cada cliente.

Os detallamos un ejemplo práctico en base a las tarifas de envío de la tienda de un cliente. El cliente nos ha facilitado los siguientes documentos Excel de tarifas.

1. Tarifas de envío estándar:

2. Tarifas de envío urgente:

Para configurar estas tarifas en nuestra tienda necesitamos el plugin WooCommerce Table Rate Shipping. Los pasos son los siguientes:

Configuración de las zonas de envío

Configuración de los métodos de envío

Gestión de pedidos en WooCommerce

En WooCommerce > Pedidos puedes encontrar los pedidos que te han realizado. Cuando alguien compra en tu tienda, automáticamente aparecerá un indicador como este:

woocommerce-indicador-pedido-realizado

En cada pedido se indica su estado actual en la siguiente columna.

woocommerce-estado-pedido

En este link os detallamos la definición de cada uno de los posibles estados de un pedido en WooCommerce.

Al recibir un pedido, WooCommerce envía automáticamente un email al cliente y un email al administrador notificando la compra. Si el pago se ha realizado mediante tarjeta de crédito o PayPal y tu tienda está bien configurada, el pedido se pondrá en estado Procesando automáticamente.
Para pedidos realizados con transferencia bancaria el pedido estará en estado En espera y será necesario ponerlo en modo Procesando manualmente una vez recibido el pago para que el cliente reciba también dicha confirmación.

woocommerce-pedido-estado-procesando

Cuando el pedido está en modo Procesando es el momento de proceder a la preparación del pedido y el envío del mismo. Una vez el pedido ha sido enviado es necesario poner el pedido en modo Completado. En este momento, el cliente recibirá un correo notificándole que el pedido ha sido completado y se ha realizado su envío.

woocommerce-pedido-estado-completado

Definición de los estados del pedido en WooCommerce

  • Pendiente: Pedido recibido (pago aún sin recibir)
  • Error: El pago ha fallado o se ha rechazado (pago no recibido)
  • Procesando: Pago recibido, el artículo se ha descontado del inventario. El pedido está a la espera de completar el proceso por parte del administrador (momento de empaquetar y enviar).
  • Completado: Pedido enviado y completado
  • En espera: Pendiente de pago. El artículo se ha descontado del inventario pero es necesario confirmar el pago
  • Cancelado: Cancelado por un administrador o el mismo cliente
  • Reembolsado: Esta acción es aplicada manualmente por el administrador en caso necesario.

¿WordPress te cambia el color de las imágenes?

Si WordPress te cambia el color de las imágenes lo más probable es que las hayas subido con un perfil de color no compatible.
Para asegurarte que las imágenes que subes a tu WordPress tienen el perfil de color adecuado para web te recomendamos utilizar la opción de Guardar para web de Photoshop:

Una vez aquí, basta con desmarcar la opción Embed Color Profile y guardar la imagen con el nombre de desees.

Error SMTP de validación de certificado SSL con PHP 5.6 en WordPress

Normalmente utilizo un plugin para enviar los emails de WordPress vía SMTP. Recientemente me he encontrado con este error en algunos WordPress que gestiono:

Warning: stream_socket_enable_crypto(): SSL operation failed with code 1. OpenSSL Error messages:
error:14090086:SSL routines:SSL3_GET_SERVER_CERTIFICATE:certificate verify failed in /home/www/wp-includes/class-smtp.php on line 344

Después de buscar por Internet, he encontrado, que PHP 5.6 introduce la verificación del certificado SSL. En este caso, en nuestro servidor de correo estamos utilizando un servidor sin certificado de seguridad, de aquí el error. La solución ha sido desactivar la verificación mediante las opciones del SMTP.

En vez de gestionarlo con un plugin puedes añadir este código en tu fichero functions.php:

add_action('phpmailer_init','send_smtp_email');
function send_smtp_email( $mail )
{
    // Define que estamos enviando por SMTP
    $mail->isSMTP();
 
    // La dirección del HOST del servidor de correo SMTP p.e. smtp.midominio.com
    $mail->Host = "ruta del servidor";
 
    // Uso autenticación por SMTP (true/false)
    $mail->SMTPAuth = true;
 
    // Puerto SMTP - Suele ser el 25, 465 o 587
    $mail->Port = "587";
 
    // Usuario de la cuenta de correo
    $mail->Username = "usuario";
 
    // Contraseña para la autenticación SMTP
    $mail->Password = "contrasena";
 
    // El tipo de encriptación que usamos al conectar - ssl (deprecated) o tls
    $mail->SMTPSecure = "ssl";
 
    $mail->From = "mail@dominio.com";
    $mail->FromName = "Tu nombre";
	
	// Esto es lo que soluciona el error de validación
	$mail->SMTPOptions = array(
		'ssl' => array(
			'verify_peer' => false,
			'verify_peer_name' => false,
			'allow_self_signed' => true
		)
	);

}

Custom opengraph image with Yoast SEO

Yoast SEO plugin automatically add the featured image of posts as an image opengraph meta tag. If you want to override or customize this setting, you can make use of filter.

In this case, we needed to display a custom featured image of a taxonomy which is assigned to the tax with a custom field added by ACF plugin.


function my_own_og_function() {

	if(is_tax('tax_name')){
		$tax_name = get_term_by('slug', get_query_var('tax_name'), 'tax_name');
		$img = get_field('image', 'tax_name_'.$tax_name->term_id);
		if($img){
			$GLOBALS['wpseo_og']->image_output( $img['sizes']['large'] );
		}
	}
    
}
add_action( 'wpseo_opengraph', 'my_own_og_function', 29 );

Los beneficios de un certificado SSL para tu tienda WooCommerce

En la mayoría de los casos no es obligatorio disponer de un certificado de seguridad SSL para vender por Internet. Sin embargo, es muy recomendable hacerlo ya que las ventajas de disponer de un certificado SSL para tu tienda online son muchas, tanto a nivel comercial (tu comercio frente a tus clientes) como a nivel técnico (tu comercio frente a Google y tu competencia).

A modo de resumen, estos son los beneficios de contar con un certificado de seguridad SSL en tu tienda:

  • Confianza y seguridad de tus clientes en tu tienda online
  • Mejoras en el posicionamiento web orgánico
  • Reducción del fraude en tu tienda online
  • Imagen más profesional frente a potenciales clientes
  • Protección frente a listas de spam

A nivel de usuario, así es como se indica si una web tiene certificado: ssl-certificado-navegador-https

Nuevo en WooCommerce? Esto es lo que necesitarás para montar tu tienda online

Definir formas de pago

Tienes que decidir qué formas de pago vas a ofrecer. Aquí te resumimos las principales.

Definir métodos de envío

Tienes que ponerte en contacto con una compañía de transportes que ofrezca servicio de envíos para e-commerce. Aquí tienes algunas: Envialia, MRW, SeurASM.

Los envíos se pueden definir de varias formas. La forma más precisa es en base a una tabla de precios de envío por peso y volumen de los productos. La compañía debería de pasarte una tabla que hay que dejar configurada en tu tienda online. Para que esto funcione, deberás introducir el peso y el volumen de cada uno de los productos que quieres vender.

Si no necesitas tanta precisión seguramente te valdrá con tarifas de envío planas. Puedes definir un precio de envío según ciudad, país o continente de origen del usuario que realiza la compra sin tener en cuenta los productos que se compran.

Definir impuestos

WooCommerce permite definir los impuestos de tu tienda. Esto es necesario para mostrar el recuento final de los impuestos al cliente. En la tienda puedes mostrar los productos con o sin impuestos incluidos.