View mit CSS verändern
am 26.02.2013 - 15:42 Uhr in
Hallo zusammen,
es tut mir Leid, dass ich schon wieder nerven muss. Ich habe wirklich alle Tutorials über Views gelesen. Sei es auf Deutsch oder Englisch.
Trotzdem kriege ich es nicht in meine Birne wie ich einen View mit CSS "verschöner".
Ich habe die schon einmal erwähnte Produktübersicht erstellt, bei der die Produkte in 3 Tabellen (Gerichte, Beilagen, Getränke) aufgeteilt sind. Ich hätte gerne eine stylische Übersicht der Produkte und weiß nicht wie ich diese hinkriegen soll.
Gibt es vielleicht einige Einstellungen, die ich bei dem Modul View übersehen habe?
Firebug konnte mir auch nicht helfen, da ich die Standardklassen der HTML-Elemente nicht in der styles.css gefunden habe...
Danke für eure starken Nerven mir gegenüber ;)
Grüße Terindor
- Anmelden oder Registrieren um Kommentare zu schreiben
terindor schrieb Firebug
am 26.02.2013 - 16:15 Uhr
Firebug konnte mir auch nicht helfen, da ich die Standardklassen der HTML-Elemente nicht in der styles.css gefunden habe.
Du musst die Klassen ja auch in der .css Datei eintragen. Hier mal ein View von mir, wie er mit Firebug angezeigt wird (Hab jetzt nicht jedes Element in der Baumstruktur ausgeklappt. Der angelegte View heißt Portfolio:
<div class="view view-portfolio view-id-portfolio view-display-id-page view-dom-id-865efce008e8ee75c17b9318f2f1e060">
<div class="view-content">
<table class="views-view-grid cols-3">
<tbody>
<tr class="row-1 row-first">
<td class="col-1 col-first">
<td class="col-2">
<td class="col-3 col-last">
</tr>
<tr class="row-2 row-last">
</tbody>
</table>
</div>
</div>
Willst du die Tabellen Spalten stylen, schreibst du in deine style.css:
.view-portfolio td { padding 10px 0 10px 5px; border: solid 2px grey; }
für view-portfolio musst du natürlich deinen view einsetzen. So machst du das dann mit jedem Element, das du stylen willst , zBsp.:
.view-portfolio a { font-size: 14px; color: red; .........}
Wenn die Klassen nicht ausreichen, kannst du im View auch eigene HTML Elemente definieren und diesen eigene Klassen zuweisen.
Dazu einfach das jeweilige Feld aufrufen ----> Design Einstellungen -----> Haken bei "HTML Code des Feldes anpassen" setzen ----> CSS Klasse zufügen und wie üblich über die .css Datei formatieren.
Cool ;) Danke. Ist ja doch
am 27.02.2013 - 11:09 Uhr
Cool ;)
Danke. Ist ja doch einfacher als erwartet :D
Grüße Terindor