Newsbeiträge - Tabellarisch Anzeigenlassen mit und Ohne Kategorie Filterung

Hallo

Ich möchte gerne, das meine Newsbeiträge, genauer die deren Teaser, auf meiner Startseite zu sehen sind. Und wenn es mehr als Sechs Beiträge sind, sollen diese nicht nur untereinander, sondern auch nebeneinander angezeigt werden. Ist das mit Conto überhaupt möglich ? Und wenn ja- wie ?

Diese Anzeige soll, dann auch bei der jeweiligen Kategorien, auch so weiter geführt werden, nur das in dem fall, noch die durch die Filterung der entsprechenden Kategorien zusätzlich durchgeführt wird. Das auch wirklich nur der Beitrag zu der entsprechende Kategorie angezeigt wird.

Ich würde mich sehr freuen, über euere Hilfe

Mit freundlichen Grüßen
Schuberth



p.s.

auf um-welt.info sehen ihr die Seite, wie sie ungefähr haben möchte - nur eben mit Conto umgesetzt, weil ich meine das man damit zunkunft sicherer ist, als mit PragmaMX.

Erweitere Dein Newstemplateum : $this->showTemplateVars();

Dann schaue in der Ausgabe ob es eine Variable gibt, die den die Anzahl der News insgesamt zählt.
Sofern es die gibt kannst Du diese mit PHP auslesen und abhängig von der Zahl eine Klasse für CSS setzen.

Bei weniger als 6 News könntest Du die CSS-Klasse one-column nennen, bei mehr als 6 two-columns.
Abhängig der Klassen kannst Du die News dann entweder auf 100%Breite oder auf float: left und 50% Breite setzen.

Erzeuge dir ein eigenes mod_newlist Template und ersetze

PHP-Code:

---

<?php foreach ($this->articles as $article) echo $article; ?>

---

mit

PHP-Code:

---

  <?php 
  $chunks = array_chunk( $this->articles, 6 );
  for( $i = 0; $i < $chunks && $i < 3; ++$i ): ?>
  <div class="chunk">
      <?php foreach( $chunks[$i] as $article ) echo $article; ?>
  </div>
  <?php endfor; ?>

---

Ich habe ein eigene mod_newslist.html5 erzeugt, leider ist der oben genannte zu ersetzen PHP Code nicht vorhanden, sondern nur folgende:

Code:

---

<?php $this->extend('block_unsearchable'); ?>

<?php $this->block('content'); ?>

  <?php if (empty($this->articles)): ?>
    <p class="empty"><?php echo $this->empty; ?></p>
  <?php else: ?>
    <?php echo implode('', $this->articles); ?>
    <?php echo $this->pagination; ?>
  <?php endif; ?>

<?php $this->endblock(); ?>

---

In dem Fall musst du

PHP-Code:

---

<?php echo implode('', $this->articles); ?>

---

ersetzen.

Und wo muss ich die "class" noch eingeben, das ab dem 4 Beitrag in die zweite spalte kommt ?


diesen Code habe in das selbst erstellte mod_newslist.html5 eingefügt bzw. ersetzt:

Zitat:

---

<?php
$chunks = array_chunk( $this->articles, 4 );
for( $i = 0; $i < $chunks && $i < 3; ++$i ): ?>
<div class="chunk">
<?php foreach( $chunks[$i] as $article ) echo $article; ?>
</div>
<?php endfor; ?>

---

Was meinst du mit 'class eingeben'? Dieser Code hat als Resultat, dass immer 4 News Einträge von einem <div class="chunk">…</div> gewrapped sind. Die Klasse dieses HTML Elements kannst du natürlich nach belieben ändern.

Zitat:

---

Zitat von Spooky

Was meinst du mit 'class eingeben'? Dieser Code hat als Resultat, dass immer 4 News Einträge von einem <div class="chunk">…</div> gewrapped sind. Die Klasse dieses HTML Elements kannst du natürlich nach belieben ändern.

---

Jetzt bin erstmal
???

Den ich momentan 5 Artikel eingetragen, diese werden aber nur untereinander dargestellt. Irgendwo muss ich bestimmt doch noch eintragen, das ab dem 4 Artikel die zweite spalte
genutzt wird. Danach frage ich eigentlich.

noch einen guten Abend wünscht euch
Schuberth

Das musst du natürlich selbst per CSS machen. Verwendest du ein Grid Framework?

Soweit bin ich nicht -> Newbis<-

Ich benutze bis jetzt nur ein eignes Theme und die veränderte Conto Template die ursprünglich von Contao dupliziert wurde.

Wie ich schon mal erwähnt haben, versuche ich von euch, Video Schulung, und Literatur besser über Contao schlau zu werden. Den ich wollte mal
zukunft sicheres CMS nutzen, als das vorherige. ( pragmaMX.de)

Zitat:

---

Zitat von Spooky

Das musst du natürlich selbst per CSS machen. Verwendest du ein Grid Framework?

---

Ich nutze kein Grid Framwork,
und mit CSS kenne ich mich noch leider nicht so qut aus.

Aber diese Erweiterungen bestehen aus CSS und Javascript, wenn ich das richtig verstehen haben?,
und sind dafür da,
das die Seite auf der Internetseite immer gut aussieht, egal wie gross das Browserfenster ist.

Aber da kann man doch nur Module nebeneinander einfügen, oder gibt es ein Grid oder eine Erweiterung, die mir helfen könnte,
meine Narichten-Beiträge nebeneinander und untereinander auf der Startseite zu veröffentlichen.

Zweite bräuchte diese Darstellung auch nochmal, auch die entsprechende Kategorien gefiltert.
So das nur unter der Kategorie Literatur -> nur alle Artikel angezeigt werden wie die unter dieser und ihrer Tochterkategorien angelegt sind.
also meine Fall wäre

z.b.
Hauptkategorien 1 Literatur->
Tochterkategorien T1 Zeitschriften
Tochterkategorien T2 Krimi
Tochterkategorien T3 Sachbuch

Hauptkategorien 2 Ernährung ->
Tochterkategorien 2T1 Lebensmittel


unter Hauptkategorien 1 sollen alle Narichtenbeiträge angezeigt werden, die unter Literatur, Sachbuch, Zeitschriften, Krimi angelegt sind.

und so weiter, vielen Dank
für euere Geduld

Ich möchte erst einmal sicher gehen, dass ich dein Anliegen auch richtig verstehe ;)

Auf der im Eingangsbeitrag verlinkten Seite sieht man ja, dass alle Beiträge / Teaser alle gleich hoch dargestellt werden. Auch glaube ich zu erkennen, dass hier die Beiträge nach Datum absteigend geordnet sind und abwechselnd links und rechts stehen. Also nicht die ersten drei links, die letzten drei rechts.

Was soll bei weniger als sechs Beiträgen passieren? Sollen dann die Teaser über die volle Breite dargestellt werden oder einfach in der linken der beiden gewünschten Spalten?

Zitat:

---

Zitat von tab

Ich möchte erst einmal sicher gehen, dass ich dein Anliegen auch richtig verstehe ;)

Auf der im Eingangsbeitrag verlinkten Seite sieht man ja, dass alle Beiträge / Teaser alle gleich hoch dargestellt werden. Auch glaube ich zu erkennen, dass hier die Beiträge nach Datum absteigend geordnet sind und abwechselnd links und rechts stehen. Also nicht die ersten drei links, die letzten drei rechts.

---

gut gesehen, übrigens wollte ich das man Sehen konnte unter welcher Kategorien, abgelegt sind. Es hätte schon gereicht, wenn es die Letzte Kategorie angezeigt wurde.
Das Modul lies ich damals für PMX entwickeln, nur das der Entwickler das Programm in sein Programm eingebaut hat und nicht, und nicht wie eigentlich gewünscht hätte das dies ein eigenständiges Modul sein soll. Die Bezeichnungen, haben bei dem alten CMS PragmaMX nicht unbedingt die Bedeutungen, wie bei Contao

Zitat:

---

Zitat von tab

Was soll bei weniger als sechs Beiträgen passieren? Sollen dann die Teaser über die volle Breite dargestellt werden oder einfach in der linken der beiden gewünschten Spalten?

---

Was sieht den besser aus ?

Entweder ein Teaser Text, der Eng steht und nebenan viel Platzt.
Oder ein Teaser Text manchmal nur ein reihe gross ist und dann unten viel Platzt.

Ich glaube das der Text in der Linke Spalte sein sollte.

Also für die zweispaltige Ausgabe könnte das mod_newslist.html5 Template in etwa so aussehen:

PHP-Code:

---

<?php $this->extend('block_unsearchable'); ?>

<?php $this->block('content'); ?>

  <?php if (empty($this->articles)): ?>
    <p class="empty"><?php echo $this->empty; ?></p>
  <?php else:
      $chunks = array_chunk($this->articles,2);
      $n_chunks = count($chunks);
      for ( $i = 0; $i < $n_chunks; ++$i ): ?>
        <div class="news_container block">
        <?php foreach( $chunks[$i] as $article ) echo $article; ?>
      </div>
    <?php endfor; ?>
  
    <?php echo $this->pagination; ?>
  <?php endif; ?>

<?php $this->endblock(); ?>

---

Damit hast du um je zwei Nachrichten ein umschliessendes <div>. Die einzelnen Nachrichten kannst du dann da drin z.B. floaten, gibt aber auch andere Möglichkeiten. Mit floaten könnte es ganz grob so aussehen wie unten, um die ganzen Borders musst du dich halt noch kümmern falls du die willst. Ich habe da jetzt mal nur 10% Zwischenraum eingebaut zwischen rechter und linker Spalte. Kann man natürlich auch mit Padding erreichen, ganz nach Belieben :D.

HTML-Code:

---

.layout_latest {
  float: left;
  width: 45%;
}
.layout_latest:nth-child(odd) {
  margin-right: 10%;
}

---

Ich habe noch einige Probleme um diese Code auch endlich aktivbar zu machen, keine oder sehr sehr sehr wenig CSS erfahrungen, welches Buch oder CSS Kurs für Contao können ihr mir helfen.

Denn folgendes habt ich nun gemacht:

PHP-Code:

---

<?php $this->extend('block_unsearchable'); ?> 

<?php $this->block('content'); ?> 

  <?php if (empty($this->articles)): ?> 
    <p class="empty"><?php echo $this->empty; ?></p> 
  <?php else: 
      $chunks = array_chunk($this->articles,2); 
      $n_chunks = count($chunks); 
      for ( $i = 0; $i < $n_chunks; ++$i ): ?> 
        <div class="news_container block"> 
        <?php foreach( $chunks[$i] as $article ) echo $article; ?> 
      </div> 
    <?php endfor; ?> 
   
    <?php echo $this->pagination; ?> 
  <?php endif; ?> 

<?php $this->endblock(); ?>

---

Die oben genannte Code habe ich in einer Template Kope namens mod_newsliste2.html reibkopiert.


Es sind doch die zwei class:

empty
news_conatiner block

in
das Modul N-Liste eingefügt , natürlich mit kommen getrennt.

und mittels internen Contao CSS Editor, habt ich folgende:

code schon eingefügt:

Code:

---

mod_newsliste2 {
    width:45%;
    float:left;
    margin-right:10%;

---

vielen Dank für euere Mühe

Mit freundlichen Grüßen
Thomas Schuberth

Ein HTML-Element mod_newsliste2 gibt es nicht und wird vom Template auch nicht ausgegeben. Deswegen gehe ich davon aus, dass dein CSS gar nichts bewirkt.

Was ausgegeben wird durch $this->empty weiss ich ehrlich gesagt gar nicht, wird wohl hoffentlich nicht viel sein. Dein Template sollte auch mod_newslist2.html5 heißen. In meinem Code ist auch noch nicht berücksichtigt, dass du erst ab 6 Nachrichten zweispaltig ausgeben willst. Die Klasse news_container habe ich auch erst mal nur vergeben, damit das Ding einen Namen hat. Also, falls du z.B. einen Rahmen um alle Container machen willst, dann kannst du im CSS diese Klasse benutzen. Die Klasse block bewirkt im Zusammenspiel mit dem Layoutbuilder CSS, dass die im Container gefloateten News, die ja in einem div mit der Klasse - je nach verwendetem Template - z.B. layout_latest enthalten sind, auch die von ihnen benötigte Höhe bekommen. Das wird alles direkt vom Template ausgegeben und muss nicht dem Nachrichtenlisten-Modul zugewiesen werden. Und wenn aus irgendeinem Grund doch Klassen zugewiesen werden, dann durch Leerzeichen getrennt ohne Komma(ta).

Das news_latest.html5 Template ist für die Ausgabe der einzelnen News zuständig und weist dem umgebenden div die Klasse layout_latest. Wenn du ein anderes verwendest (news_simple, news_full,...) musst du halt schauen, welche Klasse das ausgegebene div dann hat. Jedenfalls muss dieses div die entsprechende Breite erhalten, maximal 50% abzüglich dessen, was du an Padding und/oder Margin einbaust - und nicht in etwa das div für die Newsliste (Klasse mod_newslist, auch wenn das Template mod_newslist2.html5 heißt). Die komplette Liste umfasst ja alle ausgegebenen News, also beide Spalten.

Zitat:

---

Zitat:

---

Zitat von tab

Ein HTML-Element mod_newsliste2 gibt es nicht und wird vom Template auch nicht ausgegeben. Deswegen gehe ich davon aus, dass dein CSS gar nichts bewirkt.

---

-> das oben genannte habe noch verstanden

Zitat:

---

Was ausgegeben wird durch $this->empty weiss ich ehrlich gesagt gar nicht, wird wohl hoffentlich nicht viel sein.

---

aha

Zitat:

---

Dein Template sollte auch mod_newslist2.html5 heißen.

---

->das ist hier untergegangen

Zitat:

---

In meinem Code ist auch noch nicht berücksichtigt, dass du erst ab 6 Nachrichten zweispaltig ausgeben willst.

---

->Da frage ich mich aber was der Code dann eigentlich bezweckt, wenn die wichtige verlangte Funktionen noch gar nicht eingebaut sind. Übrigens möchte schon nach dem 4 Eintrag, also ab dem 5 Eintrag die nächste Spalte nutzen

Zitat:

---

Die Klasse news_container habe ich auch erst mal nur vergeben, damit das Ding einen Namen hat. Also, falls du z.B. einen Rahmen um alle Container machen willst, dann kannst du im CSS diese Klasse benutzen

---

.

->was wird mit rahmen gemeint, und reicht es aus einfach ein neuer Class Namen einzugeben ?

Zitat:

---

Die Klasse block bewirkt im Zusammenspiel mit dem Layoutbuilder CSS, dass die im Container gefloateten News, die ja in einem div mit der Klasse - je nach verwendetem Template - z.B. layout_latest enthalten sind, auch die von ihnen benötigte Höhe bekommen. Das wird alles direkt vom Template ausgegeben und muss nicht dem Nachrichtenlisten-Modul zugewiesen werden. Und wenn aus irgendeinem Grund doch Klassen zugewiesen werden, dann durch Leerzeichen getrennt ohne Komma(ta)

---

.

Zitat:

---

Das news_latest.html5 Template ist für die Ausgabe der einzelnen News zuständig und weist dem umgebenden div die Klasse layout_latest. Wenn du ein anderes verwendest (news_simple, news_full,...) musst du halt schauen, welche Klasse das ausgegebene div dann hat. Jedenfalls muss dieses div die entsprechende Breite erhalten, maximal 50% abzüglich dessen, was du an Padding und/oder Margin einbaust - und nicht in etwa das div für die Newsliste (Klasse mod_newslist, auch wenn das Template mod_newslist2.html5 heißt). Die komplette Liste umfasst ja alle ausgegebenen News, also beide Spalten.

---

---

->wo soll ich die Class/en eingeben, den irgendwie müssen die Dateien doch verbunden werden.

meinst du damit, das das CSS;

dan wie folgt aussehen könnte:
div class Layout_full block

oder sollt ich das CSS mit .mod_newslist nennen ?

HTML-Code:

---

.layout_latest {
  float: left;
  width: 45%;
}
.layout_latest:nth-child(odd) {
  margin-right: 10%;
}

---

und wo soll diesen oben genannte Code eigentlich einfügen ?
Ich habe dies nun durch das Stylesheets folgendes angegeben:

Code:

---

.mod_newsliste {
    width:45%;
    float:left;
    margin-right:10%;

---

Mit freundlichen Grüßen
Schuberth

Zitat:

---

Da frage ich mich aber was der Code dann eigentlich bezweckt, wenn die wichtige verlangte Funktionen noch gar nicht eingebaut sind. Übrigens möchte schon nach dem 4 Eintrag, also ab dem 5 Eintrag die nächste Spalte nutzen

---

Naja, das <div class="news_container"> war zunächst mal für die Zweispaltigkeit und um zu erreichen, dass die linke und rechte News immer auf derselben Höhe beginnen, so wie in deiner Seite.
Die einspaltige Ausgabe ist ja nun kein großes Ding mehr, da muss halt dann noch eine if-Abfrage rein. Vielleicht komme ich nachher noch dazu.

Die Ausgabe $this->empty wird wohl irgendein Text sein, der sagt, dass es keine Nachrichten gibt. Wird ja auch nur dann ausgegeben, also im "Normalbetrieb" eher nie.

Wegen des Rahmens, da habe ich mich wohl verguckt in deinem Beispiel um-welt.info, hätte ich mal besser die Brille aufgesetzt. Das ist dort nur ein Rahmen um die einzelnen News (dort Tabellenzellen).

Das hier ist das CSS für die zweispaltige Formatierung, das muss in irgendein Stylesheet rein, das in das verwendete Seitenlayout eingebunden wird. Es heißt hier nur HTML-Code, weil es CSS als Formatierung für Text hier im Forum nicht gibt ;)

HTML-Code:

---

.layout_latest {
  float: left;
  width: 45%;
}
.layout_latest:nth-child(odd) {
  margin-right: 10%;
}

---

Das äußere div mit der Klasse mod_newslist umfasst alle Nachrichten. Die Spaltenbreite wird der Box um die einzelne Nachricht zugewiesen. Das ist eben die mit der Klasse layout_latest, falls news_latest als Template zur Formatierung der einzelnen Nachrichten benutzt wird. Das kannst du ja selbst im Newslisten-Modul einstellen. Je nachdem, was dann bei dir im Quelltext steht, musst du eben diese Klasse benutzen im CSS. Wird aber wohl schon auf layout_latest rauslaufen, jedenfalls gemäß deiner Beispiel-Webseite. Den Rahmen um die News habe ich hier noch nicht gemacht, auch dazu komme ich wohl noch. Ich muss jetzt erst circa 2 Stunden was anderes machen.