Avisos
Vaciar todo

[Resuelto] CAMBIAR COLOR BOTONES EN SENSEI LMS Y WOOCOMMERCE  

 
Jorge
 Jorge
Usuario activo

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/

1
2
3

 

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 🙂

5
4
6

 

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

Respondido : 24/10/2024 9:40 am
Jorge
 Jorge
Usuario activo

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..

Captura de pantalla 2024 10 24 a las 13.15.56
Respondido : 24/10/2024 12:16 pm

optimiza-automaticamente-todas-las-imagenes-de-tu-wordpress

Pepe
 Pepe
Soporte CMS Webempresa Admin

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

Respondido : 24/10/2024 12:44 pm
Jorge
 Jorge
Usuario activo

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!!!

Respondido : 24/10/2024 4:35 pm

Cursos Gratuitos WordPress

Karen Rios
 Karen Rios
Soporte CMS Webempresa Moderator

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 😊 

Respondido : 24/10/2024 4:57 pm