TechBlogSD - Todo para WordPress y desarrollo WEB
Instrucciones de WEB y WordPress, noticias, reseñas de temas y complementos

¿Cómo agregar la barra de notificaciones superior en WordPress?

6

Muchos blogueros escribieron extensos artículos tutoriales. Sin embargo, la efectividad del artículo no está en la extensión y depende de los resultados de su llamado a la acción. WordPress le permite insertar secciones de llamado a la acción de diferentes maneras. La forma más efectiva y atractiva es agregar la barra de notificaciones superior. Si está buscando cómo agregar la barra de notificaciones superior en WordPress, explicamos varias formas en este artículo.

Ejemplos de la barra de notificaciones superior

Antes de continuar, primero permítanos mostrarle algunos ejemplos de los widgets de la barra de notificaciones superior en WordPress. El primer ejemplo es del popular sitio web GeneratePress de tema ligero. Ofrecen el descuento en el tema GeneratePress con dos botones de llamada a la acción en la barra.

¿Cómo agregar la barra de notificaciones superior en WordPress?

Ejemplos de notificaciones principales de GeneratePress

El segundo ejemplo es otro sitio web popular de temas de Astra. Aquí puede ver un texto de oferta especial con temporizador de cuenta regresiva.

¿Cómo agregar la barra de notificaciones superior en WordPress?

Notificación superior de Astra

Podrías ver cientos de ejemplos de este tipo en Internet y crear el tuyo propio en tu sitio web es una tarea fácil.

Opciones para agregar la barra de notificaciones superior en WordPress

Estas son algunas de las opciones que puede utilizar.

  • Complemento de barra de notificaciones dedicado
  • Complementos multiusos
  • Uso de opciones de tema con la API de enlaces de WordPress
  • Usar incrustaciones de terceros
  • Utilice su propio CSS personalizado

1 Uso de complementos de la barra de notificaciones dedicada

Recomendamos utilizar esta opción ya que es fácil de controlar y personalizar con el mínimo esfuerzo. Además, puede obtener muchos complementos gratuitos para este propósito en lugar de buscar un complemento premium y aquí lo explicaremos con el complemento Easy Notification Bar. El complemento utiliza la API de gancho wp_body_open para insertar la notificación sobre la sección del cuerpo de su sitio. Por lo tanto, funcionará con cualquier tema que utilice los últimos estándares de WordPress. Primero instale y active el complemento Easy Notification Bar.

¿Cómo agregar la barra de notificaciones superior en WordPress?

Instale la barra de notificaciones fácil

Después de eso, vaya a la sección "Complementos> Complementos instalados". Haga clic en el enlace "Configuración" debajo del complemento Easy Notification Bar.

¿Cómo agregar la barra de notificaciones superior en WordPress?

Configuración sencilla de la barra de notificaciones

Personalización de la configuración del complemento

El complemento no ofrece una página de configuración separada. Agrega todas las opciones en la sección de personalización de WordPress predeterminada. La ventaja de esta forma es que puede obtener fácilmente una vista previa de la barra de notificaciones en la vista de escritorio y móvil antes de publicarla en vivo.

Estas son las opciones que puede personalizar con el complemento.

  • Habilitar barra de notificaciones: habilite esta casilla de verificación para ver la vista previa en vivo de su barra de notificaciones en la vista previa. La ventaja aquí es que puede cambiar la vista a escritorio, tableta y móvil para confirmar el aspecto de la barra sin publicar los cambios.
  • Mostrar icono de cierre: si desea que los usuarios cierren la barra, habilite esta casilla. De lo contrario, los usuarios no pueden cerrar la barra y estará allí siempre en la parte superior de sus páginas.
  • Cerrar icono: elija iconos simples o de contorno para el botón de cierre.
  • Habilitar pegajoso: habilítelo para que su notificación sea pegajosa cuando los usuarios se desplacen hacia abajo en el área de contenido de sus páginas.

¿Cómo agregar la barra de notificaciones superior en WordPress?

Configuración sencilla de la barra de notificaciones en el personalizador

  • Desactivar solo en la página principal: marque esta opción para desactivar la barra de notificaciones solo en su página de inicio.
  • Mensaje: el complemento llenará el mensaje de muestra en el cuadro, lo eliminará y agregará su mensaje personalizado para mostrarlo en la barra.
  • Color de fondo / texto: aplique colores de fondo y fuente para su barra y texto.
  • Alinear texto: alinea el texto dentro de la barra a la izquierda, derecha o centro.
  • Familia de fuentes del sistema: use esta opción para cargar la fuente del sistema para el contenido del texto en su barra de notificaciones. De lo contrario, el complemento también utilizará la configuración predeterminada de su tema para la barra de notificaciones.
  • Tamaño de fuente: ingrese el tamaño de fuente como 18px para tener un tamaño de texto diferente en comparación con la sección del cuerpo.

¿Cómo agregar la barra de notificaciones superior en WordPress?

Personalización de la barra de notificaciones

  • Texto y enlace del botón: agregue texto y enlace para su botón
  • Parámetros de enlace: puede hacer que el enlace del botón sea nofollow, patrocinado y que se abra en una nueva ventana.

Después de personalizar su configuración, haga clic en el botón "Publicar" para ver la barra de notificaciones superior en acción en su sitio en vivo. Como puede ver la captura de pantalla a continuación, se verá similar a los ejemplos de sitios web profesionales como se explicó anteriormente.

¿Cómo agregar la barra de notificaciones superior en WordPress?

Barra de notificaciones publicadas

Opción alternativa: FooBar

Como su nombre lo indica, el complemento Easy Notification Bar le permite crear una barra simple en la parte superior sin otras opciones. Por ejemplo, no puede deshabilitar o habilitar solo en las páginas donde lo necesite. Si necesita una barra de notificaciones para su sitio de WordPress con más opciones, pruebe el complemento FooBar.

  • Después de instalar el complemento, le permite importar las demostraciones que puede editar y reutilizar.

¿Cómo agregar la barra de notificaciones superior en WordPress?

Importar barras de demostración

  • Puede crear notificaciones, avisos de cookies y llamadas a la acción, todo con un solo complemento.

¿Cómo agregar la barra de notificaciones superior en WordPress?

Crear nueva barra de notificaciones en FooBar

  • Obtenga una vista previa de la barra dentro de su área de administración o en la interfaz sin publicarla.
  • Ajuste la posición, la visibilidad y la apariencia según sus necesidades.

¿Cómo agregar la barra de notificaciones superior en WordPress?

Ajustar apariencia con FooBar

2 complementos multiusos

Hay algunos complementos que realizan múltiples tareas. Por ejemplo, puede usar el complemento OptinMonster para agregar la barra de notificación superior en WordPress, aunque el propósito principal del complemento es la gestión de clientes potenciales. De manera similar, puede usar el complemento WP Review Pro para agregar un widget de notificación en la parte superior, aunque el complemento está diseñado para crear reseñas. Aquí, explicamos con WP Review Pro y puede consultar en el repositorio de complementos de WordPress complementos similares.

  • Una vez que tenga la versión pro del complemento WP Review instalada en su sitio, cree o edite una página.
  • El complemento agregará un cuadro de meta de revisión en el editor y hará clic en la pestaña "Barra de notificaciones".
  • Seleccione "Usar opciones personalizadas" en "Activar" y personalice la apariencia de su barra de notificaciones.

¿Cómo agregar la barra de notificaciones superior en WordPress?

Configuración de WP Review Pro para la barra de notificaciones

3 Usar opciones de tema

Muchos temas de WordPress ofrecen una manera fácil de insertar una barra de notificaciones superior sin necesidad de ningún complemento. Por ejemplo, los ejemplos anteriores que hemos mostrado de GeneratePress y Astra utilizan la API de enlace de WordPress y las opciones de diseño personalizado. Así es como puede crear la barra de notificaciones superior en el tema GeneratePress sin el complemento.

  • Primero, prepare su contenido HTML para la barra.
  • Vaya a la sección "Apariencia> Widgets" y pegue su HTML dentro de un elemento " HTML personalizado " en el área del widget "Barra superior".

¿Cómo agregar la barra de notificaciones superior en WordPress?

Agregar HTML personalizado en el widget de la barra superior

  • Guarde sus cambios y vaya a la sección "Apariencia> Personalizar".
  • Navegue a la sección "Barra superior" y ajuste el relleno, el ancho y la alineación de la barra.

¿Cómo agregar la barra de notificaciones superior en WordPress?

Personalización de la barra superior en GeneratePress

  • Obtenga una vista previa y publique sus cambios.

¿Cómo agregar la barra de notificaciones superior en WordPress?

Barra de notificaciones con widget de barra superior GeneratePress

La apariencia de la barra depende de su código HTML y puede integrar el botón y el texto para que aparezcan en una sola línea.

4 Uso de incrustaciones de terceros

Además de los temas y complementos de WordPress, también tiene opciones de terceros. Puede utilizar la suscripción de correo electrónico de MailChimp o cualquier otro proveedor en la parte superior de su sitio. Esta es la mejor manera de recopilar correos electrónicos de lectores que cumplen con el RGPD y otras leyes locales. Del mismo modo, puede usar Hello Bar o un servicio similar para agregar una barra de notificaciones superior para dirigir el tráfico a una página de destino.

5 Uso de su propio CSS

Simplemente puede agregar un fragmento de código CSS sobre el área del menú de navegación en la sección de encabezado. Sin embargo, esta es una opción rígida y debe personalizar la barra para la vista móvil. Además, no puede cambiar la barra en diferentes páginas según el contenido. Por lo tanto, no explicaremos esto en detalle.

Factores a considerar antes de elegir el complemento de la barra de notificaciones superior

Aunque hay diferentes opciones disponibles, debe considerar el propósito antes de elegir la opción adecuada para usted.

  • Para fines de marketing por correo electrónico, asegúrese de verificar si el complemento permite la integración con formularios de correo electrónico. Alternativamente, puede elegir proveedores de servicios de terceros como MailChimp.
  • Muestre sus propios cupones de productos o cupones de afiliados que necesitan hermosos botones con íconos.
  • Para dirigir el tráfico a cualquier página de destino, puede tener una barra de aspecto simple.
  • Producto o cualquier otro lanzamiento necesita un temporizador en la barra.

Ultimas palabras

Como puede ver, hay muchas opciones disponibles para insertar la barra de notificaciones superior en su sitio de WordPress. recomendamos usar la opción de tema si está disponible, aunque necesita dedicar algo de tiempo a la creación de código HTML. Los complementos gratuitos son fáciles de usar pero con opciones limitadas. La mejor opción es usar complementos premium para que tenga un control completo de la barra de notificaciones.

Fuente de grabación: webnots.com
Deja una respuesta

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More