- Teambeitrag
Bin gespannt! Ergibt halt Sinn, sich an den Altmeister zu wenden.
Das ist jetzt nicht so ganz einfach da die Vorschau auch BB-Codes anzeigt.
Wie wäre das:
So ok?
Artikelbox - Herobox auch für den WoltLab Blog möglich?
-
Der Inhalt kann nicht angezeigt werden, da Sie keine Berechtigung haben ihn zu sehen. -
Das sieht gut aus, muss ich mal selbst probieren
-
Ich gucke mal drüber, bis da hin ändere diese Zeile ab:
-webkit-line-clamp: 1;
in 3 oder 4
Danke für den Tipp Tom und 2 habe ich gestern auch mal ausprobiert. Leider aber bringt das noch nicht die gewünschte Anzeige. Egal ob ich 2, 3 oder 4 angebe, es schaut immer so aus:
Der Inhalt kann nicht angezeigt werden, da Sie keine Berechtigung haben ihn zu sehen. Im Text ist da aber keine Leerzeile
Und die Punkte (...) werden auch nicht korrekt angezeigt. -
- Teambeitrag
Ok, muss ich dann selbst noch mal testen
Das sieht gut aus, muss ich mal selbst probieren
CSS
Alles anzeigen.boxContent .messageList.messageReducedList { display: flex; flex-wrap: wrap; margin: -10px -10px; > li { margin: 10px; flex-basis: calc(33.33% - 20px); max-width: calc(33.33% - 20px); border-radius: var(--wcfBorderRadius); border: 0 solid var(--wcfContentBorderInner); padding-bottom: 0; border: 1px solid var(--wcfContentBorderInner); .message { height: 100%; } .messageReduced .messageTitle { overflow: hidden; text-overflow: ellipsis; } .messageReduced .messageTitle a { white-space: nowrap; } .messageContent { .messageHeader { order: 3; border-radius: 0 0 var(--wcfBorderRadius) var(--wcfBorderRadius); margin-top: 20px; border-top: 1px solid var(--wcfContentBorderInner); background-color: rgba(0,0,0,0); .messageHeaderMetaData > li:not(:nth-child(1)):not(:nth-child(2)) { display: none; } .messageHeaderMetaData > li:not(:nth-child(1))::after { content: ""; } } .messageBody { order: 1; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 8; } .messageFooter { display: none; } } } } -
Tom ja jetzt verstehe ich deine Zweifel. Nicht wirklich sinnvoll.
-
Kurze Info: Wer so wie ich das originale Stildesign für die Blog Artikel Box haben möchte, nur eben zweispaltig und mit kürzerem Vorschautext (so wie bei der normalen Artikel Box), der kann diesen Code verwenden:
Code
Alles anzeigen/* WoltLab Blog Artikel Box: Zweispalatig + 3 Zeilen Text als Vorschau */ #content { .boxContent .blogEntryList { display: flex; @include screen-lg { .contentItemSingleColumn { flex-basis: calc(100% / 2 - 20px); } } @include screen-sm-md { .contentItemSingleColumn { flex-basis: calc(50% - 20px); } } @include screen-xs { .contentItemSingleColumn { flex-basis: calc(100% - 20px); } } .contentItemDescription { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; } } } -
Hier der Code:
Der CSS-Code scheint in der Version 6.2 nicht mehr zu greifen. Ich vermute, er müsste angepasst werden.
Der Inhalt kann nicht angezeigt werden, da Sie keine Berechtigung haben ihn zu sehen. Ich habe mir jetzt erst mal so beholfen, dass ich den Teaser-Text per CSS ausblenden lasse.
Der Inhalt kann nicht angezeigt werden, da Sie keine Berechtigung haben ihn zu sehen. Code/* Box "Neuste Blog-Artikel" - Artikel-Teaser entfernen */ [data-box-identifier="com.woltlab.blog.LatestEntries"] { .entryCardList__item__teaser { display: none; } }Das sieht nun wenigstens nicht mehr ganz so riesig aus.
Hätte vielleicht noch jemand eine Idee, wie man das im Blog 6.2 umsetzen könnte?
-
- Teambeitrag
Es soll dann so wie hier aussehen:
RE: Artikelbox - Herobox auch für den WoltLab Blog möglich?
So, ich habe den CSS-Code endlich selbst einbauen können und muss sagen, dass mir die Box nun oben drüber sehr gefällt!
Der Inhalt kann nicht angezeigt werden, da Sie keine Berechtigung haben ihn zu sehen.
Und nun nochmal ohne Vorschautext. Gefällt mir sogar noch besser, weil mehr vom Bild zu sehen ist.
Der Inhalt kann nicht angezeigt werden, da Sie keine Berechtigung haben ihn zu sehen.
Vielen Dank, Tom !
?
