Hallo, ich habe ein für euch wohl sehr einfaches Problem, bin aber irgendwie zu dumm es selbst hinzubekommen :
Ich möchte in der List und Single dass die Bilder am linken rand erscheinen und der Text recht drum herum fliesst.
Habe die Starndard CSS und Standard Template, hier der ausschnitt der Template Datei:
<!-- ###TEMPLATE_LIST### begin
This is the template for the list of news in the archive or news page or search
-->
<div class="news-list-container">
###NEWS_CATEGORY_ROOTLINE###
<!-- ###CONTENT### begin
This is the part of the template substituted with the list of news:
-->
<!-- ###NEWS### begin
Template for a single item
-->
<div class="news-list-item">
<h3><!--###LINK_ITEM###-->###NEWS_TITLE###<!--###LINK_ITEM###--></h3>
###NEWS_IMAGE### ###NEWS_SUBHEADER###
###CATWRAP_B### ###TEXT_CAT### ###NEWS_CATEGORY### ###NEWS_CATEGORY_IMAGE### ###CATWRAP_E###
<div class="news-list-morelink"><!--###LINK_ITEM###-->###MORE###<!--###LINK_ITEM###--></div>
<hr class="clearer" /></div>
<!-- ###NEWS### end-->
<!-- ###CONTENT### end -->
<div class="news-list-browse">###BROWSE_LINKS###</div>
</div>
<!-- ###TEMPLATE_LIST### end -->
Habe dort den Marker ###news_image### links von dem Text angegeben, er bringt mir das Bild aber immer am rechten Rand und der Text fliesst links daran vorbei.
Was mache ich nur falsch??
Vielen Dank im voraus!
Grüße Hardy
Moin!
Hübsche Idee 😉 , aber der falsche Ansatz. Über den Marker wird ja nur gesagt, wo tt_news den Inhalt, sprich den HTML-Code, hinpacken soll. Da werden dann ein paar <div...>, <a href...>, <p...> etc. reingepackt. Die eigentliche Steuerung, wie was wo hinkommt, geschieht in der Regel dann über CSS. Und genau da ist dein Ansatzpunkt! Grundsätzlich wird ja vom Browser der HTML-Code "der Reihe nach abgearbeitet". Aber eine Anweisung wie :float verändert diese Regel etwas.
In der CSS-Datei zu tt_news steht
.news-single-img {
float: right;
margin-left:5px;
}
Das musst du anpassen. Wenn nicht bereits geschehen, dann solltest du jetzt die originale tt_news CSS-Datei in einen passenden Ordner in fileadmin kopieren. Du findest die originale Datei in typo3conf/ext/tt_news/res/tt_news_v2_styles.css
Hilfreich für das kopieren, verschieben und bearbeiten von Dateien ist übrigens die Extension t3quixplorer.
Jetzt noch im Root-Template deiner Seite im Setup folgenden Eintrag:
plugin.tt_news {
//* Überschreiben der Default-Formatierung der News *//
//* Die Formatierung muss dann über eine selbst eingebundene CSS-Datei erfolgen *//
_CSS_DEFAULT_STYLE >
....
Das oben erwähnte einbinder der eigenen tt_news CSS-Datei nicht vergessen!"
Und jetzt in der kopierten Version die CSS-Anweisung anpassen auf z.B.
.news-single-img {
float: left;
margin-right:5px;
}
Ggf. musst du noch ein Teil der CSS-Anweisungen für den single-view anpassen, damit das Gesamtbild stimmig wird.
Grüße
Erwin