Cómo agregar botones en WordPress: Mejore sus botones de WordPress con PostX
Publicado: 2023-05-17El bloque de botones de WordPress es un bloque poderoso para WordPress que lleva la personalización de botones a un nivel completamente nuevo. Con una amplia gama de opciones y funciones, le permite crear botones llamativos e interactivos que atraen a los visitantes de su sitio web. Entonces, ¿cómo agregar botones en WordPress?
Use los siguientes pasos para usar botones en WordPress
- Instalar PostX
- Agregar bloque de botón PostX
- Agregar enlaces en el botón de WordPress
- Personaliza el bloque de botones
Hoy exploraremos los aspectos más destacados del bloque de botones PostX, cómo agregar botones en WordPress usando PostX. Sin más preámbulos, comencemos.
Cómo agregar botones en WordPress
Ahora, explicaremos cómo agregar botones a los sitios de WordPress. Siga esta guía paso a paso y podrá agregar el botón de WordPress perfecto en su sitio web.
Videotutorial
Aquí hay un video tutorial para agregar el botón de WordPress a su sitio web.
Paso 1: Instalar PostX
Para desbloquear las potentes funciones de PostX y aprovechar sus funciones, debe instalar el complemento.
Para instalar y activar el complemento PostX Gutenberg Blocks:
- Vaya a Complementos → Agregar nuevo.
- Busque "PostX".
- Haga clic en Instalar y luego en Activar.
Obtener PostX Pro ¡para desbloquear todas las funciones interesantes y crear sitios web increíbles !
Ahora está listo para mejorar su sitio web con los botones de WordPress.
Paso 2: Agregar bloque de botones PostX
Hemos completado la instalación de PostX. Y los botones ahora están disponibles para su uso junto con su personalización extendida. Entonces, sin más preámbulos, le mostraremos cómo agregar botones en WordPress.
Primero, necesitas ir a una página. Puede ir a la opción de página de WordPress y hacer clic en Agregar nuevo para crear una nueva página. Luego, busque "Grupo de botones" para seleccionar este bloque. Y esto agregará el botón de WordPress a la página.
Paso 3: Agregar enlaces en los botones de WordPress
Hipervincular un botón o, en términos simples, agregar enlaces en los botones de WordPress es fácil.
Primero debe seleccionar el botón y seleccionar los textos que desea vincular. Ahora, verá la información sobre herramientas predeterminada de WordPress. En la información sobre herramientas, verá la opción "Enlace" con el icono de hipervínculo. Simplemente haga clic en él para abrir el cuadro de URL y allí agregue el enlace deseado para agregar enlaces en el botón.
Paso 4: personaliza el bloque de botones
Una vez que selecciones el bloque, verás todas las opciones de personalización en la barra lateral derecha.
Hay dos tipos de configuraciones para este bloque. Como puede agregar varios botones, este bloque tiene configuraciones separadas para "Botón" y "Grupo de botones".
Te mostraremos todas las opciones de personalización y cómo usarlas.
Configuración de personalización para un solo botón
Para seleccionar y abrir la configuración del botón, debe hacer clic en el botón.
Estilo
Primero, haga clic en el botón para obtener su opción de personalización. La primera configuración que verá son las opciones de estilo. Actualmente, tiene 4 opciones de estilo. Puede elegir el que mejor se adapte al diseño de su sitio.
Tamaño del botón
La siguiente opción que obtendrá es cambiar el tamaño del botón. Obtendrá Pequeño, Mediano, Grande, Extragrande y Personalizado de forma predeterminada. Obtendrá el tamaño de botón predeterminado si selecciona la opción de tamaño Pequeño, Mediano, Grande o Extragrande.
Pero si desea personalizar completamente el tamaño del botón, puede hacerlo seleccionando "Personalizado" y ajustando su parte superior, derecha, inferior e izquierda para establecer medidas horizontales y verticales.
Aquí hay una perspectiva visual de diferentes estilos de botones.
Texto
Luego, obtendrá la configuración de texto. Esto le permitirá personalizar el texto del botón según sus necesidades. Verá la configuración de "Tipografía de texto", "Color de texto" y "Color de desplazamiento de texto".
Si expande la configuración de Tipografía de texto, puede cambiar el tamaño de la fuente (totalmente personalizable), seleccionar fuentes (incluidas las fuentes personalizadas) , el peso de la fuente, la altura, el espaciado, la decoración del texto y los estilos de texto, y transformarlo a mayúsculas, minúsculas y titulo del caso.
Aquí hay una perspectiva visual del efecto de desplazamiento.
Fondo
Esta configuración le permitirá personalizar todos los fondos de este bloque de botones.
Primero, puede configurar el botón Margen, que es totalmente personalizable, para obtener la ubicación horizontal y vertical perfecta.
Luego puede cambiar los colores de los botones, tanto sólidos como degradados. Haga clic en cada uno para abrir la paleta de colores.
Después de eso, puede ajustar el borde de este botón. Esta configuración incluye estilos de borde (3 estilos prefabricados), ancho de borde y color.
Y también, ajuste el radio del borde del botón seleccionado.
Además, obtendrá la configuración Box Shadow. Expandirlo le permitirá ajustar "Offset-X", "Offset-Y", "Blur" y "Spread".
Además, puede establecer el color de la sombra. Y obtendrá el interruptor "Insertar" si desea que el botón sombree hacia adentro en lugar de hacia afuera.
Icono
La última configuración que obtendrá en la configuración de los botones es la configuración del icono. Tienes que habilitar la barra de alternancia para usarla. Y una vez que expanda la configuración, verá el menú "Tienda de íconos", donde puede seleccionar íconos de una amplia biblioteca.
Hay un botón para cambiar el icono de antes a después del texto.
Puede cambiar el tamaño del icono y ajustar el espacio entre el icono y el texto.
Y también, puede cambiar el color del ícono tanto en modo normal como flotante. Debe hacer clic en la personalización del color del icono para abrir la paleta de colores.
Configuración de personalización para el grupo de botones (botones múltiples)
Para seleccionar el grupo de botones, verá un icono de "Seleccionar grupo de botones" en la información sobre herramientas predeterminada de WordPress.
Espacio entre botones
Después de seleccionar el grupo de botones, encontrará la configuración de Espacio entre botones. Esta configuración ayuda a establecer la brecha entre 2 y más botones.
Alineación Horizontal y Vertical
Aquí puede ajustar la alineación horizontal y vertical de varios botones.
También puede alternar la Alineación vertical para configurar los botones verticalmente.
Margen
También puede ajustar el margen de todo el grupo de botones desde esta configuración.
Animación de botón
Esta es una de las configuraciones más interesantes en el bloque de botones. Actualmente, obtendrá 4 animaciones configuradas en el bloque de botones de WordPress. Y cada uno de ellos proporciona un enfoque diferente cuando se desplaza sobre el botón. Además, puede ajustar la posición de la animación con el control deslizante Transformación de botón.
Aquí hay una imagen de las animaciones de los botones.
Y eso es todo lo que obtendrá con el bloque de botones de WordPress. Ahora ya sabe cómo agregar botones de WordPress con PostX.
Obtener PostX Pro ¡para desbloquear todas las funciones interesantes y crear sitios web increíbles !
Conclusión
Ahora que sabe cómo agregar botones en WordPress, el bloque Button ofrece opciones de personalización avanzadas, que incluyen estilos de botones, integración de iconos, fondos degradados, efectos de desplazamiento, tipografía avanzada, funcionalidad de grupos de botones y animaciones. Puede crear increíbles botones para compartir en redes sociales, o incluso implementar un botón para cargar más completamente personalizado en su sitio.
Con esta poderosa herramienta, puede crear botones visualmente atractivos y atractivos que mejoran la experiencia del usuario de su sitio web. Aproveche el bloque de botones de WordPress de PostX para liberar el poder de los botones personalizables en WordPress.
Puede consultar los tutoriales en vídeo de WordPress en nuestro canal de YouTube. ¡También, encuéntrenos en Facebook y Twitter para actualizaciones periódicas!
Presentamos la actualización de la interfaz fácil de usar de PostX
Bloques de publicaciones de Gutenberg: el mejor complemento de bloques de publicaciones
Cómo crear una plantilla de página de WordPress en el tema Twenty Twenty-Two
Importante actualización de seguridad para PostX y ProductX