Template news_latest.tpl in TL 2.8

**mdoll** · 16.02.2010, 16:53

Hallo,
in der brandneuen 2.8 ist ja das Template news_latest.tpl geändert worden. Nun ist mir folgendes aufgefallen:

Der Templateteil

PHP-Code:


<h2><?php echo $this->linkHeadline; ?></h2>

gibt bei mir folgendes aus:

Code:

<h2><a href="Link zu meinem Artikel" title="Den Artikel lesen: Titel des Beitrags">Titel des Beitrags <span class="invisible">Titel des Beitrags</span></a></h2>

Dann weiter:

PHP-Code:


<?php echo $this->more; ?>

hier wird ebenfalls hinter das "Weiterlesen..." der Beitragstitel gesetzt.

Ich hab jetzt in mein Stylesheet

Code:

.invisible: display:none;

gesetzt, aber ich möchte gerne verstehen, warum diese beiden span-Elemente gesetzt werden?

Danke und Gruß
Mathias

**Sebastian** · 16.02.2010, 18:11

HI

Hilft das: http://https://contao.org/issues/show/1392?

Sebastian

**mdoll** · 16.02.2010, 20:09

Hallo,
hmm, nein, nicht wirklich

Da geht es doch um was anderes, oder?

Ich hab eben nochmal die Forensuche bemüht (sorry, dass ich das nicht gleich gemacht habe), und die Klasse .invisible wird ja herangezogen, um Skiplinks zu verbergen.
Da ich mit Yaml arbeite und das TL-Framework nicht eingebunden habe, wurden diese bei mir nicht mehr verborgen, sondern im FE angezeigt (denn Yaml hat dafür die Klasse .skip).
Ich habe jetzt in meinem CSS den Code für die Klasse aus der system/typolight.css eingefügt:

Code:

.invisible{width:0px;height:0px;left:-1000px;top:-1000px;position:absolute;overflow:hidden;display:inline;}

Mir ist trotzdem nicht klar, warum dies in der news_latest.tpl an diesen Stellen (Headline und Read More) vorhanden ist...

Gruß
Mathias

Gruß
Mathias

**Sebastian** · 16.02.2010, 20:44

HI

es ging darum, dass Leute mit Screenreader mehr erfahren also nur „Weiterlesen“, wenn ich mich recht erinnere.

Ha: http://https://contao.org/issues/show/1068

Sebastian

**wolkenstein** · 18.02.2010, 08:56

Hi Leute

Kleine Frage, bei mir funktioniert das invisible nicht. Der Text bleibt stets sichtbar. Code im Template:

Code:

<div class="layout_short block<?php echo $this->class; ?>">
<?php if ($this->hasMetaFields): ?>
<?php endif; ?>
<p class="newsTitle"><?php echo $this->linkHeadline; ?></p>
<p class="teaser"><?php echo $this->teaser; ?><br />
<?php if ($this->text): ?>

<span class="newsDate"><?php echo $this->date; ?></span></p>
<?php endif; ?>
</div>

CSS:

Code:

.invisible{overflow:hidden;display:none;visibility: hidden;}

ich habe auch schon den oben angegebenen Code eingebaut, hat auch nicht funktioniert. Egal was ich in die invisible-Klasse hineinschreibe, es wird ignoriert. Ich steh auf dem Schlauch...

Danke für Eure Inputs.

**mdoll** · 18.02.2010, 09:40

Hallo,

guck mal mit Firebug, ob die CSS-Anweisung überhaupt vom Browser interpretiert wird. Und lösch mal Deinen Browsercache, evtl. ist da noch das alte Stylesheet drin.

Gruß
Mathias

**pmmueller** · 18.02.2010, 13:25

Zitat von wolkenstein

Kleine Frage, bei mir funktioniert das invisible nicht.

Hast du einen Link zu der entsprechenden Seite? Dann könnten wir schnell schauen, ob das CSS den Weg zum HTML findet.

**pmmueller** · 18.02.2010, 13:41

Zitat von mdoll

Da ich mit Yaml arbeite und das TL-Framework nicht eingebunden habe, wurden diese bei mir nicht mehr verborgen, sondern im FE angezeigt (denn Yaml hat dafür die Klasse .skip).

Ich hatte das gleiche Problem, habe aber einfach den Style aus der base.css in meine content.css kopiert und um .invisible ergänzt:

Code:

/* 2010-02-16, TL Update auf V2.8 - Kopie aus base.css plus .invisible */
 .invisible, .skip, .hideme, .print {
    position:absolute;
    top:-32768px;
    left:-32768px; /* LTR */
  }

Zitat von mdoll

Mir ist trotzdem nicht klar, warum dies in der news_latest.tpl an diesen Stellen (Headline und Read More) vorhanden ist..

Mir auch nicht wirklich. In der h3-Beitragsüberschrift erscheint die Überschrift im Link jetzt doppelt, einmal mit und einmal ohne <span class="invisible">. Und beim "Weiterlesen" steht bei mir im HTML die Überschrift des Beitrags schon im Attribut title des Hyperlinks, und kommt jetzt noch einmal im span hinterher.

Screenreader-Benutzer müssten doch zumindest in der Überschrift eigentlich beides vorgelesen bekommen?

**wolkenstein** · 18.02.2010, 13:56

Dann könnten wir schnell schauen, ob das CSS den Weg zum HTML findet.

Hat es nicht... Ich habe in den letzten Wochen einige Typolight-Seiten gebaut und nur bei der einzigen habe ich auf ein eigenes Template gesetzt. Wenn man die Daten im richtigen CSS-File einträgt, gehts... Danke für die Hinweise, manchmal sieht man den Wald vor lauter Bäumen nicht.

Screenreader-Benutzer müssten doch zumindest in der Überschrift eigentlich beides vorgelesen bekommen?

Sehe ich auch so.