Contenido
Puntos clave
- Utiliza el plugin oficial de CompleteGreet para WordPress y WooCommerce. Así no tendrás que modificar directamente los archivos del tema.
- Desde el panel de CompleteGreet puedes decidir en qué páginas aparece el widget, qué aspecto tiene y qué acciones ofrece.
- Antes de publicar, prueba el resultado en móviles reales y revisa las reglas de URL, el proceso de pago, el rendimiento, los formularios y posibles conflictos con la galería o el carrito.
¿Cómo se instala CompleteGreet en WooCommerce?
Instala el plugin oficial de CompleteGreet desde el panel de WordPress y conecta tu cuenta.

En WordPress, abre la sección de plugins y busca CompleteGreet.
Una burbuja de vídeo se añade mediante el plugin. No necesitas modificar header.php ni functions.php.
- Instala y activa el plugin. La documentación oficial de WooCommerce puede ayudarte con dudas generales sobre plugins y la tienda. Para CompleteGreet, sigue el proceso que muestra la versión actual del plugin.
- Abre los ajustes de CompleteGreet en el panel de WordPress.
- Conecta tu cuenta de CompleteGreet y elige la burbuja o la configuración de vídeo shoppable que quieras utilizar.
- Guarda los ajustes.
- Abre la tienda en una ventana de incógnito y prueba la burbuja en una página de producto incluida en tus reglas.
Si tu tienda utiliza un plugin de caché o una CDN, vacía la caché antes de probar. De lo contrario, podrías ver una versión anterior de la página y pensar que la nueva configuración no funciona.
En un alojamiento gestionado, el plugin también es el método de instalación habitual y más seguro.
No modifiques directamente los archivos del tema ni añadas otro plugin para insertar código en la cabecera si el plugin oficial de CompleteGreet ya se ocupa de la instalación. Usar dos métodos a la vez puede cargar el script más de una vez y complicar las actualizaciones.
¿Qué puedes personalizar en WooCommerce?
Una vez conectada la cuenta, puedes controlar la visibilidad, el diseño y las acciones desde el panel de CompleteGreet.

Reglas de páginas y visitantes
Las reglas de URL te permiten mostrar la burbuja en productos, categorías u otras páginas y ocultarla en el carrito o durante el pago.
Comprueba qué condiciones y reglas de audiencia incluye tu plan actual. No des por hecho que existen activadores relacionados con el carrito o los parámetros UTM si no aparecen en la documentación.
Configurar la llamada a la acción
Según la configuración, el botón puede abrir una dirección, un formulario, una reserva, una solicitud de llamada, el chat o una acción de compra.
Adapta los colores y el texto a tu marca y al recorrido concreto del visitante.
Formularios y captación de contactos
CompleteGreet ofrece formularios tradicionales y formularios con varios pasos. Pide solo los datos necesarios y respeta las normas de privacidad y consentimiento que correspondan.
Prueba personalmente la validación, el registro de los datos y las notificaciones.
Identidad visual y posición
Ajusta los colores, la miniatura y la posición. Revisa el espacio respecto a la galería, el carrito, el chat y el aviso de cookies.
Elige una miniatura nítida y fácil de reconocer antes de reproducir el vídeo. Revisa el encuadre de la persona o del producto tanto en ordenador como en móvil. Una imagen recargada o mal centrada hace que la burbuja resulte más difícil de entender.
Estas herramientas de burbujas de vídeo deben probarse con el tema, los plugins y el proceso de pago que utiliza realmente la tienda.
max-width: 600px;
margin: 0 auto;
background: #f7f7fb;
border: 1px solid #e2e2ea;
border-radius: 12px;
padding: 24px;
font-family: -apple-system, BlinkMacSystemFont, “Segoe UI”, Roboto, Helvetica, Arial, sans-serif;
position: relative;
overflow: hidden;
}
#cg-ig-PL7::before {
content: ”;
position: absolute;
top: 0;
left: 0;
right: 0;
height: 4px;
background: #3D5ACE;
}
#cg-ig-PL7 .sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border: 0;
}
#cg-ig-PL7 .ig-header {
text-align: center;
margin-bottom: 24px;
}
#cg-ig-PL7 .ig-title {
font-size: 20px;
font-weight: 700;
color: #1a1a2e;
margin: 0 0 8px 0;
}
#cg-ig-PL7 .ig-subtitle {
font-size: 14px;
color: #7a7a96;
margin: 0;
}
#cg-ig-PL7 .progress-bar {
display: flex;
justify-content: space-between;
margin-bottom: 24px;
position: relative;
}
#cg-ig-PL7 .progress-bar::before {
content: ”;
position: absolute;
top: 14px;
left: 40px;
right: 40px;
height: 2px;
background: #e2e2ea;
z-index: 0;
}
#cg-ig-PL7 .progress-step {
display: flex;
flex-direction: column;
align-items: center;
position: relative;
z-index: 1;
}
#cg-ig-PL7 .step-circle {
width: 30px;
height: 30px;
border-radius: 50%;
background: #3D5ACE;
color: #ffffff;
display: flex;
align-items: center;
justify-content: center;
font-size: 13px;
font-weight: 600;
margin-bottom: 6px;
}
#cg-ig-PL7 .step-label {
font-size: 11px;
color: #4a4a68;
font-weight: 500;
}
#cg-ig-PL7 .steps-container {
display: flex;
flex-direction: column;
gap: 16px;
}
#cg-ig-PL7 .step-card {
background: #ffffff;
border: 1px solid #e2e2ea;
border-radius: 8px;
padding: 16px;
}
#cg-ig-PL7 .step-header {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 12px;
}
#cg-ig-PL7 .step-number {
width: 28px;
height: 28px;
border-radius: 50%;
background: #3D5ACE;
color: #ffffff;
display: flex;
align-items: center;
justify-content: center;
font-size: 12px;
font-weight: 700;
flex-shrink: 0;
}
#cg-ig-PL7 .step-title {
font-size: 15px;
font-weight: 600;
color: #1a1a2e;
margin: 0;
}
#cg-ig-PL7 .step-desc {
font-size: 13px;
color: #4a4a68;
margin: 0 0 12px 0;
line-height: 1.5;
}
#cg-ig-PL7 .code-block {
background: #1a1a2e;
border-radius: 6px;
padding: 12px;
position: relative;
margin-top: 8px;
}
#cg-ig-PL7 .code-text {
font-family: “SF Mono”, Monaco, “Cascadia Code”, “Roboto Mono”, Consolas, monospace;
font-size: 12px;
color: #f7f7fb;
margin: 0;
word-break: break-all;
line-height: 1.4;
}
#cg-ig-PL7 .copy-btn {
position: absolute;
top: 8px;
right: 8px;
background: #E48333;
color: #ffffff;
border: none;
border-radius: 4px;
padding: 4px 10px;
font-size: 11px;
font-weight: 600;
cursor: pointer;
}
#cg-ig-PL7 .cta-section {
margin-top: 20px;
text-align: center;
padding-top: 16px;
border-top: 1px solid #e2e2ea;
}
#cg-ig-PL7 .cta-button {
display: inline-block;
background: #3D5ACE;
color: #ffffff;
text-decoration: none;
padding: 12px 24px;
border-radius: 6px;
font-size: 14px;
font-weight: 600;
}
#cg-ig-PL7 .cta-button:hover {
background: #2d4ab8;
}
#cg-ig-PL7 .source-line {
margin-top: 16px;
font-size: 11px;
color: #7a7a96;
text-align: center;
}
@media (max-width: 480px) {
#cg-ig-PL7 {
padding: 16px;
}
#cg-ig-PL7 .ig-title {
font-size: 18px;
}
#cg-ig-PL7 .step-label {
font-size: 10px;
}
#cg-ig-PL7 .step-title {
font-size: 14px;
}
}
Asistente de configuración de CompleteGreet para WooCommerce en cuatro pasos, desde la instalación hasta la activación.
CompleteGreet para WooCommerce
Configuración en cuatro pasos
Preparar la cuenta de CompleteGreet
Crea tu cuenta y elige la burbuja de vídeo o la configuración de vídeo shoppable que quieras utilizar.
Instalar el plugin
Instala y activa el plugin oficial de CompleteGreet desde el panel de WordPress.
<plugin oficial de CompleteGreet instalado y activado en WordPress>
Conectar la tienda
Conecta tu cuenta de CompleteGreet desde los ajustes disponibles en el plugin.
<cuenta de CompleteGreet conectada>
Activar y configurar
Activa el widget y configura las páginas, el diseño, las acciones y el vídeo desde el panel.
Fuente: documentación de CompleteGreet
Consulta los datos HTML estáticos anteriores para ver todos los detalles.
¿Qué debes comprobar antes de publicar?
Haz pruebas en dispositivos reales y confirma que las reglas de URL solo incluyen las páginas de la tienda que has elegido.
Probar otros dispositivos además del ordenador
Los navegadores de ordenador, iOS y Android pueden mostrar la burbuja de formas distintas. Pruébala en dispositivos reales, no solo en una vista previa. El tamaño, la posición y el botón para cerrarla deben seguir siendo cómodos en una pantalla pequeña.
La reproducción automática con sonido suele estar bloqueada en iOS. Empieza sin sonido o espera a que el visitante realice una acción.
Revisar las reglas de URL
Prueba por separado las direcciones de productos, categorías, carrito y pago. Las rutas de WooCommerce pueden cambiar según la estructura de enlaces permanentes.
Una burbuja visible durante el pago puede molestar a un cliente que solo quiere terminar su compra. Ocúltala en el carrito o en el pago si tapa un campo, un botón o información importante.
Prueba varios tipos de página y revisa tanto las reglas de inclusión como las de exclusión.
Mide también el rendimiento de carga. Una burbuja de vídeo añade recursos a una página de tienda que probablemente ya carga imágenes de productos, scripts del carrito y plugins. Mide una página de producto real antes y después de activar el widget.
Compara la página antes y después de la activación con PageSpeed Insights y las recomendaciones de Google sobre Web Vitals . Mide el cambio real en lugar de prometer una cifra fija.
Comprueba también si existen conflictos visuales con la galería, el visor de imágenes, el panel del carrito o el aviso de cookies. Corrígelos en el tema o pide ayuda técnica.
Los vídeos de producto y el asesoramiento personal pueden ayudar a los clientes de una tienda WooCommerce a entender mejor lo que van a comprar.
Los casos de clientes sirven como referencia, pero sus resultados no se pueden aplicar a todas las tiendas.
Medir el rendimiento
Mide las consultas, las compras, las acciones en el carrito, el tiempo en la página y la velocidad de carga a partir de tus propios datos iniciales.
Un contenido rápido, claro y relevante importa más que una cifra general sobre producción o conversión. Mide la velocidad, los abandonos y las acciones en tu propia tienda en vez de aplicar un porcentaje obtenido en otra web.
Requisitos para la instalación
Necesitas acceso de administrador a WordPress, una versión compatible de WooCommerce y permiso para instalar el plugin de CompleteGreet.
CompleteGreet no necesita compatibilidad general con WebRTC para mostrar burbujas de vídeo pregrabadas.
Antes de añadir un plugin, revisa la documentación actual de WordPress, WooCommerce y tu proveedor de alojamiento.
Calcula la rentabilidad con tus propios márgenes, ventas, contactos cualificados y costes. El número de visitantes no basta para saber si la inversión compensa. Compara un periodo de referencia con una prueba suficientemente larga y ten en cuenta otros cambios realizados en la tienda.
Empieza con unas pocas páginas de producto importantes y amplía el uso cuando tengas datos suficientes para valorar el resultado.
Preguntas frecuentes
¿Cómo añado CompleteGreet sin modificar el código del pago?
Instala el plugin oficial de CompleteGreet para WordPress y WooCommerce. No tienes que modificar directamente el proceso de pago ni los archivos del tema.
¿Por qué la burbuja de vídeo no aparece en la vista previa del tema?
La vista previa puede gestionar de otra forma los scripts externos, la caché o el consentimiento. Prueba la tienda publicada y revisa la conexión del plugin, la caché y la optimización de JavaScript.
¿Puedo mostrar CompleteGreet solo en los productos y ocultarlo en el carrito?
Utiliza las reglas de URL del panel de CompleteGreet para incluir las páginas de producto que quieras y excluir el carrito y el pago. Comprueba las direcciones reales de tu tienda, ya que pueden cambiar según los enlaces permanentes y el idioma.
¿CompleteGreet ralentiza una tienda WooCommerce?
Cualquier widget externo puede influir en el rendimiento, aunque se cargue de forma asíncrona. Mide la tienda real antes y después de activarlo, sobre todo en móvil. Revisa también las imágenes de producto, el tema, la caché y los demás plugins para identificar correctamente la causa de cualquier ralentización.
¿En qué se diferencia el precio de las herramientas que cobran por minuto?
Los planes de CompleteGreet se basan en visitantes únicos y no cobran por separado cada reproducción o minuto de vídeo. Revisa los límites y las condiciones actuales.
¿CompleteGreet es adecuado para una tienda WooCommerce con productos caros?
Las burbujas personales y los vídeos shoppable pueden ayudar a asesorar a los visitantes y presentar mejor los productos. Cada tienda debe medir el efecto en sus propias conversiones.
