Muy buenas!
Tengo un problema con estos botones en mi web que no consigo que se vean como quiero, con marrón #8e6b27 y en hover amarillo #dbc250 con el texto siempre en blanco.
Ahora me aparecen asi en estas 3 paginas que tengo el problema
https://www.frecuenciasdesanacion.com/my-courses/
https://www.frecuenciasdesanacion.com/finalizar-compra/
https://www.frecuenciasdesanacion.com/leccion/leccion-1/
Yo no tengo ni idea de CSS pero me puse a trastear con chat gpt y consegui un codigo que si cambia esos colores y los pone bien, pero claro, tambien afecta a muchos mas botones y se lia todo. Conseguí dejarlo asi, pero es que hasta los botones del constructor visual me los cambia a esos colores, una locura 🙂
Los CSS que use son estos:
/* Forzar estilos en todos los botones */
button,
input[type="submit"],
.woocommerce button.button,
.woocommerce input.button,
.wp-block-sensei-lms-button {
background-color: #8e6b27 !important;
color: #ffffff !important;
border: none !important;
opacity: 1 !important;
pointer-events: auto !important;
}
button:hover,
input[type="submit"]:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.wp-block-sensei-lms-button:hover {
background-color: #dbc250 !important;
color: #ffffff !important;
}
/* Excluir Resumen del pedido y Añadir cupón de la personalización global */
.wc-block-components-order-summary button,
.wc-block-components-totals button {
background-color: transparent !important;
color: inherit !important;
border: none !important;
}
/* Excluir Añadir cupón del estilo */
.wc-block-components-totals-coupon button {
background-color: transparent !important;
color: inherit !important;
border: none !important;
}
/* Cambiar color del botón de comprar curso en lección Sensei LMS */
.sensei-course-theme__button.is-primary {
background-color: #8e6b27 !important;
color: #ffffff !important;
border: none !important;
}
.sensei-course-theme__button.is-primary:hover {
background-color: #dbc250 !important;
color: #ffffff !important;
}
/* Cambiar color del botón de "Inicia sesión" en lección Sensei LMS */
.sensei-course-theme__button.is-secondary {
background-color: #8e6b27 !important;
color: #ffffff !important;
border: none !important;
}
.sensei-course-theme__button.is-secondary:hover {
background-color: #dbc250 !important;
color: #ffffff !important;
}
Y mi cuestión es si me pueden ayudar a hacer esto bien y no asi a lo bruto como lo hice yo. Solo quiero que se cambien esos botones de Mis Cursos, los de dentro de la lección y el de realizar pedido.
Muchas gracias, un saludo!!
Contenido solo visible a usuarios registrados
Los botones de la página de Mis cursos ya los consegui cambiar a marrón 🙂 me faltan los de realizar pedido y los que van dentro de la lección..
Hola Jorge.
Prueba con esto:
.wp-block-sensei-lms-course-list--is-list-view .sensei-cta .wp-block-button__link {
background-color: #8e6b27!important;
}
.wc-block-checkout__actions_row .wp-element-button, .wp-block-button__link {
background-color: #8e6b27!important;
}
.sensei-course-theme-locked-lesson-notice__actions .sensei-course-theme__button.is-primary {
background-color:#8e6b27!important;
}
a.sensei-course-theme__button.is-primary.wp-block-button__link.wp-element-button {
color:#fefefe!important;
}
.sensei-course-theme-locked-lesson-notice__actions .sensei-course-theme__button.is-primary:hover {
background-color:#dbc250!important;
}
.wc-block-checkout__actions_row .wp-element-button, .wp-block-button__link:hover {
background-color: #dbc250!important;
}
.wp-block-sensei-lms-course-list--is-list-view .sensei-cta .wp-block-button__link:hover {
background-color: #dbc250!important;;
}
Un saludo
Muy buenas Pepe! funcionó en general pero quedaron algunos ajustes con ese codigo... el boton de realizar pedido no cambiaba de color en hover... y el boton de Iniciar sesión dentro de la lección de sensei no cambiaba el fondo, pero a aprtir de este codigo que me mandaste y los que tenia yo mas la ayuda de chat gpt lo deje asi y ahora se ve todo perfecto:
}
/* Botones en vista de lista del curso de Sensei LMS */
.wp-block-sensei-lms-course-list--is-list-view .sensei-cta .wp-block-button__link,
.wc-block-checkout__actions_row .wp-element-button,
.sensei-course-theme-locked-lesson-notice__actions .sensei-course-theme__button.is-primary,
.sensei-course-theme__button.is-secondary {
background-color: #8e6b27!important;
color: #ffffff!important; /* Se asume que todos los botones deben tener texto blanco */
border: none!important; /* Se asume que no hay borde en ninguno de estos botones */
}
/* Botones en estado hover */
.wp-block-button__link:hover,
.wc-block-checkout__actions_row .wp-element-button:hover,
.sensei-course-theme-locked-lesson-notice__actions .sensei-course-theme__button.is-primary:hover,
.wp-block-sensei-lms-course-list--is-list-view .sensei-cta .wp-block-button__link:hover,
.sensei-course-theme__button.is-secondary:hover {
background-color: #dbc250!important;
color: #ffffff!important; /* Se asegura que el color del texto permanezca */
}
/* Color específico para enlaces con varias clases combinadas */
a.sensei-course-theme__button.is-primary.wp-block-button__link.wp-element-button {
color: #fefefe!important;
}
Muchas gracias!!!
Hola Jorge,
Enhorabuena todo funciona como deseas, es un placer para nosotros siempre poder ayudarte.
No dudes en escribirnos si tienes cualquier otra consulta.
Un Saludo 😊