TYPOlight: News als "Accordion" ausgeben

Samstag: 2. Jan 2010

Bei diesem Beispiel wurde die news_latest.tpl angepasst. Dazu kann entweder im Backend unter Templates diese neu anlegen oder per Hand aus dem Ordner /system/modules/news/templates/ kopieren und in dem Ordner /templates im TYPOlight Root-Verzeichnis ablegen. Wichtig hierbei ist, dass nicht die Coredatei von TYPOlight verändert wird, da diese bei einem Update überschrieben wird.

Template: news_latest.tpl (TYPOlight 2.7.6)

<div class="layout_latest block<?php echo $this->class; ?>">
	<div class="ce_accordion block">
		<div class="toggler"> <span class="toggler_first">
			<h2><?php echo $this->newsHeadline; ?></h2></span>
		</div>
		<div class="accordion">
			<?php if ($this->hasMetaFields): ?>
			<p class="info"><?php echo $this->date; ?> <?php echo $this->author; ?> <?php echo $this->commentCount; ?></p>
			<?php endif; ?>
			<?php if ($this->addImage): ?>
			<div class="image_container"<?php if ($this->margin || $this->float): ?> style="<?php echo $this->margin . $this->float; ?>"<?php endif; ?>>
				<?php if ($this->fullsize): ?>
				<a href="<?php echo $this->href; ?>" title="<?php echo $this->alt; ?>" rel="lightbox">
				<?php endif; ?>
				<img src="<?php echo $this->src; ?>" alt="<?php echo $this->alt; ?>" />
				<?php if ($this->fullsize): ?>
				</a>
				<?php endif; ?>
				<?php if ($this->caption): ?>
				<div class="caption"><?php echo $this->caption; ?></div>
				<?php endif; ?>
			</div>
			<?php endif; ?>
			<p class="teaser"><?php echo $this->teaser; ?></p>
			<?php if ($this->text): ?>
			<p class="more"><?php echo $this->more; ?></p>
			<?php endif; ?>
		</div>
	</div>
</div>

Anmerkung

Die Templatedatei kann auch umbenannt werden. Hierbei ist jedoch wichtig, dass der Präfix news_ erhalten bleibt, da sonst TYPOlight nicht erkennt, um was für eine Templatedatei es sich handelt.

twittern

Tags:

Submitted by David Matter (nicht überprüft) on Sonntag: 31. Jan 2010.

Wow, vielen Dank für die tolle Idee + Umsetzung. Genau das, was ich gesucht habe! Keep up the good work

Antworten

Submitted by John on Sonntag: 31. Jan 2010.

Hey, freut mich, dass ich dir damit helfen konnte. :)

vg,
john

Antworten

Submitted by Christian Frick (nicht überprüft) on Sonntag: 25. Jul 2010.

Perfekt, danach hab ich auch gerade gesucht, danke dir ;)

Antworten

Submitted by John on Sonntag: 25. Jul 2010.

Gern :)

Antworten

Submitted by timo (nicht überprüft) on Mittwoch: 9. Mär 2011.

wie war den dein grundsätzliches vorgehen. ich würde dies gerne für das template news_full.tpl auch machen. aber wie ansetzen?

Antworten

Submitted by John on Mittwoch: 9. Mär 2011.

Hi Timo,
es ist schon einige Zeit her, dass ich das geschrieben habe. Aber wie es aussieht, ist es wichtig, dass es einmal die Klasse toggler gibt, die die Klasse accordion öffnet. Umschlossen werden die beiden Elemente mit den jeweiligen Klassen von einem Element, was die Klasse ce_accordion enthält. Grundsätzlich muss im Contao-Layout das Accordion-Script aktiviert werden. Dieses Script sorgt dafür, dass html-Elemente mit der entsprechenden Syntax angepasst werden.

Dies alles aber gerade nur aus der Hüfte geschossen. Vielleicht hilft es dir schon weiter, sonst schreibe hier noch einmal und ich kann später noch einmal ausführlich gucken.

vg,
john