Cómo agregar botones de llamada a la acción en WordPress (sin código)

¬ŅDesea agregar botones de llamada a la acci√≥n en sus publicaciones o p√°ginas de WordPress?

Los botones son una excelente manera de aumentar las conversiones. Son muy notables, lo que los hace excelentes para redirigir la atención del usuario a una interacción deseada.

Por ejemplo, puede usar un botón de llamada a la acción para navegar a los usuarios a una página transaccional como la página de precios, la página de productos, la página de servicios y otras en su sitio web.

También puede usar los botones de llamada a la acción para promocionar ofertas especiales, nuevos productos o enlaces de afiliados que apuntan a sitios web asociados.

En este art√≠culo, le mostraremos c√≥mo agregar f√°cilmente hermosos botones de llamada a la acci√≥n en WordPress sin escribir ning√ļn c√≥digo.

Agregar botones en WordPress paso a paso

Nota: Este artículo es para agregar botones personalizados de llamada a la acción en WordPress. Si desea agregar botones para compartir en redes sociales, consulte nuestra guía sobre cómo agregar botones para compartir en redes sociales en WordPress.

Agregar botones en publicaciones y p√°ginas de WordPress (paso a paso)

WordPress hace que sea muy f√°cil agregar botones con un bloque integrado de “botones”.

Es una nueva característica introducida en WordPress 5.0, junto con el nuevo editor de bloques Gutenberg WordPress.

En este artículo, le mostraremos tres formas diferentes de agregar botones de llamada a la acción en publicaciones y páginas de blogs de WordPress. Puede elegir la solución que mejor se adapte a sus necesidades.

Siéntase libre de usar la tabla de contenido a continuación para navegar fácilmente por este artículo.

Tabla de contenido:

  1. Agregar botones en publicaciones / p√°ginas de WordPress usando el editor predeterminado
  2. Crear un botón de WordPress en el Editor clásico
  3. Agregar un botón de hacer clic para llamar en WordPress

Video Tutorial

Suscríbase a WPBeginner

Si no le gusta el video o necesita m√°s instrucciones, contin√ļe leyendo.

Agregar botones en publicaciones / p√°ginas de WordPress usando el editor predeterminado

Este método es más fácil y recomendado para la mayoría de los usuarios. Utiliza el bloque de botones incorporado en el nuevo editor de WordPress. Si todavía está utilizando el editor clásico más antiguo, puede pasar a la siguiente sección.

Primero, debe crear una nueva publicación o editar una existente donde desee agregar un botón.

En la pantalla de edici√≥n de publicaciones, haga clic en el √≠cono “+” para agregar un nuevo bloque y seleccione el bloque de botones en la secci√≥n Elementos de dise√Īo.

Agregar bloque de botones en WordPress Block Editor

A continuación, debería poder ver el bloque de botones agregado al editor de contenido

Bloque de botones agregado al editor de publicaciones de WordPress

Simplemente haga clic en el √°rea “Agregar texto …” e ingrese el texto del bot√≥n.

Despu√©s de eso, debe pegar la URL de la p√°gina que desea vincular en el campo “Pegar URL o escribir para buscar” debajo del bot√≥n.

Una vez hecho esto, haga clic en el icono Aplicar.

Ingrese el texto del botón y el enlace en WordPress

Si desea mostrar el botón en el centro, puede hacer clic en el icono Alinear al centro en la barra de herramientas de bloque de arriba.

Alinee Centre Your Button en WordPress Block Editor

A continuación, puede personalizar el estilo de su botón, cambiar el color de fondo y cambiar el color del texto desde el panel de configuración del bloque en el lado derecho.

Elija el estilo del botón en la configuración de bloque de WordPress

Hay tres estilos de botones que puede elegir: predeterminado, contorno y cuadrado. Puede probar cada uno haciendo clic en ellos y elegir el que se vea mejor.

La sección Configuración de color incluye cinco variaciones de color tanto para el fondo del botón como para el texto del botón. No solo eso, sino que también puede usar un color personalizado de su elección haciendo clic en la opción Color personalizado.

Elija el color personalizado de su botón de WordPress

Una vez que est√© satisfecho con el dise√Īo del bot√≥n, puede guardar su publicaci√≥n o publicaci√≥n para ver una vista previa en vivo.

Así es como se veía en nuestro sitio web de demostración.

Vista previa del botón de WordPress

Prima: Si quieres ver qué tan bien funcionan tus botones, entonces debes usar MonsterInsights. Tiene un seguimiento de eventos incorporado para enlaces de afiliados, enlaces salientes y eventos personalizados, para que pueda ver qué tan bien están funcionando sus botones. Para obtener más detalles, consulte las métricas de marketing importantes que debe rastrear en WordPress.

Crear un botón de WordPress en el Editor clásico

Aunque el editor de bloques Gutenberg es m√°s r√°pido y f√°cil, muchos usuarios a√ļn prefieren el antiguo editor cl√°sico de WordPress. Si usted es uno de ellos, entonces necesita encontrar una soluci√≥n alternativa para agregar botones en su sitio de WordPress.

Hay principalmente tres opciones disponibles para agregar botones en el Editor cl√°sico de WordPress.

  1. Botón Agregar en WordPress con código HTML / CSS.
  2. Agregar botón en WordPress con el complemento de código corto de botón de WordPress.
  3. Agregue el botón en WordPress sin usar códigos cortos.

De las tres opciones, la primera es el método de codificación. Deberá escribir código HTML / CSS y agregarlo a su sitio web donde necesite un botón. No es amigable para principiantes.

La segunda opción es el método más utilizado. Esto se debe a que la mayoría de los complementos de botones de WordPress proporcionan códigos cortos para agregar botones.

La tercera opción es la mejor porque le permite agregar fácilmente botones a sus publicaciones y páginas sin tener que recordar shortcode.

Echemos un vistazo a cómo agregar botones en WordPress sin usar códigos cortos.

Lo primero que debe hacer es instalar y activar el complemento Olvidar botones de código corto. Para obtener más detalles, consulte nuestra guía paso a paso sobre cómo instalar un complemento de WordPress.

Una vez que haya activado el complemento, cree una nueva publicación o edite una existente. En el editor, verá un nuevo botón en el Editor visual llamado Insertar botón.

Insertar icono de botón en el editor clásico de WordPress

Para insertar un nuevo bot√≥n en su publicaci√≥n, debe hacer clic en el bot√≥n Insertar. Aparecer√° una ventana emergente donde puede dise√Īar su nuevo bot√≥n.

Introduzca el texto del botón y la URL en el Editor clásico

Primero, debe agregar el texto del botón y la URL. A medida que agrega el texto de su botón, puede ver una vista previa en vivo en el cuadro a continuación.

A continuaci√≥n, puede agregar la etiqueta nofollow a su enlace y abrir el enlace en una nueva pesta√Īa haciendo clic en las opciones de la casilla de verificaci√≥n a continuaci√≥n.

Despu√©s de eso, puede seleccionar un icono para su bot√≥n. Si hace clic en la pesta√Īa Iconos, podr√° ver los iconos que puede agregar antes o despu√©s del texto en sus botones.

Agregar icono a su botón en el Editor clásico

Estos íconos son en realidad fuentes de íconos (aprenda a usar fuentes de íconos en el editor de publicaciones de WordPress).

A continuación, puede elegir el color del texto y el color de fondo para su botón haciendo clic en el icono del cuadro Color.

Cambiar el color de fondo del botón en WordPress Classic Editor

Despu√©s de eso, haga clic en el men√ļ desplegable para elegir el estilo del bot√≥n. Hay ocho estilos de botones diferentes listos para usar.

Elija un estilo de botón en el editor clásico de WordPress

Del mismo modo, tambi√©n puede elegir el tama√Īo del bot√≥n de extra peque√Īo a extra grande.

Una vez que esté satisfecho con el aspecto, simplemente haga clic en el botón Actualizar.

Podrá ver su botón como aparecería en su publicación, justo dentro del editor de publicaciones.

También puede establecer la alineación de los botones simplemente seleccionando el texto del botón y utilizando los botones de la barra de herramientas en el editor clásico.

Centro Alinee su botón en el Editor clásico

Al hacer doble clic en el botón, aparecerá la ventana emergente Insertar botón, y puede volver a editar su botón si lo desea.

Una vez que est√© satisfecho con su dise√Īo, puede publicar o actualizar su publicaci√≥n y verla en acci√≥n. As√≠ es como apareci√≥ el bot√≥n de fantas√≠a en nuestro sitio web de demostraci√≥n de WordPress.

Vista previa del botón: editor clásico incorporado

Agregar un botón de hacer clic para llamar en WordPress

Además de los botones habituales de llamada a la acción, también puede agregar botones de hacer clic para llamar en su sitio web para aumentar las oportunidades de venta y las conversiones.

Un botón de hacer clic para llamar es un tipo específico de botón de llamada a la acción que permite a los usuarios hacer una llamada telefónica a su equipo con solo un toque.

Usando los botones para llamar, los visitantes de su sitio pueden hablar instantáneamente con su equipo en persona y obtener la información que necesitan. Ya sea que debata una solicitud de cotización, información de preventa o un problema de soporte, las llamadas telefónicas son rápidas.

A medida que aumenta el n√ļmero de usuarios de tel√©fonos inteligentes, agregar botones de llamar ahora es a√ļn m√°s relevante hoy en d√≠a.

Si no tiene un tel√©fono de empresa, entonces puede considerar obtener un n√ļmero de tel√©fono de empresa virtual.

Dicho esto, echemos un vistazo a cómo agregar botones de clic para llamar en WordPress paso a paso.

Lo primero que debe hacer es instalar y activar el complemento WP Call Button. Para obtener instrucciones detalladas, puede ver nuestra guía paso a paso sobre cómo instalar un complemento de WordPress.

Tras la activaci√≥n, debe visitar Configuraci√≥n ¬ĽBot√≥n de llamada WP p√°gina para configurar los ajustes del complemento y dise√Īar su bot√≥n de hacer clic para llamar.

Configuración del botón de llamada fija en WordPress

Al principio, verá la configuración del botón de llamada fija. El botón de llamada fija es una función de conversión optimizada que mueve el botón de llamada junto con los usuarios mientras navegan por su sitio.

Puede comenzar activando el estado del botón Llamar ahora. Simplemente haga clic en el interruptor de alternar para activar eso.

Despu√©s de eso, debe ingresar su n√ļmero de tel√©fono. WP Call Button tiene un campo de n√ļmero de tel√©fono inteligente con el c√≥digo de su pa√≠s. Simplemente seleccione su pa√≠s e ingrese el n√ļmero de tel√©fono de su empresa.

Si no tiene un n√ļmero comercial, puede obtener uno de Nextiva. Es un proveedor de VoIP empresarial de confianza.

A continuación, puede editar el texto del botón de llamada, elegir la posición del botón de llamada y el color.

Además, puede seleccionar dónde mostrar el botón de llamada fija en su sitio web. Por defecto, muestra el botón de llamada en todas las páginas y en todos los dispositivos. Puede elegir mostrar u ocultar el botón en ciertas páginas y mostrar solo en dispositivos móviles.

Una vez que revise todas las opciones, puede hacer clic en el botón Guardar cambios en la parte inferior. Después de eso, puede visitar su sitio web y ver el botón de llamar ahora en acción.

WordPress Click to Call Button

Además de los botones de llamada fijos, también puede agregar botones de llamada estáticos en sus páginas, publicaciones y barras laterales de WordPress usando este complemento.

Si está utilizando el nuevo editor de bloques de WordPress, puede agregar fácilmente el botón Llamar ahora en sus páginas utilizando el bloque Botón de llamada WP.

Cree una nueva página o edite una página existente y agregue el bloque del botón de llamada WP en el editor de su página.

Agregar bloque de botón de llamada WP en WordPress

Despu√©s de eso, puede personalizar el texto del bot√≥n, el color del bot√≥n, el color del texto, el tama√Īo de fuente y mostrar u ocultar el icono del tel√©fono.

Personalizar el botón de llamada en el editor de páginas de WordPress

Una vez que est√© satisfecho con su dise√Īo, puede publicar o actualizar su p√°gina.

Si est√° utilizando el editor cl√°sico de WordPress, debe usar el generador de bot√≥n de llamada est√°tico para obtener un c√≥digo corto. Ir Configuraci√≥n ¬ĽBot√≥n de llamada WP y haga clic en el men√ļ del bot√≥n de llamada est√°tica en la parte superior.

Botones de llamada estática en la configuración de WordPress

Simplemente personalice las opciones del botón y luego copie el shortcode. Después de eso, puede usar el shortcode en cualquier publicación o página de su sitio web.

El complemento WP Call Button también le permite agregar el botón de llamada en su barra lateral de WordPress y otras áreas listas para widgets.

Simplemente ve a Apariencia ¬ĽWidegts y arrastre el widget WP Call Button a un √°rea preparada para widgets donde desea mostrar el bot√≥n de llamada.

Widget de la barra lateral del botón de llamada de WordPress

Ahora puede agregar un título, una descripción y personalizar el botón de llamada desde la sección Configuración avanzada. Una vez hecho esto, guarde su widget.

¡Eso es! Si desea ver un tutorial más detallado, puede consultar nuestra guía paso a paso sobre cómo agregar un botón de clic para llamar en WordPress.

Consejo adicional para agregar botones personalizados en WordPress

Si desea agregar botones de llamada a la acci√≥n completamente personalizados en WordPress, es probable que est√© buscando una soluci√≥n que tambi√©n le permita agregar secciones personalizadas, as√≠ como botones personalizados en el encabezado, los men√ļs y otras √°reas de su sitio web.

En ese caso, recomendamos usar un complemento de generador de p√°ginas de arrastrar y soltar WordPress como Beaver Builder o Divi.

Estos creadores de páginas lo ayudarán a crear páginas de destino personalizadas con elegantes botones de llamada a la acción exactamente como lo desee.

Hagas lo que hagas, es importante que hagas un seguimiento del rendimiento de tus botones porque adivinar no es la mejor estrategia de crecimiento empresarial.

Recomendamos usar MonsterInsights. Tiene un seguimiento de eventos incorporado para enlaces de afiliados, enlaces salientes y eventos personalizados, para que pueda ver qué tan bien están funcionando sus botones. Para obtener más detalles, consulte las métricas de marketing importantes que debe rastrear en WordPress.

Esperamos que este art√≠culo te haya ayudado a aprender c√≥mo agregar botones en WordPress f√°cilmente. Tambi√©n es posible que desee ver nuestra lista de los mejores complementos de WordPress y los mejores servicios de marketing por correo electr√≥nico para peque√Īas empresas.

Si te gustó este artículo, suscríbete a nuestro canal de YouTube para ver videos tutoriales de WordPress. También puedes encontrarnos en Twitter y Facebook.