En esta ocasión aprenderemos a colocar un FlipBook en nuestro sitio de WordPress utilizando un Widget Gratuito, Vamos a iniciar con los pasos necesarios para lograr nuestro objetivo
1.- Vamos a nuestro catalogo de Plugins y vamos a buscar uno llamado 3D FLIPBOOK y procedemos a instalarlo 2.- Ya instalado vamos a nuestra pestaña de de medios y vamos a cargar el documento pdf y copiamos el URL 3.- Vamos a la pestaña que se nos agrego la cual se llama 3D FLIPBOOK y vamos a ShortCode Generator 4.- Ponemos la casilla en PDF y pegamos el url que previamente copiamos que era del PDF
Ultimo paso: podemos ver como en la parte superior se va a generar un código, este se puede pegar directamente en el editor de página, o con una etiqueta de html o también en elementor, Adjunto un libro y el video en html para una correcta instalación.
En esta ocasión vamos a aprender a justificar cualquier texto de wordpress, pero normalmente se utiliza para las noticias o los artículos, Son solo 3 pasos los que tenemos que seguir y lo mejor de todo, es que no es necesario instalar ningún plugin.
Primer paso:
Vamos a ubicar un menú en la parte superior y seleccionamos la opción «peronalizar» después vamos a CSS adicional y vamos a crear una clase la cual «llevará un punto al principio» (vean el ejemplo) esta clase puede llevar el nombre que sea en mi caso se llama justificado. abrimos las llaves y ponemos un text-align: justify con punto y coma. de igual forma aquí dejo un texto para que lo copies y pegues en el CSS adicional.
.justificado { text-align: justify; }
Publicamos un vídeo paso a paso para que puedas lograrlo, Saludos.
En la era digital, la comunicación rápida con los clientes es clave para cualquier negocio. Una de las mejores maneras de hacerlo es agregando un botón flotante de WhatsApp en tu página web. En este artículo, te explicaremos paso a paso cómo hacerlo utilizando HTML y CSS.
Beneficios de un Botón Flotante de WhatsApp
Antes de comenzar con el tutorial, veamos por qué deberías considerar agregar un botón de WhatsApp en tu sitio web:
Atención al cliente inmediata: Permite a los visitantes contactarte directamente.
Aumento de conversiones: Facilita el contacto con clientes potenciales.
Integración sencilla: No requiere conocimientos avanzados de programación.
Funciona en móvil y escritorio: Compatible con cualquier dispositivo.
Paso 1: Estructura del HTML
Primero, necesitamos agregar el código HTML para el botón de WhatsApp. Abre tu archivo HTML y agrega el siguiente código dentro del <body>:
Asegúrate de que la imagen del ícono de WhatsApp (whatsapp-icon.png) esté en la carpeta correcta.
Abre tu página web y prueba el botón flotante.
Personalización Adicional
Si deseas personalizar el botón, puedes:
Cambiar el tamaño y color en CSS.
Editar el mensaje predeterminado en la URL del href.
Agregar animaciones con @keyframes para hacerlo más llamativo.
Conclusión
Agregar un botón flotante de WhatsApp a tu página web es una forma sencilla y efectiva de mejorar la comunicación con tus clientes. Con solo unos pocos pasos, puedes facilitar el contacto y aumentar la interacción con los visitantes de tu sitio.
¡Prueba este método y déjanos saber si te fue útil! 🚀
En este post agregaremos un botón de WhatsApp en nuestra página web de HTML
El primer paso es descargar los recursos en el botón verde, es el html y el css del botón, tenemos otro .css que son unos efectos para agregar más adelante.
Y una plantila HTML para hacer pruebas.
El enlace no tiene publicidad.
Ya teniendo descargado el Módulo procemos a agregar el style.css a la carpeta de estilos de nuestra página web, si ya contamos con un style.css, agregarle un 2 al nuevo que vamos a añadir, es decir style2.css.
Ahora vamos al index de del widget y copiamos el siguiente código:
y lo pegamos dentro del html de nuestra página web.
Si deseas aprender a personalizarlo te recomiendo ver este video:
En este vídeo vamos a conectar un formulario con una base de datos MYSQL por medio de php.
El primer paso es descargar xampp el cual es un servidor local desde este enlace: https://www.apachefriends.org/es/index.html
Instalamos y activamos apache y mysql. Ahora vamos a nuestro localhost , phpmyadmin y creamos una BD en mi caso fue EJEMPLO con una tabla llamada datos y con 4 campos:
Nombre varchar (50 caracteres)
Correo varchar (50 caracteres)
Teléfono varchar (50 caracteres)
ID (Primary Key y auto Increment)
Todos van con Varchar o text (si elegimos varchar tenemos que agregar una cantidad máxima de caracteres) en ID ponemos AI que es autoincrement.
ahora vamos a la carpeta donde se instalo XAMPP y ubicamos la carpeta htdocs ahí creamos una carpeta y dentro creamos un index.php.
En el index primero tenemos que realizar la conexión con nuestro documento y nuestra base de datos previamente creada.
Creamos el formulario en html con el mismo numero de datos que creamos en la tabla.
Ahora cada input lo convertimos a variables
ahora con una consulta MYSQL solicitamos que agregue esas variables en la tabla.
(lo mas recomendable es ver el vídeo ya que ahí se explica a detalle.)
En este post aprenderemos a colocar un Widget de un Botón flotante con multples opciones, puede ser para contacto, para redes sociales o ambos, lo primero que debemos de hacer es decargar los recursos del módulo, es un Index.html, un Style.css y un JS.
Lo que primero tenemos que hacer es pasar el css y el js a nuestra carpeta HTML de nuestra página web, si ya tenems un style.css renombramos nuestro archivo, lo mismo con el js, si ya tenemos un archivo que tenga el mismo nombre renombramos.
Ahora abrimos el HTML de nuestro Widget y nuestra página web. pasamos el css y js, pasamos todo el contenido del widget a nuestro index.html de nuestra página web
no olvidar aplicar las referencias y buscar la carpeta de style correctamente
de hecho agrego un video donde explico más a detalle el proceso.
En este post veremos un Widget de un Botón flotante el cual permite a los visitantes comunicarse con multiples asesores dentro de nuestra página web.
el plugin se llama WP Chat App y para instalarlo es necesario ir a la tienda de plugins.
Para encontrarlo más rapido es recomendable buscar WP Chat App y despues apretar CTRL + F y buscar el autor que es NinjaTeam.
Al Instalar y activar, se activa una pestañá llamada WhatsApp entonces solo queda registrar a los asesores que estarán al pendiente de responder y finalmente activarlos en la Subpestaña FLOATING WIDGET
Ya que esten activos, faltaría modificar el texto que esta en ingles, ese igualmente se modifica en Floating Widget.
En este tutorial, aprenderemos un par de trucos simples para usar la expresión de movimiento en Adobe After Effects. El primer truco le permite controlar la expresión de movimiento mediante controles deslizantes, y el segundo truco crea un movimiento de movimiento orgánico más exclusivo que la expresión de movimiento típica.
Antes de sumergirse en los consejos, abra After Effects y agregue una forma o texto al que desee aplicar la expresión de movimiento. De esa manera, puede comenzar a practicar durante el tutorial. Con eso hecho, ¡comencemos!
Para hacer eso, querrá presionar ALT + clic en el cronómetro de su control deslizante de frecuencia y escribir: wiggle (20,30);
Traemos una lista de 5 juegos creados en HTML, listos para descargarlos, editarlos y subirlos a su página web
Nosotros no hicimos los juegos y no nos damos ningún tipo de crédito
Son 5 juegos sin publicidad para que los descargues directamente, para evitar publicidad en futuras publicaciones, por favor apoyanos suscribiendote a nuestro canal de YouTube, igualmente si gustas puedes ver una vista previa de cada uno para que puedas descargar el juego que más te guste.
En este video aprenderemos a colocar una galería totalmente responsiva y con efecto light box en nuestra página web, dejo en claro que el Widget o módulo esta listo para descargar y colocarlo en nuestra página web, entonces vamos directamente con los pasos necesarios, (Al final del artículo hay un video donde explico a detalle cada paso)
Paso número 1: debemos de descargar los recursos para eso debemos darle clic al botón verde «DESCARGA EL MÓDULO».
Paso número 2: debemos te tener 2 carpetas abiertas una es de nuestro módulo y otro de nuestra página en HTML.
Paso número 3: si en nuestra carpeta de HTML ya tenemos un style.css deberemos cambiar el nombre nuestros estilos de la galería yo le puse galeria.css
Paso número 4: Tenemos que pasar el archivo CSS del módulo que descargamos a nuestra página en HTML.
Paso número 5: Ahora viene mi parte favorita incrustar el código para esto debemos de abrir nuestro editor de código en mi caso uso Brackets y abrimos el index.html de nuestro módulo que descargamos y vamos a pasar primero el css a nuestra página web.
Paso número 6: ahora vamos a pasar el js
Paso FINAL:
Agregar la galería en HTML
Paso extra:
No olvides que en el paso 3 probablemente cambiaste el nombre de style.css, si lo hiciste debes de cambiarlo en el código.
De igual forma dejo un video con una explicación a detalle
