Clase post_class alterna en cada publicación

Question

Clase post_class alterna en cada publicación

12 ago 2010, 06:26:17

Vistas: 3.43K

Votos: 2

Necesito tener una clase alterna (par, impar...) en las publicaciones para proporcionar resaltados alternos en una columna. Lo mejor sería adjuntar esto a post_class() para que esté en cada instancia de post_class(). A continuación está el código que tengo en este momento para lograr este efecto.

<?php 

// configurando otras variables para categorías alternas
$style_classes = array('even', 'odd');
$style_counter = 0;
?>

<?php if (have_posts()) : ?>

<?php while (have_posts()) : the_post(); ?>

<div class="<?php $k = $style_counter%2; echo $style_classes[$k]; $style_counter++; ?>">

<?php the_cotent(); ?>

</div>

<?php endwhile; ?>

<?php endif; ?>

curtismchale

2.59K

clase de publicacion

Todas las respuestas a la pregunta

Esto funciona, pasa la clase adicional a post_class():

<?php $c = 0; ?>
<?php if (have_posts()) : ?>
    <?php while (have_posts()) : the_post(); ?>
        <div <?php post_class((++$c % 2 === 0) ? 'odd' : 'even'); ?>>
            <?php the_content(); ?>
        </div>
    <?php endwhile; ?>
<?php endif; ?>

EDITADO: Aquí hay una forma que crea una versión de post_class() que llevará un conteo en la página. Ahora, usará un nuevo nombre, oddeven_post_class() pero funciona como deseas. Todo lo que necesitas hacer es agregar esto en functions.php:

/* Agrega este bloque en functions.php */
class MyCounter {
    var $c = 0;
    function increment(){
        ++$this->c;
        return;
    }
    function oddOrEven(){
        $out = ($this->c % 2 === 0) ? 'odd' : 'even';
        $this->increment();
        return $out;
    }
}
$my_instance = new MyCounter();
function post_class_oddeven() {
    global $my_instance;
    ob_start();
    post_class($my_instance->oddOrEven());
    $str = ob_get_contents();
    ob_end_clean();
    echo $str;
}
/* fin del bloque */

Para llamarlo, usa post_class_oddeven() en tu tema donde normalmente usarías post_class()

artlung

3.1K

12 ago 2010 06:52:33

Comentarios

Sí, eso sigue siendo solo una variación de la solución anterior. Puede que no haya sido claro, pero estoy buscando una solución que iría en el archivo functions.php y luego simplemente pasarla a cualquier instancia de post_class(). Así no tendría que modificar todas las instancias individuales de los loops donde necesito esto.

curtismchale

12 ago 2010 07:21:00

Actualicé mi respuesta con una solución que funciona para mí.

artlung

12 ago 2010 07:45:10

Tengo otra solución si quieres añadir una clase específica a diferentes contenidos. Por ejemplo, solo al bucle:

add_filter( 'post_class', 'my_post_class' );

function my_post_class( $classes ) {

  if ( ! is_single() ) {
    global $wp_query;

    // Añade clase "par" o "impar" si no es un contenido único
    $classes[] = $wp_query->current_post % 2 == 0 ? 'even' : 'odd' ;
  }

  return $classes;
}

Porque no quieres añadir la clase "even" o "odd" cuando se muestra un contenido único.

Marco Godínez

157

5 ago 2014 02:41:28

Comentarios

¡Lo hiciste genial! Buen trabajo, Marco.

James Kemp

1 jul 2015 19:17:00

Puedes hacer esto con CSS directo. En el tema twentyseventeen, por ejemplo, donde el loop está en un div "main":

#main .post {
    color: red;
}

#main .post:nth-of-type(2n) {
    color: blue;
}

hará el truco.

ronald

407

21 jun 2017 13:19:09

Adhip Gupta 404 · Accepted Answer · 2010-08-12T09:18:12Z

Debes agregar el siguiente código en functions.php:

add_filter ( 'post_class' , 'my_post_class' );
global $current_class;
$current_class = 'odd';

function my_post_class ( $classes ) { 
   global $current_class;
   $classes[] = $current_class;

   $current_class = ($current_class == 'odd') ? 'even' : 'odd';

   return $classes;
}

Esto asegura que todas las publicaciones impares en la página tendrán la clase 'odd' y todas las publicaciones pares tendrán la clase 'even' simplemente usando post_class() en tu tema.

Adhip Gupta

404

12 ago 2010 09:18:12