Cómo agregar botones CTA a las publicaciones y páginas de WordPress sin código

Es bueno tener mucho mensaje de texto en un sitio que le diga a las personas cuán increíbles son sus productos o qué excelente servicio. Sin embargo, sin algunos medios para que se beneficien fácilmente de esos productos o servicios, podría hablar. Por lo tanto, debe permitir que los visitantes continúen el diálogo, incursionándoles de una acción de cualquier tipo. Aquí viene la luz de los botones de WordPress en el centro de atención. ¿Por qué necesitas botones de acción en WordPress? CTA, o botones de urgencia, alienta a los usuarios a tomar la siguiente acción. Estos pueden ser tan simples como el botón “Comprar ahora” o “Agregar la canasta” para asegurar una venta de inmediato. O podría llevar al visitante a otro contenido concebido para “embudo” en una determinada dirección.
Otros ejemplos de botones CTA incluyen:
Lee mas
Lee ahora
Descargar
Suscríbete a nuestro boletín
Mira en YouTube
Escucha Spotify
Marque esta página
Únete ahora
La ubicación de los botones CTA también es crucial. Por ejemplo, no hay un gran punto en poner un botón “Comprar ahora” al comienzo de una lista de productos, porque las personas no sabrán lo que quiere comprar. Además, la mayoría no estará dispuesta a leer una descripción larga del producto y luego tendrá que volver a comprar para comprarlo; quieren que el botón esté exactamente donde se espera que estén.
Por lo tanto, coloque los botones en el punto lógico de la publicación o página donde es más probable que los usuarios los necesiten. Por ejemplo, los botones del menú principal en un sitio web (que también son CTA) generalmente están en la parte superior de la página, donde la gente espera encontrarlos. Además, el diseño de botones CTA también juega un papel importante en la disponibilidad de usuarios para presionarlos. Deben ser lo suficientemente obvios como para atraer la atención, pero no tan “frente a ti” como para asustar a las personas. Recuerde, a las personas les gusta creer que pueden decidir por su cuenta y no siempre se aprecian “decir” qué hacer. Por lo tanto, sus botones CTA deben reflejar esto. Si tiene botones CTA en su sitio, puede mejorar las conversiones. Pueden tener un impacto masivo cuando están bien diseñados y colocados correctamente. Cómo crear botones en los puristas de WordPress de WordPress puede decirle que debe meterse con su código o CSS para crear botones en su sitio. Si desea estar completamente personalizado, hay un elemento de verdad en él. Sin embargo, si eres como yo y no tienes habilidades de codificación, estarás encantado de descubrir que hay varios métodos alternativos para agregar CTA y otros tipos de botones a WordPress. Ahora les mostraré tres de ellos, ninguno de los cuales requiere conocimiento o experiencia en CSS o código.
La opción 1-Usación de Gutenberg Gutenberg es el editor de bloques que WordPress introdujo en la versión 5 de la plataforma a fines de 2018 para reemplazar el editor clásico. Al igual que con cualquier cosa completamente nueva, Gutenberg recibió críticas mixtas, las negativas que provenían primero de personas que se habían acostumbrado al editor clásico. Sin embargo, está aquí para quedarse y una vez que lo familiariza, el regreso al editor clásico parece arcaico. El artículo continúa a continuación
Gutenberg incluye varios “bloques” útiles que agrega al contenido para hacer varias cosas. Por supuesto, los botones están incluidos, y la adición de uno es un juego infantil:

Paso 1 primero, debe insertar un nuevo bloque en su publicación o página donde desea que aparezca el botón. Para hacer esto, presione ENTER (puede reorganizar los bloques más tarde, si es necesario, utilizando las flechas arriba/abajo que aparecen en la herramienta mini-soporte, que están por encima de los bloques):
Paso 2 Ingrese una barra oblicua ( /) en el “tipo / para elegir un bloque”: generalmente aparecerá una lista de bloques utilizados. En mi caso, la opción de bloquear los botones apareció en la parte superior, pero puede escribir /botones para ver solo las opciones disponibles para los botones:
Paso 3 Elija “Botones”. Se insertará automáticamente un nuevo campo de botón. Presione el icono de la rueda en la parte superior derecha de la pantalla para llamar al editor de bloques para que pueda configurar el botón:


Paso 4 Doble Haga clic en el botón para ingresar el texto que desea contener:

Luego use las opciones en el editor de bloques a la derecha de la pantalla para cambiar los colores de los botones, los contornos, el tamaño, la forma, etc.

Paso 5 Para colocar el botón, use las opciones en la barra de herramientas flotantes: Paso 6 Ahora tiene que agregar el hipervínculo al que indica el botón. El enlace puede ser a una dirección web externa o interna que conduce a otra página o publique en su sitio web.

Haga clic en el botón de enlace en la barra de herramientas flotantes, ingrese la URL en el campo URL y presione la flecha curva al lado.

El artículo continúa a continuación


Paso 7 ¡Ahora has creado tu botón! Puede ver cómo se verá una vez publicado utilizando la opción Vista previa. Cualquier ajuste necesario para el tamaño, la posición, el color, etc. se puede hacer repitiendo los pasos 4 y 5:
Opción 2: el uso del elemento elemental es un complemento popular del editor visual, que facilita la creación de páginas y publicaciones, debido al sorteo y el lugar. Crear botones en el elemento es como Gutenberg, aunque ofrece más posibilidades de estilo y personalización, especialmente si tiene un Elementor Pro.

Aquí hay una breve presentación general de la forma de agregar un botón simple a una publicación o página usando el elemento: Paso 1 Llame al menú del widget en el lado izquierdo del editor elemental y escriba “botón” en la barra de búsqueda. Aparecerán widgets disponibles para botones (algunos solo serán accesibles si tiene una suscripción de Elementor Pro). Dibuje el widget del botón deseado y colóquelo en el bloque que desea ubicar:


Paso 2 El menú en el lado derecho de la pantalla ahora debe parecerse al “botón de edición” con todas las opciones de configuración del botón. Si no es así, simplemente haga clic en el botón recién creado para acceder a ese menú.

Paso 3 Cambie el texto del botón escribiendo en el campo “Texto”. Los cambios que realice se reflejarán en tiempo real en el botón: Paso 4 Ingrese el hipervínculo requerido en el campo “Enlace”. Tenga en cuenta que si hace clic en el icono de la rueda pequeña, aparecerán algunas opciones adicionales:
Paso 5 Stile su botón Uso de las diferentes opciones en las pestañas “Contenido” y “Sty” en el menú “Botón Editar”:

Paso 6 Cuando esté satisfecho con su botón, puede continuar creando el resto de su página o publicar agregando nuevos bloques. Opción 3: uso de un complemento (MaxButtons) Si desea más opciones para botones, incluidos prefabricados, un complemento de WordPress como MaxButtons es una buena opción.
El artículo continúa a continuación

MaxButtons es un complemento Freemium que, incluso en su forma gratuita, ofrece una excelente flexibilidad en el diseño de los botones gracias a un editor de súper junto. Una versión profesional que ofrece aún más opciones está disponible desde $ 24 por año. Obtén a MaxButton aquí


Imagen a través de la amabilidad de MaxButtons.com Aquí están los pasos para agregar MaxButtons a WordPress y su uso para crear CTA Jazzy y otros tipos de botones: Paso 1 en el tablero de WordPress, seleccione “Plugins” en el menú izquierdo y luego haga clic en ” Agregar nuevo “. Luego escriba “MaxButtons” en la barra de búsqueda que aparecerá en la pantalla “Agregar complemento”:

Paso 2 Encuentre el complemento “MaxButtons” en los complementos que WordPress sugiere y presione “Instalación ahora”:

Paso 3 Después de completar la instalación del complemento, el botón “Instalación ahora” se cambiará a “activación”. Presione para activar el complemento MaxButtons:

Paso 4 Aparecerá un nuevo artículo en el menú izquierdo titulado “MaxButtons”. Haga clic para mostrar el tablero MaxButtons y mostrar el submenú desplegable: Paso 5 está listo para crear botones usando MaxButtons. Comience presionando “New Add”, ya sea en el submenu maxbuttons o en el tablero maxbuttons:

Paso 6 Ahora verá las opciones de configuración y personalización para su botón. Este paso cubre la configuración básica que necesita para crear una simple. En primer lugar, debe darle al botón un nombre memorable, que lo ayudará si tiene que usar el mismo nombre en el futuro. A continuación, debe agregar el hipervínculo al lugar donde indicará, que puede ser una URL externa, o puede usar el botón “Seleccionar contenido del sitio” para vincular otras partes de su sitio, también debe agregar el Texto de CTA que desea en el botón. Además, si lo desea, opcionalmente puede agregar un “globo explicativo” (texto explicativo que aparece cuando los usuarios pasan con el mouse sobre el botón):

Paso 7 Si lo desea, puede jugar con las otras opciones de personalización para que el botón se vea exactamente como desee. Notará que la vista previa en el lado derecho de la pantalla muestra los cambios que realiza al botón de tiempo real:

Paso 8 Otra configuración avanzada está disponible para ajustar el botón para que coincida con ciertos tipos de dispositivos móviles (suponiendo que su tema sea receptivo). Se accede presionando la opción “+ Agregar para móvil” y eligiendo el preajuste apropiado. Puede crear múltiples perfiles para diferentes tipos de dispositivos:

Paso 9 Cuando esté satisfecho con su botón, presione “Guardar”. Aparecerá un cuadro amarillo que contenga un código corto que puede usar para incorporar su nuevo botón donde quiera en el contenido de su sitio, así que copie: Tenga en cuenta que presionando las flechas pequeñas junto a “Vista previa” cierre el botón Vista previa y presionando el Botón y presionando el Uno de “Cómo facilitar su vida” le ofrece varias alternativas útiles que puede usar:

Paso 10 Para agregar el botón a sus páginas o publicaciones, simplemente ingrese el código corto desde el paso anterior donde quiera el botón. Por ejemplo, aquí uso el bloque “Código de corto” en Gutenberg para insertar el botón:

Paso 11 Ahora puede guardar y obtener una vista previa de la publicación o página para ver el botón en acción:

Paso 12 para ver una lista de todo el