TYPOLinks

Hyperlinks mit dem TYPO3-eigenen Tag erstellen

"TYPOLinks"? Das sind Hyperlinks, die mit dem TYPO3-eigenen Tag <link> erstellt wurden

Es kann Situationen geben, in denen Sie nicht mit dem Rich Text Editor arbeiten können oder mögen. Auch in solchen Situationen steht Ihnen in diesem CMS ein komfortables Linkmanagement zur Verfügung: TYPOLinks.

Vorzüge von TYPOLinks

Warum sollten Sie TYPOLinks benutzen? 

  • Sie bleiben damit TYPO3-konform. Alle Methoden, die vom System auf Links angewendet werden, stehen den so angelegten Links automatisch zur Verfügung. Das sind insbesondere:
    • korrekte sprechende URLs (in der voreingestellten und der alternativen Sprache)
    • interne Links werden automatisch aktualisiert
  • Sie arbeiten effizienter, weil TYPOLinks wesentlich einfacher zu schreiben sind.

Wo TYPOLinks funktionieren

Der TYPO3 eigene Tag <link> funktioniert in Content Elements vom Typ

  • Text im Textfeld "Text", jedoch nur wenn der Rich Text Editor deaktiviert ist (Häkchen bei "Disable Rich Text Editor" setzen)
  • Text w/Image in den Textfeldern "Text" und "Caption" (in "Text" jedoch nur wenn der Rich Text Editor deaktiviert ist)
  • Image im Textfeld "Caption"
  • HTML im Textfeld "HTML" (TYPO3 verändert HTML-Code nicht, nur der link-Tag wird beim Erzeugen der Seite in syntaktisch korrekten A-Tag übersetzt.)

Der TYPO3-Tag zum Anlegen von Links

Um innerhalb eines TYPO3-Textelements einen Link anzulegen, benutzen Sie den TYPO3-eigenen Tag "<link>". Dieses Schlüsselwort innerhalb von spitzen Klammern umrahmt den klickbaren Text, vorne ohne Slash (/), hinten mit. Groß- oder Kleinschreibung des Schlüsselwortes "link" spielt keine Rolle.

Schematisches Beispiel (noch nicht funktionsfähig):

<link>Klickbarer Text</link>

Pflicht-Argument des link-Tags

Ein Argument mit Angaben über Ziel und/oder Art des Links ist Pflicht. Diesem können weitere Argumente folgen.

Die folgende Tabelle gibt Auskunft über die Syntax des Pflicht-Arguments, die zur Identifikation herangezogenen Zeichen und wie die Angben interpretiert werden.

Wie TYPO3 das Pflicht-Argument eines TypoLinks interpretiert
SyntaxchrBeispielwird interpretiert alserzeugt
stringhomeAlias (an der TUHH nicht verwendbar)int Link
integer123 Seiten-ID()int Link
integer#integer#123#455Seiten-ID#Content-Element-IDint Link
#integer##456benannter Anker (auf aktueller Seite)int Link
integer,integer,123,0PID,typeint Link
integer,integer,string,,123,0,&L=1PID,type,additionalParamsint Link
/string.string/./path/to/file.docPfad zu einer DateiFile Link
string//string //http://www.tuhh.de (Externer) URLURL
string.string/ ./www.tuhh.de/cmsURLURL
string@string@kieselstein@tuhh.deE-Mail-AdresseMail

Nicht dokumentiertes Feature: Kommaseparierte Liste, die bis zu drei Items enthalten kann. Das dritte kann eine beliebige GET-Variable sein. Im Beispiel wird mit '&L=1' der Wechsel in die alternative Seitensprache erzwungen. Mit '&L=0' erzwingen Sie die Defaultsprache.

Link zu einer Seite

Code:

<link 897>zur Startseite (PID 897)</link>

Ergebnis:

zur Startseite (PID 897)

Link zu einer Zwischenüberschrift

Der Sprung zu Zwischenüberschriften innerhalb einer Seite kann automatisch mit dem Content Element "Menu/Sitemap" erzeugt werden. Wie aber, wenn man aus irgend einem Grund einen solchen Link manuell anlegen möchte/muss? 

Dann muss man die ID des Content Elements kennen, zu dem man springen möchte. Die findet man heraus, indem man in der Liste der Content Elements den Mauspfeil zwei Sekunden über dem Icon des betreffenden Content Elements verweilen lässt, bis ein Tooltip sich zeigt mit einem Text wie  id=2289 .

Ist - wie in unserem Beispiel - 2289 die ID des Content Elements, zu dem wir springen (verlinken) möchten, dann lautet das Argument zum Link-Tag "2289".

Beispiel:

<link #2289>Sprung zu blabla</link>

Ergebnis:

Sprung zu Textelement das als Sprungziel dient (am Ende der Seite)

Link zu einer Datei in Ihrem Filesystem

Code:

<link t3resources/cms/pdf/linux.pdf>Administration von Linux-PCs</link>

Ergebnis:

Administration von Linux-PCs

Link zu einer anderen Webseite

Code:

<link www.tuhh.de>www.tuhh.de</link>

Ergebnis:

www.tuhh.de

Link zu einer E-Mail-Adresse

Code:

<link kieselstein@tuhh.de>Schreiben Sie mir!</link>

Ergebnis:

Schreiben Sie mir!

Optionale Argumente des link-Tags

Sie können dem link-Tag bis zu drei optionale Argumente übergeben.

Und zwar an den angegebenen Positionen. Für ein fehlendes Argument setzen Sie ein Minuszeichen '-'.

Optionale Argumente des link-Tags
PosArgumentBemerkungen
2ZielfensterErlaubte Werte:'_blank', '_self', '_parent' oder '_top'
Setzt den Wert des target-Attributs im HTML-Tag
target="<wert>"
3CSS-KlasseSetzt den Wert des class-Attributes im HTML-Tag
class="<wert>"
4Title-Text Beliebiger Text. Muss in Anführungszeichen gesetzt werden , wenn er Leerzeichen enthält. Setzt den Wert des title-Attributes im HTML-Tag
title="<wert>"

Syntax für optionale Argumente im link-Tag

<link url [-|target [-|class [-|title]]]>

Die optionalen Argumente werden in in einer festen Reihenfolge erwartet. Damit ein Argument richtig ausgewertet wird, muss es daher an einer bestimmten Stelle stehen. In einer solchen Situation ist für jedes einem gesetzten Argument vorausgehende "leere" Argument (das kein Attribut im HTML-Tag erzeugen soll) ein Minuszeichen zu setzen. Nachgeordnete leere Argumente werden einfach weggelassen.

Beispiel: Nur das optionale Attribut class="pdf"

<link linux.pdf - pdf>Administration von Linux-PCs</link> 

Ergebnis

Administration von Linux-PCs

Beispiel: target="_blank" und title="Öffnet die Startseite in einem neuen Fenster"

<link 897 _blank - "Öffnet die Startseite in einem neuen Fenster">Startseite in neuem Fenster öffnen</link>

Ergebnis:

Startseite in neuem Fenster öffnen

Überschrift zum Teil klickbar

Sie möchten, dass nur ein Teil einer Überschrift klickbar ist. Kein Problem: Erzeugen Sie eine eigene Überschrift, innerhalb derer Sie einen TYPOLink benutzen.

So geht es Schritt für Schritt

1. Machen Sie die Überschrift des Content Elements unsichtbar: Registerkarte "General" > Bereich "Header" > Auswahlliste "Type" > Option "Hidden"

2. Geben Sie die Überschrift manuell ein und umrahmen Sie sie mit dem geeigneten HTML-Tag für Überschriften: Registerkarte "Text" > Bereich "Text"

Beispiel für eine Überschrift fünften Grades:

<h5>Link zur Startseite</h5>

3. Markieren sie den Teil der Überschrift, der klickbar sein soll, mit einem TYPOLink:

<h5>Link zur <link 897>Startseite</link></h5>

Ergebnis

Link zur Startseite

In obiger Zwischenüberschrift sollte das Wort "Startseite" klickbar sein und bei Klick erwartungsgemäß zur Startseite dieser Dokumentation führen.

Textelement das als Sprungziel dient

Dieses Content Element wurde angelegt, um auf dieser Seite ein Sprungziel zu haben (HTML: "named anchor"). Der folgende Text wurde nur angefügt, damit die Seite lang genug wird, so dass man einen Sprung zu dieser Stelle auch bemerken kann.

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?

At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur magni dolores eos qui ratione voluptatem sequi nesciunt. Neque porro quisquam est, qui dolorem ipsum quia dolor sit amet, consectetur, adipisci velit, sed quia non numquam eius modi tempora incidunt ut labore et dolore magnam aliquam quaerat voluptatem. Ut enim ad minima veniam, quis nostrum exercitationem ullam corporis suscipit laboriosam, nisi ut aliquid ex ea commodi consequatur? Quis autem vel eum iure reprehenderit qui in ea voluptate velit esse quam nihil molestiae consequatur, vel illum qui dolorem eum fugiat quo voluptas nulla pariatur?

At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium voluptatum deleniti atque corrupti quos dolores et quas molestias excepturi sint occaecati cupiditate non provident, similique sunt in culpa qui officia deserunt mollitia animi, id est laborum et dolorum fuga. Et harum quidem rerum facilis est et expedita distinctio. Nam libero tempore, cum soluta nobis est eligendi optio cumque nihil impedit quo minus id quod maxime placeat facere possimus, omnis voluptas assumenda est, omnis dolor repellendus. Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates repudiandae sint et molestiae non recusandae. Itaque earum rerum hic tenetur a sapiente delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat.