boton de whatsapp sin plugin

boton de whatsapp sin plugin

boton de whatsapp, este fragmento de codigo html va en en el archivo header.php de tu theme de wordpress y la propiedad target _blank para abrir en una nueva pestaña

HTML
//boton flotante Audra
<a href="https://wa.me/51916151112?text=Hola,  necesito informacion" class="floating-whatsapp-button" target="_blank">
  <i class="fa fa-whatsapp"></i>
</a>

//fin boton fltoante Audra

para los estilos se necesita crear un archivo CSS nuevo en tu tema de WordPress, por ejemplo «floating-button.css» y subelo a tu servidor en la carpeta «wp-content/themes/tu-tema-actual/css_audra»

CSS
.floating-whatsapp-button {
    background-color: #25D366;
    color: #fff;
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 9999;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    text-align: center;
    box-shadow: 2px 2px 3px #999;
    transition: all 0.2s ease-in-out;
}

.floating-whatsapp-button i {
    font-size: 24px;
    line-height: 50px;
}

.floating-whatsapp-button:hover {
    transform: scale(1.1);
}

boton de whatsapp sin plugin
boton de whatsapp sin plugin

Incluye el archivo «floating-button.css» en tu tema de WordPress, agregando el siguiente código en el archivo functions.php de tu tema:

PHP
function enqueue_floating_button() {
   wp_enqueue_style( 'floating-button', get_template_directory_uri() . '/css_audra/floating-button.css' );
}
add_action( 'wp_enqueue_scripts', 'enqueue_floating_button' );

Asegurate de que la ruta sea la correcta, tambien te recomiendo instalar el plugin de Font Awesome y asi tendras todo su repertoerio de iconos sin la necesidad de instalar el CDN o importar los archivos.

como incluir el cdn de Font Awesome?

incluir Font Awesome en la sección head de tu documento HTML, como se muestra

HTML
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css">

boton de whatsapp

boton de whatsapp

estos codigos son fueron utilizados para crear el boton flotante que ves en la pagina simple y sencillo de implementar.

Tabla de Contenido

Contenido Adicional

Tipos de variables
Programacion
Ego Cañari Torres

Tipos de variables

JavaScript tiene los siguientes tipos de variables: Ejemplo: Java tiene los siguientes tipos de variables: Ejemplo: Además, en Java existen los arreglos y los objetos, los cuales pueden almacenar múltiples valores y tienen características específicas. Ejemplo: En C#, los tipos

Leer más »
text
Desarrollo web
audra

DOM y Eventos con JavaScript

El fascinante mundo del DOM y los eventos en JavaScript Si eres un desarrollador web, es muy probable que hayas escuchado hablar del DOM y los eventos en JavaScript. Pero, ¿qué son realmente y por qué son tan importantes en

Leer más »
Drácula de Bram Stoker
Terror
Eylen Almendra Ortiz Perez

Drácula de Bram Stoker

Resumen «Drácula» de Bram Stoker es una novela gótica y de terror que sigue la historia del conde Drácula, un vampiro inmortal que busca expandir su dominio y sembrar el terror en el mundo humano. La novela está escrita en

Leer más »
yfinace-python
finanzas
Ego Cañari Torres

yfinance python

Yfinance es una librería en Python que permite descargar información financiera, incluyendo precios históricos y datos actuales, desde la plataforma Yahoo Finance.

Leer más »
Imagen de La Casa Matusita en Lima, Perú, un lugar misterioso con una rica historia de leyendas urbanas y fenómenos paranormales.
Historias de terror
audra

La escalofriante historia de La Casa Matusita en Perú

¡Bienvenidos, amigos, a una de las historias más escalofriantes de Perú! Hoy vamos a adentrarnos en los misterios y leyendas que rodean a la famosa Casa Matusita, un lugar que ha aterrorizado a los valientes que se han atrevido a

Leer más »

4 respuestas a “boton de whatsapp sin plugin”

  1. I have been browsing online more than three hours today,
    yet I never found any interesting article like yours.
    It is pretty worth enough for me. Personally, if all website owners and bloggers made good content as you
    did, the internet will be a lot more useful than ever before.

  2. I was overjoyed to discover this website on Bing; it was just what I was looking for, and I have also bookmarked it to my favorites collection.

  3. Noodlemagazine Nice post. I learn something totally new and challenging on websites

  4. Noodlemagazine This is really interesting, You’re a very skilled blogger. I’ve joined your feed and look forward to seeking more of your magnificent post. Also, I’ve shared your site in my social networks!

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *