Avisos
Vaciar todo

[Resuelto] CAMBIAR COLOR BOTONES EN SENSEI LMS Y WOOCOMMERCE

5 Respuestas
3 Usuarios
0 Reactions
11 Visitas
Respuestas: 17
Active Member
Topic starter
 

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 8:40 am
Respuestas: 17
Active Member
Topic starter
 

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 11:16 am
Pepe
 Pepe
Respuestas: 41121
Illustrious Member 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 11:44 am
Respuestas: 17
Active Member
Topic starter
 

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 3:35 pm
Karen Rios
Respuestas: 18675
Illustrious Member 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 3:57 pm