Fügen Sie classn zu allen anderen Posts hinzu, indem Sie get_posts verwenden

Ich verwende derzeit diese kleine Schleife, um eine Liste von Posts anzuzeigen, die den benutzerdefinierten Nachrichtentyp “Ereignisse” verwenden

 'events'); $custom_posts = get_posts($args); foreach($custom_posts as $post) : setup_postdata($post); ?> 
  • Content goes here

Was ich tun möchte, ist eine class zu jedem anderen Listenelement hinzuzufügen, so dass ich sie alternativ stylen kann (zum Beispiel ein weißes, ein schwarzes, ein weißes, ein schwarzes)

Ich habe das vorher mit einer Standardschleife gemacht, aber ich konvertiere nur zu get_posts, also bin ich ein bisschen festgefahren.

Jede Hilfe wäre großartig.

Danke im Voraus

Solutions Collecting From Web of "Fügen Sie classn zu allen anderen Posts hinzu, indem Sie get_posts verwenden"

Eine einfache Lösung wäre das Hinzufügen einer alternierenden class zu jedem anderen Post in der Liste. Insbesondere (in Ihrer style.css) stylen Sie die Listenelemente

  • auf eine bestimmte Art und übersteuern dann diesen Stil für Listenelemente einer bestimmten class

  • . Die class my-alternate-cass wird auf jedes andere Listenelement angewendet:

     < ?php global $post; $args = array('post_type' => 'events'); $custom_posts = get_posts($args); if($custom_posts):?> 
      ; < ?php foreach($custom_posts as $post) : setup_postdata($post);?> < ?php $class = (empty($class) ? "class='my-alternate-class'" : "");?>
    • >Content goes here
    ; < ?php endforeach; ?> < ?php endif; ?> //Remember to wp_reset_postdata() afterwards wp_reset_postdata(); ?>

    Bitte beachten Sie dies ungeprüft.

    Ich habe auch wp_reset_postdata() hinzugefügt, da sonst Ihre Website möglicherweise wp_reset_postdata() .

    Ich kenne eine CSS3-Lösung:

     li {background: #000;} li:nth-child(odd) {background: #fff;} 

    Das Gleiche kann mit jQuery erreicht werden, wobei #eventlist die ID Ihrer ungeordneten Liste ist:

     jQuery(document).ready(function(){ jQuery('#eventlist li:nth-child(odd)').addClass('alternate'); }); 

    Und dann: .alternate {background: #fff;}

     $counter = 0; // Reset counter before the loop $thenumber = ( $counter%2 ) + 1; // Set counter reset (every 2nd count in this example) $counter++; // Increment number echo $thenumber; // Echoes 1, 2, 1, 2, 1, 2 and so on... 

    Dies könnte wie folgt verwendet werden:

     
  • Content goes here
  • damit du es bekommst

     
  • Hoffe, das funktioniert!

    (Möglicherweise möchten Sie die

      -Tags außerhalb der Schleife verschieben, sodass Sie nur eine Liste mit den darin enthaltenen Listenelementen haben).