WP Manifestindependent plugin directory
manifest / social / boton-whatsapp-secillo

WhatsApp Button Custom

Botón de WhatsApp circular personalizable desde el admin, con mensaje predefinido.

by Daniel Diaz Tag Marketing · github.com/daniels35/boton-whatsapp-secillo

★ 0stars

Install

Download source zip No release zip yet

This is the repository archive. It installs, but the folder name will carry the branch suffix and updates will not flow.

Install straight from GitHub with WP-CLI:

wp plugin install https://github.com/daniels35/boton-whatsapp-secillo/archive/refs/heads/main.zip
No built-in updater. New versions won't appear under Dashboard → Updates. Install new releases yourself, or let Git Updater track the repository.
Readme github.com/daniels35/boton-whatsapp-secillo ↗

Botón flotante de contacto directo para WordPress.

Este plugin ligero añade un botón de WhatsApp circular y personalizable en la esquina inferior derecha de tu sitio web. Diseñado para captar leads rápidamente, permite a los usuarios iniciar una conversación con un mensaje predefinido. Incluye un panel de administración con vista previa en tiempo real.

📋 Características Principales

🎨 Personalización Visual

  • Colores y Tamaño: Ajusta el color de fondo, el color del ícono y el tamaño del botón (en píxeles) para que coincida con la identidad de tu marca.
  • Mensaje Predefinido: Configura un texto inicial (ej. "Hola, estoy interesado en...") que aparecerá automáticamente en el chat del usuario al hacer clic.

🛠️ Panel de Administración (Backend)

  • 👀 Vista Previa en Vivo: La página de configuración incluye un script que muestra instantáneamente cómo se verá el botón a medida que cambias los valores, sin necesidad de guardar para ver el resultado.
  • Selector de Color Nativo: Integra wp-color-picker para una selección de colores fácil y precisa dentro de WordPress.

📱 Experiencia de Usuario (Frontend)

  • ✨ Animaciones Suaves: Efecto de entrada (Fade-In) al cargar la página y animación de escala/sombra al pasar el cursor (Hover).
  • 📱 Diseño Responsivo Inteligente: Detecta dispositivos móviles y ajusta automáticamente la posición vertical (bottom) para no interferir con barras de navegación inferiores nativas del navegador.
  • 🚀 Ligero: Utiliza FontAwesome vía CDN para el ícono y no requiere librerías pesadas.

⚙️ Configuración

  1. Ve al menú de WordPress: Ajustes > WhatsApp Button.
  2. Número de WhatsApp: Ingresa el número con código de país (ej. 573001234567).
  3. Color de fondo: Elige el color del círculo (por defecto verde WhatsApp: #25D366).
  4. Tamaño: Define el diámetro en píxeles (ej. 60).
  5. Mensaje: Escribe el texto de saludo inicial.

📂 Estructura del Plugin

  • includes/admin-settings.php: Lógica de la página de opciones y campos de configuración.
  • assets/js/admin-preview.js: Script para la previsualización dinámica en el backend.
  • assets/js/frontend.js: Efectos visuales de carga en el sitio público.
  • assets/css/style.css: Estilos del botón flotante, animaciones y media queries.
  • whatsapp-button.php: Archivo principal, carga de scripts y renderizado del HTML en el footer.

🚀 Instalación

  1. Sube la carpeta del plugin al directorio /wp-content/plugins/.
  2. Activa el plugin desde el panel de WordPress.
  3. Configura tu número y estilos en la página de ajustes.

Versión: 1.2 Desarrollado por: Daniel Diaz - Tag Marketing Digital Tecnología: WordPress API, jQuery, FontAwesome.