Ocultar «Ordenar por» en WooCommerce

  • Resuelto Hector

    (@hecktoras)


    hace 3 años, 12 meses

    Hola,

    Estoy teniendo un problema al intentar ocultar o incluso cuando intento agregarle margin-bottom (en versión movil) al parecer no me estaría tomando el código CSS (si se ven los cambios cuando edito con el inspecionar del navegado, pero al momento de aplicarlo en el tema hijo no me lo toma). También puede ser que me esté equivocando al agregarlo, aunque no creo que así sea.

    Esperaré una respuesta y mientras intentaré solucionarlo.

    La página con la que necesito ayuda: [accede para ver el enlace]

Viendo 6 respuestas - de la 1 a la 6 (de un total de 6)
  • Moderador almendron

    (@almendron)

    hace 3 años, 12 meses

    Prueba con

    .woocommerce .woocommerce-ordering
	display: none;
}

    Para la versión móvil, usa https://www.w3schools.com/cssref/css3_pr_mediaquery.asp

    Es conveniente que uses el mismo punto de ruptura que utilice el tema que usas.

    • Esta respuesta fue modificada hace 3 años, 12 meses por almendron.
    Iniciador del debate Hector

    (@hecktoras)

    hace 3 años, 12 meses

    Hola @almendron

    Recién me puse a mirar todo el código CSS del Tema Hijo. Lo que pasaba es que ya tenía el código CSS pero sin margin-bottom:

    .woocommerce-ordering select {
    font-size: 14px;
    font-weight: 500;
    padding: 10px 40px 10px 12px;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 100% !important;
    background: 0 0;
    border-color: rgba(0,0,0,.1);
    color: #001559 !important;
    cursor: pointer;
}

    Lo que hacía era agregar 

    .woocommerce-ordering select {
 margin-bottom: 20px;
}

    Así que me quedaban dos veces .woocommerce-ordering select ¿podría haber sido este el problema?

    Ahora lo que hice fue agregar todo dentro de un solo 

    .woocommerce-ordering select {
    margin-bottom: 20px;
    font-size: 14px;
    font-weight: 500;
    padding: 10px 40px 10px 12px;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 100% !important;
    background: 0 0;
    border-color: rgba(0,0,0,.1);
    color: #001559 !important;
    cursor: pointer;
}

    Si ves que estoy haciendo algo mal en esto, te agradecería que me lo comentes.

    Gracias por la ayuda y también por la info del link de W3Schools, estaba usando ese código pero no me lo tomaba.

    Moderador almendron

    (@almendron)

    hace 3 años, 12 meses

    Pero… ¿qué quieres hacer? ¿Ocultarlo, moverlo…?

    Iniciador del debate Hector

    (@hecktoras)

    hace 3 años, 12 meses

    Estoy pensandolo, por ahora solo aumentar el espacio que hay entre «Ordenar por» y los productos, solo en la versión movil.

    Para ocultarlo no tengo problema, se que puedo hacerlo con PHP o CSS.

    Yo lo daría por solucionado porque he logrado lo que intentaba.
    El problema principal que tenía es que no tomaba el código CSS. Pero ya lo he solucionado.

    Moderador almendron

    (@almendron)

    hace 3 años, 12 meses

    Para que te coja los cambios, aplica a

    .woocommerce .woocommerce-ordering

}
    Iniciador del debate Hector

    (@hecktoras)

    hace 3 años, 12 meses

    Muchas gracias @almendron

    Daré el tema por solucionado.

Viendo 6 respuestas - de la 1 a la 6 (de un total de 6)
  • El debate ‘Ocultar «Ordenar por» en WooCommerce’ está cerrado a nuevas respuestas.