View mit 3 Spalten themen, aber nicht mit Tabelle
am 07.10.2010 - 18:53 Uhr in
Hallo,
ich habe mir einen View gebaut - unformatiert und Felder als Zeilendesign. Die Listenelemente lasse ich mit einer festen Breite floaten, sodass das ganze 3spaltig wird. Jetzt müsste ich den "Spalten" jedoch etwas css mitgeben, zumindest für Spalte 1/2 und 3. Jetzt werden den Elementen jedoch nur Klassen "odd" und "even" sowie für den ersten und den letzten Eintrag eine separate.
Kennt jemand eine Lösung, wie ich bereits im View festlegen kann, dass jedes erste, jedes zweite und jedes dritte Element eine bestimmte CSS-Klasse bekommt? Im Prinzip würde es schon genügen, jedem dritten eine separate Klasse zu verpassen.
Auf "Raster" oder "Tabelle" als Design will ich verzichten, da ich die resultierende Tabelle nicht gebrauchen kann.
Vielen Danks schon mal fürs Lesen
- Anmelden oder Registrieren um Kommentare zu schreiben
In der Anahme das du weißt
am 07.10.2010 - 20:10 Uhr
In der Anahme das du weißt wie man views themed...
views-view-fields.tpl.php
<?php foreach ($fields as $id => $field): ?>
<?php if (!empty($field->separator)): ?>
<?php print $field->separator; ?>
<?php endif; ?>
<<?php print $field->inline_html;?> class="views-field-<?php print $field->class; ?>">
<?php if ($field->label): ?>
<label class="views-label-<?php print $field->class; ?>">
<?php print $field->label; ?>:
</label>
<?php endif; ?>
<<?php print $field->element_type; ?> class="field-content"><?php print $field->content; ?></<?php print $field->element_type; ?>>
</<?php print $field->inline_html;?>>
<?php endforeach; ?>
Diese Zeile:
<<?php print $field->element_type; ?> class="field-content"><?php print $field->content; ?></<?php print $field->element_type; ?>>
so erweitern:
<<?php print $field->element_type; ?> class="field-content field-item-<?php print $id; ?>"><?php print $field->content; ?></<?php print $field->element_type; ?>>
So sollte jedes Field-Content-Feld um die Klasse field-item-xx erweiert werden. Wobei das xx für die jeweilige position im Array steht. So bekommt jedes Feld seine eigene Klasse. Man aber auch einen einzelnen Zähler in der Schleife inkrementieren und dann alle 3,4 oder 5 Iterationen auf 0 setzten um so nur jedes 3,4 oder 5 Feld mit einer Klasse zu versehen.
Bei jeden dritten Element würde das so aussehen:
<?php $i = 1; // Zähler instanzieren ?>
<?php foreach ($fields as $id => $field): ?>
<?php if (!empty($field->separator)): ?>
<?php print $field->separator; ?>
<?php endif; ?>
<<?php print $field->inline_html;?> class="views-field-<?php print $field->class; ?>">
<?php if ($field->label): ?>
<label class="views-label-<?php print $field->class; ?>">
<?php print $field->label; ?>:
</label>
<?php endif; ?>
<<?php print $field->element_type; ?> class="field-content field-item-<?php print $i; ?>"><?php print $field->content; ?></<?php print $field->element_type; ?>>
</<?php print $field->inline_html;?>>
<?php
if ($i <= 3) {
$i++; //Inkrementieren wenn i kleiner oder gleich drei ist
}
else {
$i = 1; // Reset wenn $i nicht mehr kleiner oder gleich drei ist
}
?>
<?php endforeach; ?>
Der Code ist nicht getestet aber die vorgehensweise dürfte klar geworden sein.
Vielen Dank für den Code. So
am 09.10.2010 - 14:38 Uhr
Vielen Dank für den Code. So viel habe ich nicht erwartet.
In der Ausgabe bekomme ich auch immer
<span class="... field-item-1>
Bei jedem Element.
Und es wäre mir auch fast lieber, wenn ich diese ID für das darüber liegende
Ich habe zwar mittlerweile eine Lösung per CSS herbeigerufen, indem ich die ausgegebenen eindeutigen Klassen der
<li class="views-row-1">, <li class="views-row-2">,<li class="views-row-3">
genommen und ich dort jedem 3. (also 3, 6, 9 usw.) anderes CSS übergestülpt habe. Das ist aber nicht die sauber Lösung, die ich gerne hätte, zumal man dabei nicht unbegrenzt viele Felder ausgeben kann.
Ich würde mich also freuen, wenn Du Dir den Code noch mal ansehen könntest und wäre Dir sehr dankbar dafür.
Ich habe jetzt eine bessere
am 15.11.2010 - 16:20 Uhr
Ich habe jetzt eine bessere Lösung gefunden:
http://drupal.org/project/semanticviews
Damit kann man die einzelnen DIVs eines Views gezielt mit CSS-Klassen versehen, u.a. auch Reihe 1, 2, 3 usw. bestimmen und diesen Klassen zuweisen.