Orientación solo a la página de la tienda

3 minutos de lectura

avatar de usuario
mario

Esto es lo que necesito hacer:

  • Apuntar solamente la página principal de la tienda con CSS (una clase personalizada específica que creé como se menciona a continuación).

Esto es lo que he hecho y probado hasta ahora:

  • Tengo una plantilla de anulación de archive-product.php en mi tema infantil.
  • En esta plantilla de anulación, agregué un div con una clase personalizada custom-shop-class justo antes de que comience el bucle del producto, porque quiero apuntar específicamente a los productos en bucle.
  • Intenté apuntar con clase page-id-4 porque si paso el cursor sobre la página “comprar” en wp-admin, me da http://.../post.php?post=4&action=edit

El problema que tengo es el siguiente:

  • Por lo que he descubierto es que lo mismo archive-product.php la plantilla se está utilizando en las otras páginas de la tienda y no solo en la página principal de la “tienda” (corríjame si me equivoco), así que cuando oriento mi custom-shop-class con CSS, afecta a todas las demás páginas de la tienda que usan el mismo archivo de plantilla, y no debe hacerlo.
  • No hay un identificador único o clase específicamente para la página de la tienda, algo así como el page-id-?? class en la etiqueta del cuerpo (como en las páginas habituales de WP).

¿Alguna sugerencia sobre el mejor método/solución?

Establezca una declaración condicional para verificar la página principal de la tienda, luego repita el div en cuestión si esa declaración se evalúa como verdadera.

Etiqueta condicional de WooCommerce para la página principal de la tienda:

is_shop()

Ejemplo

if (is_shop()) {
echo "<div class="custom-shop-class"></div>";
} else {
echo "<div class="custom-product-category-class"></div>";
}

Alternativamente:

<?php if (is_shop()):?>
<div class="custom-shop-class"></div>
<?php else: ?>
<div class="custom-product-category-class"></div>
<?php endif;?>

Etiquetas condicionales | Documentación de WooThemes

  • ¡Hermoso! ¡Una gran solución (simple) y tiene sentido lógico! Solo una pregunta rápida, ¿qué es “is_shop”? ¿Es una variable o una función y dónde la encuentro en el esquema de cosas de WC?

    – mario

    1 jun 2016 a las 21:25


  • ¡Fantástico! Me alegro de que hayas acertado. WooCommerce facilita de esta manera enganchar acciones y filtros personalizados. Si cree que esta respuesta le dio la solución que estaba buscando, no dude en marcarla como la respuesta correcta.

    – UncaughtTypeError

    1 de junio de 2016 a las 21:28

  • No importa mi pregunta. Recién ahora vi el enlace que adjuntaste sobre “etiquetas condicionales”. ¡Genial, gracias!

    – mario

    1 jun 2016 a las 21:33


  • Para responder a su pregunta, is_shop() es solo una etiqueta de consulta condicional que tiene una estrecha relación de trabajo con la jerarquía de plantillas de WordPress. para obtener más información, consulte: codex.wordpress.org/Etiquetas_condicionales

    – UncaughtTypeError

    1 jun 2016 a las 21:34

  • Muchas gracias por responder. Tengo algo de lectura que hacer, muy apreciado.

    – mario

    1 jun 2016 a las 21:35

avatar de usuario
Neilgee

Usando el filtro body_class con el is_shop condicional, puede apuntar a la página principal de la tienda de WooCommerce.

add_filter( 'body_class', 'woo_shop_class' );
// Add WooCommerce Shop Page CSS Class
function woo_shop_class( $classes ) {
  if ( is_shop() )  // Set conditional
    $classes[] = 'woo-shop'; // Add Class
return $classes;
}

El código va en tus temas. functions.php expediente.

  • Muy útil. De esta manera se logra el mismo resultado final sin utilizar un archivo de plantilla. Puede implementar esto a través de functions.php, que es exactamente lo que necesitaba. Gracias.

    – inspirado

    6 de marzo de 2021 a las 4:37

Para desarrollar la respuesta proporcionada aquí, ¿cómo podría ir más allá y agregar un identificador único a la página de la tienda según el lenguaje WPML activo? (Básicamente, estoy tratando de reducir el tamaño de fuente solo en la versión alemana de la página de la tienda; está resultando sorprendentemente difícil de hacer)

¿Ha sido útil esta solución?