WP 2.8 the_post_thumbnail mal links mal rechts

MacTV · 04.01.2010, 18:04

N´bend
Das mit der neuen Funktion the_post_thumbnail habe ich soweit verstanden
und auch in mein Theme eingebaut.

<?php the_post_thumbnail('thumbnail', array('class' => 'alignright')); ?>

<?php the_post_thumbnail('thumbnail', array('class' => 'alignleft')); ?>

Nun möchte ich gerne, dass das "the_post_thumbnail" mal links und mal rechts erscheint.

kaiser · 04.01.2010, 19:09

Na dann musst Du jedem 2ten Post eine zusätzlich andere class mitgeben, weil Du dem Thumbnail nicht einmal links und dann rechts zuweisen kann, sondern nur eine Definition:

Code:

<?php the_post_thumbnail('thumbnail', array('class' => 'thumb')); ?>

du würdest den artikel-container-div dann vermutlich mit soetwas wie einer "left" und den folgenden mit einer "right"-class versehen und in deiner zB style.css dann ungefähr folgendes schreiben:

Code:

div.left img.thumb { position: relative; top: 0; left: 0; }
div.right img.thumb { position: relative; top: 0; right: 0; }

MacTV · 04.01.2010, 19:18

Ok ... und wie lautet der Befehl für jeden zweiten Post ?

Momentan ist ja nur

Code:

<?php the_post_thumbnail('thumbnail', array('class' => 'alignleft')); ?></a>

bzw. in meiner CSS

Code:

.wp-post-image {
    padding:2px;
    margin-right: 10px;
    margin-top: 1px;
    margin-left: 0px;
       background-color:#eee;
    }

drin .

kaiser · 04.01.2010, 21:00

Dafür gibt´s keinen Befehl. Da musst Du durchzählen. Such einmal im Forum. Dazu gibt´s einige Artikel

MacTV · 04.01.2010, 21:14

Hallo kaiser,
nochmal Danke für den Tip ... aber ich suche seit 20:00 Uhr das Forum durch.

und habe nur das gefunden...

Sorry.

kaiser · 05.01.2010, 02:44

Kein Problem. Du hast schon das Richtige gefunden. Würde aber noch einfach gehen, als das hier:

Code:

<div class="post" id="post-<?php $i++; echo $i ;?>">
....
</div>

...indem Du wie hier beschrieben ist zuerst herausfindest, ob es sich um einen Artikel mit gerader oder ungerader Zahl handelt (in der Zählreihe) und das dann in eine $variable abspeicherst. Dann machst Du etwas wie das hier:

Code:

<?php $var = usw.sieheLink;
foreach ($var as $v) { ?>
<div class="<?php if ( $v == "gerade" ) { echo "odd"; } else { echo "even"; } ?>">
<p> Hier_kommt_der_Inhalt_Deines_Artikels </p>
</div>

... und in Deiner Style.css definierst Du bloß noch ...

Code:

.odd { background: (zB)#ccc; }
.even { background: (zB)#009ee0; }

P.s: (zB) gehört nicht zum Code, sondern markiert bloß das die Farbe ein Beispiel ist.

kaiser · 05.01.2010, 03:03

Kein Problem. Du hast schon das Richtige gefunden. Würde aber noch eleganter gehen, als das hier:

Code:

<div class="post" id="post-<?php $i++; echo $i ;?>">
....
</div>

...indem Du wie hier beschrieben ist zuerst herausfindest, ob es sich um einen Artikel mit gerader oder ungerader Zahl handelt (in der Zählreihe) und das dann mit "gerade" "ungerade" belegst. Das spart etwas Css. Du machst dann also etwas wie das hier:

Code:


<?php 
$i = 0;
while (have_posts()) : the_post();
?>
<div class="<?php $i++; if (if($i%2)) { echo "even"; } else { echo "odd"; } ?>">
<p> Hier_kommt_der_Inhalt_Deines_Artikels </p>
</div>

<?php } ?>

... und in Deiner Style.css definierst Du bloß noch ...

Code:

.odd { background: (zB)#ccc; }
.even { background: (zB)#009ee0; }

P.s: (zB) gehört nicht zum Code, sondern markiert bloß das die Farbe ein Beispiel ist.

MacTV · 05.01.2010, 08:48

Ja Wunderbar ! 1000 Dank Herr Kaiser

Jetzt ist der Groschen gefallen.
Ich fasse mal zusammen.

Am Anfang des Loops baue ich einen Zähler ein:

Code:

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

in

Code:

<?php $i = 0; while (have_posts()) : the_post(); ?>

Die Variante $i hat nun einen Wert von 0.

Nun kann man dies als Klasse abfangen:

"Ist die Zahl gerade mach das"
"Ist die Zahl ungerade dann mach das"

Das wird erreicht, indem man bei der Variante $i prüft ob die aktuelle Zahl durch 2 teilbar ist.

Also $i%2

"Ist die Zahl gerade dann nimm post color1"
"Ist die Zahl ungerade dann nimm post color2"

Jetzt ist aber die Variante $i immer auf 0. Deswegen muss man
am Ende der Abfrage ein $i++ setzen. Dadurch wird die Variante bei jeden
Loop um eins erhöht. Und so wird jeder Beitrag, nummeriert.

Code:

<div class=<?=($i%2)?"post color1":"post color2";$i++;?>">

Mit dem passenden Eintrag in der CSS Datei kann man dann die Klassen steuern.

Code:

.color1{background-color:red;}
.color2{background-color:green;}

oder (so hab ich es nun gemacht)

Code:

<?php 
$i++;
if ($i%2) {
    the_post_thumbnail('thumbnail', array('class' => 'thumbn1'));
}else{
    the_post_thumbnail('thumbnail', array('class' => 'thumbn2'));
}
?>

Und im CSS

Code:

.thumbn1 {
    float:left;
    padding:2px;
    margin-right: 10px;
    margin-top: 0px;
    margin-left: 0px;
        background-color:#eee;
    }

.thumbn2 {
    float:right;
    padding:2px;
    margin-right: 0px;
    margin-top: 0px;
    margin-left: 10px;
        background-color:#eee;
    }

kaiser · 05.01.2010, 14:11

Ziemlich kool. Gratuliere!

Ps. Gut zusammen gefasst. Was glaubst wie sehr sich der Nächste, der das sucht, freuen wird

MacTV · 05.01.2010, 14:16

und so sieht das ganze dann aus: http://www.kreuznach-blog.de/blog/

Wobei ich noch nicht alle Beiträge mit der neuen Funktion "the_post_thumbnail" versehen habe....