• Saltar a la navegación principal
  • Saltar al contenido principal
Código Genesis

Código Genesis

Tutoriales de WordPress y Genesis Framework

  • Empieza aquí
  • Cuenta
    • Suscripción
    • Perfil
    • Actualizar tarjeta
    • Favoritos
    • Salir
  • Suscribirse
  • Acceder

Mostrar el elemento de login de Osom Modal Login como un botón

Descubre cómo dar forma o estilo de botón a los elementos para acceder y salir del menú que añade el plugin Osom Modal Login.

El plugin Osom Modal Login, añade un elemento al menú para acceder o salir de forma condicional, dependiendo de si el usuario está logueado o no.

El texto del mismo lo puedes personalizar desde los ajustes del plugin y por defecto se muestras como un elemento más del menú.

Elemento de acceder de Osom Modal Login por defecto.

Pero es posible que quieras destacar el elemento de login como si fuera un botón. Por suerte puedes conseguir esto con un poco de CSS.

Elemento de acceder de Osom Modal Login como botón.

Vamos a ver cómo:

Snippet de código para ver los los elementos del menú de Osom Modal Login como un botón

El plugin Osom Modal Login utiliza dos clases distintas dependiendo de si muestra el elemento de acceder o de salir:

  • osmlogin (acceder)
  • logout (salir)

Así que puedes usar el primero si solo quieres que afecte al elemento de acceder a la web.

Para darle un diseño de botón, introduce este código al final del fichero style.css:

Para ver este código y los otros 1827 snippets de esta web,
identifícate o suscríbete aquí.

Pero esto es solo un ejemplo.

Puedes usar modificar los colores y forma del botón a tu gusto.

Conclusiones

Ya ves qué fácil es mostrar el elemento de acceder del plugin Osom Modal Login en forma de botón.

Si tienes alguna duda te leo en los comentarios. Y si quieres dejarme una sugerencia para futuros tutoriales, envíamela a través del formulario de contacto.

Todo ventajas de ser suscriptor. 😉

CSS Osom Modal Login WordPress

Nahuai Badiola

Desarrollador web especializado en WordPress y Genesis Framework. CEO de Código Genesis y cofundador de OsomPress (temas y plugins para WordPress).

Para dejar dudas o preguntas sobre este código, puedes identificarte o suscribirte.

  • Empieza aquí
  • Sobre Código Genesis
  • Preguntas frecuentes
  • Contacto

Aviso legal · Política de privacidad · Política de cookies · Condiciones de contratación
Copyright © 2023 · Código Genesis

¿Has olvidado tu contraseña?