Startseite
  • » Home
  • » Handbuch & FAQ
  • » Forum
  • » Übersetzungsserver
  • » Suche
Startseite › Forum › Drupalcenter.de › Module ›

[gelöst] Views Accordion - Header Elemente nebeneinander

Eingetragen von inst (290)
am 09.02.2012 - 12:07 Uhr in
  • Module
  • Drupal 7.x

Hallo,
ich hab eine View mit dem Style Views Accordion erstellt.

Im Header-Bereich des Accordion Elementes habe ich folgende Elemente:

Bild
Titel
Ort - Uhrzeit

Bei Klick auf den Header klappt der dazugehörige Text auf und dann schaut die Ansicht so aus:

Bild
Titel
Ort - Uhrzeit
-------------------------
Text

NUN möchte ich aber im Header das Bild links haben und den Rest rechts, also so:

Bild Titel
Ort - Uhrzeit

Ich habe versucht auf das Bild ein float:left anzuwenden aber das haut dann Layout des Accordion Elementes zusammen.
Weiss wer von euch wie ich zum Zile komme?

danke!

‹ Webform Fortschritt zeigen z.B.: "Seite 3 von 5" [gelöst]Media Gallery- Keine Ansicht der Bilder ›
  • Anmelden oder Registrieren um Kommentare zu schreiben

Hast Du Dir schon mal die

Eingetragen von wla (9334)
am 10.02.2012 - 18:26 Uhr

Hast Du Dir schon mal die Option "rewrite the output of this field" angesehen? Ich würde bei Bild und Titel (und Ort?) den Haken machen "von der Anzeige ausschließen" und dann beim letzten Feld die Ausgabe selbst vornehmen inklusive eines <br /> an der gewünschten Stelle. Views stellt Dir dazu "Ersetzungstokens" zur Verfügung, die bereits den fertigen Inhalt bereitstellen, sodaß Du selbst außer dem <br /> nichts an HTML zufügen mußt.

Beste Grüße
Werner

.
Werner
drupal-training.de
Moderator und Drupal Trainer
* - - - - - - - - - - - - - - - - - - - - - - - - - - - *

  • Anmelden oder Registrieren um Kommentare zu schreiben

Jep, so hab ich eine View

Eingetragen von inst (290)
am 10.02.2012 - 20:44 Uhr

Jep, so hab ich eine View erstellt.

Insgesamt hab ich diese Felder:

Inhalt: Projektorte -> Exclude from display
Inhalt: Projektpersonen -> Exclude from display
Inhalt: Projektzeitraum -> Exclude from display
Inhalt: Projektfoto -> Exclude from display
Inhalt: Titel ->Rewrite Results
Inhalt: Body
Inhalt: Verweise auf Werke

"Inhalt: Titel ->Rewrite Results" ist das was in dem Header aufscheint, der als Trigger funktioniert:

[field_projekte_foto]

[title]

[field_projekte_zeitraum] [field_projekte_orte]

[field_projekte_personen]

Ich krieg dann auch solgende Anzeige:

Bild
zeitraum, projekte
personen

Aber im Header möchte ich nun links nur das Bild und rechts den text, also so:

Bild zeitraum, projekte
personen

Kann ich ein float:left im View für das Bild einbauen ?

dank dir.-
vg,fr

  • Anmelden oder Registrieren um Kommentare zu schreiben

Und warum schreibst Du die

Eingetragen von wla (9334)
am 10.02.2012 - 21:11 Uhr

Und warum schreibst Du die Felder dann nicht so nebeneinander, wie Du sie gern hättest? Also
[field_projekte_foto][field_projekte_zeitraum] [field_projekte_orte]
[field_projekte_personen]
Du kannst, wenn das Dein Problem ist, im View ja auch mehrere Displays definieren, die die Felder in unterschiedlicher Reihenfolge ausgeben.
So richtig verstehe ich Dein Problem nicht.

Beste Grüße
Werner

.
Werner
drupal-training.de
Moderator und Drupal Trainer
* - - - - - - - - - - - - - - - - - - - - - - - - - - - *

  • Anmelden oder Registrieren um Kommentare zu schreiben

screenshots

Eingetragen von inst (290)
am 11.02.2012 - 08:11 Uhr

OK ich hab dir 2 Screenshots gemacht, so schauts aus, wenn ich das so mache wie von dir beschrieben:

[field_projekte_foto][field_projekte_zeitraum] [field_projekte_orte]
[field_projekte_personen]

views bsp screenshot 2

Und hier will ich hin (das hab ich jetzt in Photoshop montiert)

views bsp screenshot 3

vg, frank

  • Anmelden oder Registrieren um Kommentare zu schreiben

sorry, der 2te Link war

Eingetragen von inst (290)
am 11.02.2012 - 08:13 Uhr

sorry, der 2te Link war falsch - hier will ich hin:

views bsp screenshot 3

vg, frank

  • Anmelden oder Registrieren um Kommentare zu schreiben

Dann mußt Du eben ein bißchen

Eingetragen von wla (9334)
am 11.02.2012 - 12:38 Uhr

Dann mußt Du eben ein bißchen mehr HTML-Code einfügen und dann mit CSS den Rest, wie die Fontsize nacharbeiten. Könnte etwa so gehen

<div><span class="xxx">[field_projekte_foto]</span><span class="xxx"><div><p class="zeile1">[field_projekte_zeitraum] [field_projekte_orte]</p><br /><p class="zeile2">[field_projekte_personen]</p></div></span></div>

Und im CSS unter anderem
span.xxx {
  display: inline-block;
}
span.xxx div {
  margin: auto;
}
p.zeile1 { font-size: ....}
p.zeile2 { font-size: ....}

Ich habe das jetzt nicht selbst ausprobiert, aber das ist in etwa die Richtung. Es läuft alles auf Basis-Kenntnisse in HTML und CSS hinaus. Daran mußt Du offensichtlich noch arbeiten.

Beste Grüße
Werner

.
Werner
drupal-training.de
Moderator und Drupal Trainer
* - - - - - - - - - - - - - - - - - - - - - - - - - - - *

  • Anmelden oder Registrieren um Kommentare zu schreiben

Genau so denke ich auch

Eingetragen von Patrick Schanen (515)
am 11.02.2012 - 16:29 Uhr

Genau so ist die Lösungen wie Werner Sie erklärt

  • Anmelden oder Registrieren um Kommentare zu schreiben

ausprobiert

Eingetragen von inst (290)
am 13.02.2012 - 09:32 Uhr

Ja du hast vollkommen Recht.- Obwohl es in Drupal möglich so viel ohne wirklich umfangreiche HTML/CSS Kenntnisse, die über ein Verändern von Textgrößen, Farben usw. hinausgehen, braucht man es unbedingt falls man etwas so und nicht anders machen will. Da werd ich wohl noch eineiges nachholen müssen.

Danke nochmal für dein Beispiel, es hat auch hingehauen. Das einzige Problem ist, wenn ein Feld mehr als eine Zeile beansprucht.

* Hier mit einer Personnenzeile:

views accorion screenshot5

* Hier mit mehr mehreren Personen, dann rutschen die Personen und alles andere auch wieder unter das Bild anstatt rechts vom Bild:

views accorion screenshot4

---------------------------------------------------------------------

So hab ich das in Views gemacht:

<div><span class="acclayout">[field_projekte_foto]</span><span class="acclayout"><div>
<p class="zeile0">[title]</p>
<p class="zeile1">[field_projekte_zeitraum] [field_projekte_orte]</p>
<p class="zeile2">[field_projekte_personen]</p>
</div></span></div>

---------------------------------------------------------------------

Das ist meine CSS:

/* Views Accordion Header Layout */

span.acclayout {
  display: inline-block;
  line-height: 0.5em;
  margin-right: 1em;
}
span.acclayout div {
  margin: auto; 
}

/*Titel*/
p.zeile0 { font-size: 1.2em;
font-weight: 800;
color: #E4100C;
}

/*Zeit/Ort*/
/*p.zeile1 { }*/


/*Personen*/
p.zeile2 { line-height: 1em;}

  • Anmelden oder Registrieren um Kommentare zu schreiben

Dann mußt Du im CSS die

Eingetragen von wla (9334)
am 13.02.2012 - 10:51 Uhr

Dann mußt Du im CSS die Breite der p.zeilex begrenzen, damit das nicht passiert.

Beste Grüße
Werner

.
Werner
drupal-training.de
Moderator und Drupal Trainer
* - - - - - - - - - - - - - - - - - - - - - - - - - - - *

  • Anmelden oder Registrieren um Kommentare zu schreiben

danke nochmal

Eingetragen von inst (290)
am 13.02.2012 - 11:02 Uhr

Super, ja wenn ich mit width in CSS die Zeile begrenze passt es wunderbar.

Vielen Dank nochmal!

  • Anmelden oder Registrieren um Kommentare zu schreiben

Tja, CSS-Kenntnisse

Eingetragen von wla (9334)
am 13.02.2012 - 11:42 Uhr

Tja, CSS-Kenntnisse .......
Wenn das Problem damit für Dich gelöst ist, dann markiere bitte noch den Thread als gelöst ([gelöst] vor der ersten Titel im Thread setzen).

Beste Grüße
Werner

.
Werner
drupal-training.de
Moderator und Drupal Trainer
* - - - - - - - - - - - - - - - - - - - - - - - - - - - *

  • Anmelden oder Registrieren um Kommentare zu schreiben

Benutzeranmeldung

  • Registrieren
  • Neues Passwort anfordern

Aktive Forenthemen

  • Grundsatzfrage
  • Drupal 9 Hosting
  • Seite auf Xamp wird nicht geladen
  • Anregung für die Installation von Drupal
  • [simplenews_stats] [D10] Keine Öffnungen/Ansichten der Newsletter werden gezählt
  • Theme Olivero - Rand entfernen?
  • Olivero veraendern
  • Upgrade Drupal 9 auf 10
  • Matomo(?) in Seite, aber Deinstalliert!
  • Upgrade Drupal 7 auf Drupal 9 / Inhalt erstellen zeigt nur Fehler an
  • Fehlermeldung nach Update auf Drupal 10
  • Wie Button erstellen?
Weiter

Neue Kommentare

  • Dschungel triffts ganz gut
    vor 11 Stunden 58 Minuten
  • Grundsatzfrage
    vor 1 Tag 8 Stunden
  • Schlichte Antwort: Ja, das
    vor 1 Tag 9 Stunden
  • Hallo! Welchen Host nutzt du
    vor 2 Tagen 14 Stunden
  • Also bei mir funktioniert es
    vor 2 Tagen 15 Stunden
  • Hat mir auch sehr geholfen,
    vor 2 Tagen 15 Stunden
  • Releases Stand 20-9-2023
    vor 3 Tagen 23 Stunden
  • Hi, Das ist leider nicht das
    vor 4 Tagen 18 Stunden
  • Wie plötzlich passierte
    vor 5 Tagen 22 Stunden
  • Sowas geht immer mit
    vor 1 Woche 21 Stunden

Statistik

Beiträge im Forum: 248812
Registrierte User: 19836

Neue User:

  • Thorsten Kötter
  • inklusion
  • sofortnovo

» Alle User anzeigen

User nach Punkten sortiert:
wla9334
stBorchert6003
quiptime4972
Tobias Bähr4019
bv3924
ronald3845
md3717
Thoor3678
Alexander Langer3416
Exterior2903
» User nach Punkten
Zur Zeit sind 1 Benutzer und 3 Gäste online.

Benutzer online

  • caw

Hauptmenü

  • » Home
  • » Handbuch & FAQ
  • » Forum
  • » Übersetzungsserver
  • » Suche

Quicklinks I

  • Infos
  • Drupal Showcase
  • Installation
  • Update
  • Forum
  • Team
  • Verhaltensregeln

Quicklinks II

  • Drupal Jobs
  • FAQ
  • Drupal-Kochbuch
  • Best Practice - Drupal Sites - Guidelines
  • Drupal How To's

Quicklinks III

  • Tipps & Tricks
  • Drupal Theme System
  • Theme Handbuch
  • Leitfaden zur Entwicklung von Modulen

RSS & Twitter

  • Drupal Planet deutsch
  • RSS Feed News
  • RSS Feed Planet
  • Twitter Drupalcenter
Drupalcenter Team | Impressum & Datenschutz | Kontakt
Angetrieben von Drupal | Drupal is a registered trademark of Dries Buytaert.
Drupal Initiative - Drupal Association