Schulungsunterlagen TYPO 3 - www.dataport.de
←
→
Transkription von Seiteninhalten
Wenn Ihr Browser die Seite nicht korrekt rendert, bitte, lesen Sie den Inhalt der Seite unten
Schulungsunterlagen TYPO 3 www.dataport.de Stand: 30.06.2020
Inhaltsverzeichnis
Das Konzept ............................................................................................................................... 6
Datensätze vs. Contentseiten .................................................................................................... 6
Contentseiten ..................................................................................................................................................................................... 6
Seiten aus Datensätzen ................................................................................................................................................................... 6
Kombination aus Contentseite und Datensatz ......................................................................................................................... 7
Was wir bewegen .......................................................................................................................... 7
Themenwelten.................................................................................................................................................................................... 8
Themen ................................................................................................................................................................................................. 8
Projekte und Lösungen .................................................................................................................................................................... 9
Nutzerführung ............................................................................................................................. 10
Das Backend ............................................................................................................................. 11
Menü ............................................................................................................................................... 11
Seitenbaum ................................................................................................................................... 13
Inhaltsbereich .............................................................................................................................. 14
Benutzer-Einstellungen ............................................................................................................ 15
Persönliche Daten .......................................................................................................................................................................... 15
Passwort ........................................................................................................................................................................................... 15
Beim Start ......................................................................................................................................................................................... 15
Inhaltselemente .......................................................................................................................... 16
Hero.................................................................................................................................................................................................... 16
Hero: Seiteninhalt .......................................................................................................................................................................... 16
Hero: Besondere Elemente .......................................................................................................................................................... 16
Inhalt .................................................................................................................................................................................................. 17
Inhalt: Seiteninhalt ......................................................................................................................................................................... 17
Inhalt: Raster ................................................................................................................................................................................... 18
Inhalt: Teaser ................................................................................................................................................................................... 19
Seite | 1
Inhalt: Typischer Seiteninhalt ..................................................................................................................................................... 19
Plug-Ins ............................................................................................................................................................................................. 20
Inhalt: Besondere Elemente ........................................................................................................................................................ 20
Inhalt: Teaser ................................................................................................................................................................................... 21
Inhalt: Typischer Seiteninhalt ..................................................................................................................................................... 22
Inhalt: Menü ..................................................................................................................................................................................... 22
Styleguide ..................................................................................................................................... 23
Basics ......................................................................................................................................... 24
SEO-Grundlagen .......................................................................................................................... 24
Bilder: Dateien korrekt benennen ............................................................................................................................................. 24
Seiten: Title und Description ....................................................................................................................................................... 26
Seiten vom Index ausschließen ................................................................................................................................................. 27
Canonicals setzen ........................................................................................................................................................................... 28
Soziale Medien ................................................................................................................................................................................ 28
Wie lege ich eine neue Seite an? ........................................................................................... 30
Was muss ich bei den Seiteneigenschaften beachten? .................................................. 30
Wie befülle ich eine Seite mit Elementen?......................................................................... 31
Was muss ich beim Rich-Text-Editor (RTE) beachten? ................................................... 32
Texte einfügen ................................................................................................................................................................................ 32
Text-Formatierungen .................................................................................................................................................................... 32
Wie füge ich Verlinkungen ein? ............................................................................................. 34
Interne Seite .................................................................................................................................................................................... 34
Datei zum Download ..................................................................................................................................................................... 34
Externe Url ....................................................................................................................................................................................... 34
E-Mail ................................................................................................................................................................................................. 34
News, Pressemitteilungen, Fachartikel, Veranstaltung, Portfolio ................................................................................... 34
Wann sind Trennlinien notwendig? ...................................................................................... 35
Seite | 2
Wie lade ich eine Datei hoch? ................................................................................................ 35
Bilder ................................................................................................................................................................................................. 35
PDFs ................................................................................................................................................................................................... 35
Video einbetten: YouTube ........................................................................................................................................................... 36
Video zum Download anbieten: mp4 ....................................................................................................................................... 36
Wie pflege ich neue Icons ein? ............................................................................................... 36
Wie lege ich ein neues Formular an? ................................................................................... 38
Formular aufbauen ........................................................................................................................................................................ 38
Formular integrieren ..................................................................................................................................................................... 39
Wie lege ich einen Redirect an?............................................................................................. 40
Workflows ................................................................................................................................ 41
Wie lege ich einen neuen Ansprechpartner/Autor/Team/Vorstand an? .................. 41
Neuer Ansprechpartner ................................................................................................................................................................ 41
Neuer Autor ..................................................................................................................................................................................... 42
Neuer Vorstand ............................................................................................................................................................................... 42
Neues Team...................................................................................................................................................................................... 42
Kontakt einem bestehenden Kontaktanliegen hinzufügen ............................................................................................... 43
Wie stelle ich eine neue Nachricht ein? .............................................................................. 44
Wie stelle ich eine Pressemitteilung ein? ........................................................................... 47
Wie pflege ich einen Fachartikel ein? .................................................................................. 49
Wie lege ich eine neue Veranstaltung an? ......................................................................... 52
Ort anlegen....................................................................................................................................................................................... 52
Veranstaltung anlegen .................................................................................................................................................................. 52
Versteckte Veranstaltungen ........................................................................................................................................................ 55
Was muss ich bei einem aktuellen Vorfall/einer Störungsmeldung tun? ................ 56
Bei einem neuen Vorfall: .............................................................................................................................................................. 56
Bei einem bestehenden Vorfall .................................................................................................................................................. 57
Wenn der Vorfall beendet ist ..................................................................................................................................................... 57
Seite | 3
Wie importiere ich eine xml mit Seminarinhalten (ITBBZ)? ......................................... 58
Wie halte ich die Ausschreibungs-Tabelle aktuell? ......................................................... 58
Zeile löschen .................................................................................................................................................................................... 59
Neue Zeile einfügen ...................................................................................................................................................................... 59
Zeile editieren ................................................................................................................................................................................. 59
Wie lege ich ein neues Kundenzitat an? ............................................................................. 60
Text-Zitat .......................................................................................................................................................................................... 61
Video-Zitat ....................................................................................................................................................................................... 61
Wie lege ich einen Kooperationspartner an? .................................................................... 61
Wie bearbeite ich eine Themenwelt? .................................................................................. 62
Datensatz-Inhalte einer Themenwelt bearbeiten ................................................................................................................. 62
Seiten-Inhalte einer Themenwelt bearbeiten ........................................................................................................................ 64
Wie lege ich ein neues Thema an oder bearbeite ein Bestehendes? ........................ 65
Neues Thema anlegen ................................................................................................................................................................... 65
Bestehendes Thema bearbeiten ................................................................................................................................................ 66
Datensätze bearbeiten ................................................................................................................................................................. 67
Seiten-Inhalte eines Themas bearbeiten ................................................................................................................................. 68
Feinschliff der Themen-Seite...................................................................................................................................................... 70
Wie lege ich ein neues Produkt/Lösung an oder bearbeite ein Bestehendes? ...... 71
Neu anlegen ..................................................................................................................................................................................... 71
Bestehendes Projekt/Lösung bearbeiten ................................................................................................................................ 74
Wie verlinke ich auf ein Projekt oder Lösung? ................................................................ 78
Wie ändere ich die Teaser im Bereich „Was wir bewegen“ auf der Startseite? .... 79
Was muss ich tun, wenn ein Thema/Projekt nicht mehr auf der Website
dargestellt werden soll? ........................................................................................................... 81
Projekte ............................................................................................................................................................................................. 81
Themen .............................................................................................................................................................................................. 82
Seite | 4
Wie ändere ich Standortinformationen? ............................................................................ 83
Gebiete .............................................................................................................................................................................................. 83
Standorte .......................................................................................................................................................................................... 83
Wie lege ich eine neue Productpage (z.B. dDataBox.de) an? ....................................... 85
Wie lege ich eine neue Landingpage (z.B. pki.dataport.de) an? .................................. 87
Was muss ich tun, wenn ein neuer Datareport rauskommt? ....................................... 88
Parallax-Image-Teaser aufbereiten .......................................................................................................................................... 88
Teaser für Printausgabe ............................................................................................................................................................... 90
Datareport-Übersicht .................................................................................................................................................................... 90
Wie pflege ich einen neuen Geschäftsbericht ein? .......................................................... 92
Seite | 5
Das Konzept
Datensätze vs. Contentseiten
Die Inhalte der Website befinden sich auf verschiedenen Arten von Seiten:
Contentseiten
Hier werden Seiten im Seitenbaum angelegt und im Anschluss Content-Elemente
eingepflegt. Einige der Elemente müssen dafür in speziellen Rastern platziert
werden, einige sind nur für bestimmte Bereiche vorgesehen. Raster- und Content-
Elemente können nachträglich editiert oder in ihrer Position verschoben werden.
Beispiel für Contentseiten im Seitenb aum
Seiten aus Datensätzen
Für Seiten, die aus Datensätzen generiert werden, wird im Seitenbaum nur eine
Seite angelegt. Auf dieser Seite werden über ein Plugin die gewünschten Inhalte
ausgegeben. Die Reihenfolge der Inhalte innerhalb eines Plugins ist vordefiniert
und kann nachträglich nicht mehr verändert werden.
Vorteil: Seiten aus Datensätzen müssen nicht jedes Mal von Grund auf neu
aufgebaut werden, die Inhalte werden hier einfach in die entsprechenden
Formularfelder eingefügt. Zusätzlich können Verbindungen zwischen Inhalten
aufgebaut werden, die für spätere Ausgaben im Frontend genutzt werden.
Beispiel für Seiten aus Datensätzen im Seitenb aum
Seite | 6
Kombination aus Contentseite und Datensatz
An einigen Stellen werden Kombinationen aus Contentseiten und Datensätzen
eingesetzt. Diese nutzen den Vorteil des flexiblen Aufbaus von Contentseiten und
schaffen gleichzeitig eine Verknüpfungsmöglichkeit für Inhalte. Sie sind durch
eigene Symbole im Seitenbaum gekennzeichnet. Die Datensatz-Inhalte werden über
spezielle Reiter in den Seiteneigenschaften gepflegt.
Beispiel für Komb inationen aus Contentseite und Datensatz
Was wir bewegen
Der Bereich „Was wir bewegen“ spiegelt das Portfolio der Projekte und Lösungen
von Dataport wider.
Dataport bietet viele spannende Themen und Projekte. Allerdings ist es nicht
zielführend alle auf der Website abzubilden und damit die Navigation zu
überfrachten. Es muss daher immer geprüft werden, ob ein Projekt oder eine
Lösung auf eine oder mehrere der nachfolgenden Image-Botschaften einzahlt:
■ Motor der Digitalisierung
■ IT-Sicherheit
■ Public Value
■ Innovativ und modern
■ Attraktiver Arbeitgeber
Seite | 7
Themenwelten
Um den Usern einen möglichst leichten Zugang zu den einzelnen Projekten und
Lösungen zu bieten, werden vier Themenwelten aufgezogen. Diesen Themenwelten
werden aber nicht nur Projekte, sondern auch News, Fachartikel und
Veranstaltungen zugeordnet. Die Themenwelten sind:
1. Digitale Verwaltung
Inhalte, die generell administrative Arbeiten betreffen.
2. Digitale Kommune
Inhalte, die ausschließlich die Arbeit von Kommunen betreffen.
3. Digitale Gesellschaft
Inhalte, mit denen die Bürger in Kontakt kommen.
4. Digitale Sicherheit
Inhalte, mit denen sich Dataport als Garant für IT-Sicherheit profilieren kann.
Die Themenwelten sollten nicht verändert werden. Auch sollten keine neuen
hinzugefügt werden.
Auf der Seite einer Themenwelt erfährt der User, wie Dataport diese Themenwelt
versteht, er sieht den aktuellsten Fachartikel dieser Themenwelt, zwei aktuellste
News und die nächste Veranstaltung, die dieser Themenwelt zugeordnet wurden.
Weiterhin sieht er die verschiedenen Themen dieser Themenwelt und etwaige
Teaser zu passenden Leistungen aus dem Bereich „Was wir tun“.
Technisch gesehen ist eine Themenwelt eine Kombination aus einem Datensatz und
einer Seite. D.h. einige Bestandteile der Themenwelt werden über deren
Seiteneigenschaften gepflegt, andere über die Seiteninhalte. Der Aufbau kann
flexibel angepasst werden.
Themen
Jeder Themenwelt werden mehrere Themen zugewiesen. Ein Thema kann auch in
mehreren Themenwelten vorkommen, wenn es dazu passt. Das Thema
„Onlinezugangsgesetz“ findet sich z.B. sowohl in der Themenwelt „Digitale
Verwaltung“ als auch „Digitale Kommune“. Ein Thema sollte immer möglichst so
gefasst sein, dass es mehrere Projekte oder Lösungen beinhalten kann. Je nach
Bedarf können im Laufe der Zeit auch neue, aktuelle Themen hinzukommen oder
veraltete Themen wegfallen.
Auf einer Themenseite erfährt der User, warum Dataport dieses Thema am Herzen
liegt und wie Dataport es interpretiert. Als Beleg für das Know-how und die
Seite | 8
Kompetenz von Dataport werden Projekte und Lösungen gezeigt und verlinkt, die
mit diesem Thema verbunden sind.
Ein Thema ist, genau wie die Themenwelt, eine Kombination aus Datensatz und
einer Seite. Der Aufbau kann flexibel angepasst werden.
Projekte und Lösungen
Projekte und Lösungen können einem oder mehreren Themen zugeordnet werden.
Beispiel 1: Die Lösung „Online-Dienste“ ist dem Thema „Onlinezugangsgesetz“
zugeordnet.
Beispiel 2: Das Projekt „Breitbandausbau“ ist den Themen „Infrastruktur“ und
„Bildung“ zugeordnet.
Projekte und Lösungen sind reine Datensätze. Das heißt, es muss keine eigene Seite
dafür im Seitenbaum angelegt werden, sondern ein eigener Datensatz. Der Aufbau
ist durch die Felder des Datensatzes vorgegeben.
Projekte können laufend oder bereits abgeschlossen sein. Wenn sie in eine fertige
Lösung münden, sollte dafür ein neuer Datensatz angelegt werden. Für Lösungen,
die für Marketingzwecke stärker beworben werden sollen, können spezielle
„Productpages“ angelegt werden.
Projekte und Lösungen können entweder als „Kurzporträt“ oder als „Langfassung“
angelegt werden.
Kurzporträt
Liegen über das Projekt/die Lösung nicht viele Informationen vor, oder soll
bewusst nicht viel dazu geschrieben werden, da es vielleicht nicht so wichtig ist,
kann es als Kurzporträt angelegt werden. Kurzporträts haben technisch gesehen
zwar eine eigene Detailseite, sie wird jedoch nicht über die Navigation oder über
Teaser verlinkt. Die Inhalte eines Kurzporträts werden direkt auf den zugehörigen
Themenseiten eingebunden. Es ist meist auf eine kurze Beschreibung beschränkt.
Langfassung
Wenn es zu einem Projekt/einer Lösung genügend Inhalte gibt, die eine eigene
Seite rechtfertigen, wird das Projekt zur Langfassung. Es hat dann eigene
Detailseite, auf die mittels Teaser verlinkt wird. Eine Langfassung kann viele
verschiedene Inhaltsformen wie Downloads, Meilensteine, Kundenzitate,
Ansprechpartner u.a. abbilden.
Seite | 9Nutzerführung
Um den User von Inhalt zu Inhalt zu führen ist die Navigation hilfreich. Gerade auf
mobilen Geräten ist diese jedoch häufig unter dem sogenannten „Hamburger“-Icon
„versteckt“. Daher ist es umso wichtiger, den “User-Flow" mittels thematisch
sinnvoller Teaser-Elemente zu lenken. Der Contentpfleger sollte sich also immer die
Frage stellen, welche Bereiche der User am Ende einer Seite wohl am besten als
nächstes besuchen sollte.
Dafür ist das Element „Pathfinder“ vorgesehen:
Der Pathfinder besteht aus einer großen Teaserfläche mit Bild und weiteren
flankierenden Links. Er wird – je nach Seitentyp – unterschiedlich gepflegt.
Seite | 10Das Backend
Das Backend in TYPO3 ist wie folgt aufgebaut:
Menü
Links im Menü befinden sich unterschiedliche Module zur Darstellung und/oder
Verwaltung von Inhalten.
Menü
WEB
■ Seite
“Seite” stellt die jeweils im Seitenbaum ausgewählte Seite samt
Inhaltselemente im Inhaltsbereich dar.
■ Liste
In der Listenansicht werden die auf der Seite befindlichen Inhaltselemente in
einer Listenansicht dargestellt. “Liste” muss zudem ausgewählt sein, um
Datensätze anzuzeigen und editieren zu können.
Seite | 11■ Info
Dieses Modul wird in der Regel selten verwendet. Hier kann der Redakteur
sich Infos zum hinterlegten Seitentitel, der URL, möglicher Verweise der
jeweiligen Seite im Seitenbaum anschauen.
■ Papierkorb
Hier werden alle kürzlich gelöschten Elemente aufgeführt. Der Redakteur hat
die Möglichkeit einzelne Elemente wiederherzustellen.
■ Veranstaltungen
Hier können Veranstaltungen erstellt oder editiert werden. Dazu muss im
Seitenbaum der Ordner “Veranstaltungen” ausgewählt sein.
Siehe auch: Wie lege ich eine neue Veranstaltung an?
■ News Administration
Hier können News aller Art (News, Fachartikel, Pressemitteilungen)
administriert werden.
Siehe auch: “Wie stelle ich eine News ein?”
■ Fortbildungen
Hier stehen die zu importierenden Dateien von Seminardaten zur Verfügung.
Siehe auch: “Wie importiere ich eine xml mit Seminarinhalten (ITBBZ)?”
■ Powermail
Hier kommt man zur Formularübersicht. Dazu muss der Ordner “Formulare”
im Seitenbaum ausgewählt sein.
SEITENVERWALTUNG
■ Weiterleitungen
Hier können Weiterleitungen eingerichtet werden.
DATEI
■ Dateiliste
Hier werden sämtliche Medien (Pdfs, Icons, Bilder, Videos) hochgeladen und
verwaltet.
Seite | 12Seitenbaum
Hier befindet sich der Seitenbaum. Er gibt in etwa die Seitenstruktur wieder.
Seiten-
baum
Dies ist eine Seite
Dies ist ein Ordner. Er bündelt in der Regel Unterseiten oder
beinhaltet Datensätze, die auf einer oder mehreren Seiten
ausgespielt werden.
Dies ist ein Verweis. Hier befindet sich in der Regel kein Inhalt,
sondern ist ein Verweis z.B. auf die erste Unterseite.
Dies ist ein Link zu einer externen Url.
Seite | 13Inhaltsbereich
Hier befindet sich der Inhaltsbereich.
Inhaltsbereich
Er ist aufgebaut in ”Hero” und ”Inhalt”. Je nachdem, in welchem dieser Abschnitte
Sie Inhalte hinzufügen wollen, stehen Ihnen unterschiedliche Inhaltselemente zur
Verfügung.
Oberhalb des Inhaltsbereichs stehen Ihnen verschiedene Aktionen zur Verfügung:
Bei Klick auf das ”Anschauen”-Symbol wird die Seite im Frontend aufgerufen.
Bei Klick auf das ”Bearbeiten”-Symbol können Sie die Seiteneigenschaften
bearbeiten.
Bei Klick auf das ”Suchen”-Symbol können Sie einen bestimmten Inhalt auf
dieser Seite suchen
Seite | 14Benutzer-Einstellungen
Wenn Sie im TYPO 3-Backend eingeloggt sind, können Sie oben rechts Ihre
Benutzerdaten editieren.
Persönliche Daten
Folgende Daten können editiert werden:
■ Name
■ E-Mail-Adresse
■ Avatar
■ Sprache (bezieht sich nur auf TYPO3-Backend; auswählbar sin deutsch und
englisch)
Passwort
Hier können Sie ein neues Passwort hinterlegen.
Beim Start
Hier können Sie konfigurieren, welches Modul im Menü beim Login ausgewählt sein
soll.
Seite | 15Inhaltselemente
Sie können auf einer Seite diverse Elemente im Inhaltsbereich anlegen, um Inhalte
einzupflegen. Je nachdem wo Sie die Inhalte integrieren wollen (Header-Bereich
oder Inhaltsbereich) stehen Ihnen unterschiedliche Elemente zur Verfügung.
Zu jedem Element finden Sie im Backend eine Beschreibung, was für ein
Inhaltselement es ist und wie es den Inhalt darstellt.
Hero
Im Hero Bereich stehen folgende Elemente zur Verfügung:
Hero: Seiteninhalt
Hero: Besondere Elemente
Seite | 16Inhalt
Im Bereich “Inhalt” stehen folgende Elemente zur Verfügung:
Inhalt: Seiteninhalt
Seite | 17Inhalt: Raster
Seite | 18Inhalt: Teaser
Inhalt: Typischer Seiteninhalt
Seite | 19Plug-Ins
Inhalt: Besondere Elemente
Einige Elemente sind erst verfügbar, nachdem ein Raster-Element angelegt wurde.
Seite | 20Inhalt: Teaser
Beim Raster „EmployerQuotes“:
Beim Raster „GridParallaxTeaser“:
Seite | 21Inhalt: Typischer Seiteninhalt
Inhalt: Menü
Seite | 22Styleguide
Angaben zum Einsatz und zur Verwendung der verschiedenen Elemente sind nach
Livegang hier zu finden:
http://www.dataport.de/contentpflege/
Seite | 23Basics
SEO-Grundlagen
Im TYPO3-Backend haben Sie die Möglichkeiten SEO-relevante Informationen zu
hinterlegen. Die gehören mittlerweile zu den Standards. Um in Suchmaschinen eine
gute Platzierung zu erzielen, sind die nachfolgenden Felder nicht allein
ausreichend, aber ein wesentlicher Teil der Standards, die mittlerweile einzuhalten
sind.
Die nachfolgenden Felder und Einstellungsmöglichkeiten im Bereich SEO sind
Bestandteil der Kernfunktionalitäten von TYPO3.
Bilder: Dateien korrekt benennen
Ein relevantes Keyword kann und sollte auch im Bilddateinamen, das auf einer
Seite eingesetzt wird enthalten sein. Das Keyword sollte zum Einsatzort auf der
Website passen. Achten Sie darauf, dass mehrere Keywords im Dateinamen mit
Bindestrich getrennt werden. Beispiel: client-betriebsmodelle.jpg.
Allgemein folgt der Dateiname folgendem Schema:
Hero-Bilder:
hero_keyword.jpg
Content-Bilder:
content_keyword.jpg
News-Bilder:
JJJJ-MM-TT_dataport-keyword-keyword.jpg
Sie können den Titel des Bildes auch überschreiben. Zum Beispiel, wenn es sich um
ein „hero-image“ handelt und das Wort „hero“ nicht im Titel vorkommen soll. Das
können Sie in den Eigenschaften einer Datei innerhalb der Dateiliste tun:
Seite | 24Hinweis: Denken Sie darüber hinaus stets daran im Abschnitt „Alternativer Text“
eine Beschreibung einzufügen, die beschreibt, was auf dem Bild zu sehen ist.
Und pflegen Sie im Reiter „Metadaten“ stets das Copyright ein:
Seite | 25Seiten: Title und Description
Sie können in den Seiteneigenschaften einen individuellen Titel und eine
Description hinterlegen, die von Suchmaschinen ausgelesen und auf der
Suchergebnisseite von z.B. Google ausgegeben werden.
Title:
Description:
Title
Der Title wird automatisch aus dem Seitennamen generiert und stets ein Suffix „|
Dataport“ ergänzt. Soll der Title vom Seitentitel abweichen, gehen Sie wie folgt vor:
1. Wählen Sie die betreffende Seite im Seitenbaum aus und gehen Sie in die
Seiteneigenschaften.
2. Im Reiter „SEO“ können Sie den Seitentitel für Suchmaschinen ändern.
Description
Die Description muss stets händisch hinterlegt werden. Beschreiben Sie dort das
Thema der Seite, damit der User
anhand des Google-Ergebnisses
abschätzen kann, was ihn auf der
Seite erwartet.
1. Wählen Sie die betreffende
Seite im Seitenbaum aus
und gehen Sie in die
Seiteneigenschaften.
2. Im Reiter „Metadaten“ ist
das Feld „Beschreibung“
relevant. Hinterlegen Sie
dort eine Description.
Seite | 26Hinweis: In News-Datensätzen können Sie Title und Description in den
Eigenschaften einer News im Reiter „Metadaten“ vornehmen.
Seiten vom Index ausschließen
Es kann vorkommen, dass eine Seite nicht von Suchmaschinen indexiert werden
soll. Gehen Sie dazu wie folgt vor:
1. Wählen Sie die betreffende Seite im Seitenbaum aus und gehen Sie in die
Seiteneigenschaften.
2. Wählen Sie den Reiter „SEO“ aus.
3. Klicken Sie dort im Abschnitt „Robot-Anweisungen“ auf
a. Index dieser Seite, wenn die Seite indexiert werden soll
b. Dieser Seite folgen, wenn Suchmaschinen den auf der Seite
angegebenen Links folgen (und ggf. dann wieder indexieren) soll.
Seite | 27Canonicals setzen
Canonical Links sind eine Technik, um Abstrafungen von Google wegen Duplicate
Contents zu vermeiden. Mit dem neuen Canonical-Tag wird den Suchmaschinen
gesagt unter welcher URL die „Hauptseite“ zu finden ist. Wenn Sie also eine Seite
anlegen, die zu einem Großteil Inhalte einer anderen Seite umfasst, und wollen
einen Canonical Tag setzen, gehen Sie wie folgt vor:
1. Wählen Sie die betreffende Seite im Seitenbaum aus und gehen Sie in die
Seiteneigenschaften.
2. Wählen Sie den Reiter „SEO“ aus.
3. Wählen Sie dort die Hauptseite aus, auf die ein Canonical-Link gesetzt
werden soll.
Soziale Medien
Wenn ein Link in sozialen Medien geteilt wird, zieht sich das Netzwerk
Informationen zu der geteilten Seite automatisch. Generell kann aber der Titel, die
Beschreibung und das Bild der Seite festgelegt werden, die beim Teilen in szialen
Medien angezeigt werden sollen. Gehen Sie dazu wie folgt vor:
1. Wählen Sie die betreffende Seite im Seitenbaum aus und gehen Sie in die
Seiteneigenschaften.
2. Wählen Sie den Reiter „Soziale Medien“ aus.
3. Hinterlegen Sie Sie dort die Open Graph Data (Titel, Beschreibung, Bild)
Seite | 28Hinweis: Für News, Veranstaltungen und generell Datensätzen, ziehen sich soziale
Netzwerke automatisch die Informationen. Die OG-Tags sind dafür nicht einstellbar.
Seite | 29Wie lege ich eine neue Seite an?
1. Wählen Sie oberhalb des Seitenbaums das Icon für Standard-Seiten aus
Halten Sie die Maustaste dabei gedrückt und ziehen Sie das Icon an die Stelle
des Seitenbaums, wo Sie die neue Seite einfügen wollen.
2. Tragen Sie anschließend den Titel der Seite ein. So wird die Seite auch im
Menü angezeigt.
Hinweis: Die Seite ist standardmäßig noch ausgeblendet.
Was muss ich bei den Seiteneigenschaften beachten?
Wählen sie die entsprechende Seite im Seitenbaum aus. Klicken Sie anschließend
auf das Bearbeiten-Symbol oberhalb des Inhaltsbereichs .
URL
Das URL-Segment finden Sie im Reiter “Allgemein”. Die URL der ausgewählten Seite
generiert sich automatisch anhand des Seitentitels und der Zuordnung der Seite im
Seitenbaum.
■ Änderung des Seitentitels
Achten Sie darauf, dass Sie bei einer nachträglichen Änderung des Seitentitels
auch die Url neu berechnen lassen müssen. Klicken Sie dazu auf das Symbol
■ Individuelle URL eintragen
Sie können auch eine individuelle Url vergeben, die zu der entsprechenden
Seite führt.
Wählen Sie Sie dazu das Symbol für “URL Segment umschalten” und passen
Sie im Anschluss die Url nach Belieben an und klicken Sie anschließend auf
Speichern.
Hinweis: Testen Sie im Anschluss den neuen Pfad auf der Website, indem Sie auf
der Website zur entsprechenden Seite über das Menü navigieren.
SEO
s. voriges Kapitel
Seite | 30Service Flap
Der Service Flap ist das mitlaufende Service-Element am rechten Seitenrand auf
dataport.de. Bei Fragen können User dort z.B. einen Ansprechpartner für ihr
Anliegen finden. In den Seiteneigenschaften können Sie festlegen, ob ein Anliegen
und wenn ja welches, bereits vorausgewählt sein soll.
Klicken Sie dazu in den Seiteneigenschaften auf den Reiter “Service Flap” und
wählen Sie im Dropdown eines der bereits hinterlegten Anliegen aus.
Wie befülle ich eine Seite mit Elementen?
Sie können im Inhaltsbereich neue Elemente sowohl im “Header” als auch im
“Inhalt” anlegen.
Klicken Sie auf das “Inhaltselement erstellen”-Symbol
Anschließend öffnet sich ein Pop-Up. Dort können Sie eines der Elemente
auswählen, das an dieser Stelle eingefügt werden kann.
Für einige Elemente muss zuvor ein geeignetes Raster-Element eingefügt worden
sein, in das sie hineingepflegt werden können. Andere Elemente wiederum
benötigen kein eigenes Raster-Element.
Siehe auch Kapitel Inhaltselemente und Styleguide.
Bei den Inhaltselementen sollte immer das Feld „Überschrift“ ausgefüllt sein, damit
das Element auch im Menü unter dem Punkt „Liste“ angezeigt wird. So behalten Sie
auch im backend den Überblick.
Bei einigen Elementen wird diese Überschrift ausgegeben, oder es kann bestimmt
werden, in welchem Überschrift-Stil sie ausgegeben wird. Wählen Sie dafür im
Dropdown „Typ“ Ihren gewünschten Überschrift-Stil aus.
Ist ein Element fertig befüllt, muss es über den „Speichern“-Button am oberen
Seitenrand des Inhaltsbereichs gespeichert werden.
Haben Sie eine Seite mit Elementen befüllt, betrachten Sie sich diese immer über
den „Web-Seite anzeigen“-Button. Schieben Sie dabei das Fenster Ihres Browsers
auch immer einmal schmal und wieder breit, um zu beurteilen, ob das Layout auch
in allen Browserbreiten gut aussieht.
Seite | 31Was muss ich beim Rich-Text-Editor (RTE) beachten?
Der RTE (“Rich Text Editor” ist der TYPO 3-eigene Editor. Er verfügt über diverse
Standardfunktionen zur Formatierung von Texten.
Texte einfügen
Wenn Sie Texte z.B. aus einem Word-Dokument in den Editor kopieren, beachten
Sie unbedingt, dass keine Formatierungen übernommen werden.
Alternative 1: Sie kopieren den Text in den RTE, markieren den Text und klicken
anschließend auf “Formatierung entfernen”:
Alternative 2: Sie kopieren den Text und klicken anschließend auf “Als Klartext
einfügen”:
Alternative 3: Sie kopieren den Text zunächst in den Standard-Editor Ihres
Computers. Dabei werden alle Formatierungen (wie z.B. Farben, Schriftart oder
Größe) automatisch entfernt. Markieren und kopieren Sie den Text erneut und
fügen Sie ihn anschließend in den RTE von TYPO 3 ein.
Text-Formatierungen
Folgende Formatierungsmöglichkeiten werden häufig verwendet:
Hier können Text-Stile wie großer Text oder kleiner Text vergeben oder der Stil
von Aufzählungslisten verändert werden.
Seite | 32Hier befinden Sich Formatvorlagen, um Überschriften und Zwischenüberschriften
auszuzeichnen.
Damit können Sie Texte fetten.
Damit sind nummerierte oder einfache Aufzählungen möglich.
Hiermit können Absätze als Zitat ausgezeichnet werden.
Dieses Trennzeichen muss eingefügt werden, wenn Worte so lang werden, dass sie
auf mobilen Browsern nicht mehr in eine Zeile passen. Es ist ein Trennvorschlag,
d.h. es wird nicht ausgegeben, wenn das Wort in die Zeile passt.
Hiermit pflegen Sie Bilder oder Videos direkt in den RTE ein. Diese müssen zuvor in
die Dateiliste an geeignete Stelle hinzugefügt werden.
Seite | 33Wie füge ich Verlinkungen ein?
Im Editor können Sie verschiedene Arten von Links einfügen. Klicken Sie dazu auf
das Symbol “Link einfügen”:
Anschließend öffnet sich ein Pop-Up, wo Ihnen verschiedene Link-Arten zur
Verfügung stehen.
Interne Seite
Wählen Sie die Seite aus dem Seitenbaum aus, auf die Sie verlinken möchten.
Wählen Sie im Dropdown „CSS Klasse“ den Stil des Links aus, wie er im Frontend
dargestellt werden soll. Z.B. „Interner Icon-Link“.
Datei zum Download
Wählen Sie den Ordner und dort die Datei aus der Dateiliste aus, die Sie zum
Download anbieten wollen. Wählen Sie im Dropdown „CSS Klasse“ den Stil des
Links aus, wie er im Frontend dargestellt werden soll. Z.B. „Download Icon-Link“.
Externe Url
Geben Sie die Url der Website ein, die Sie verlinken wollen. Wählen Sie unter
„Zielfenster“ im Dropdown „Neues Fenster“ aus, wenn sich bei Klick auf den Link im
Browser ein neuer Tab öffnen soll. Wählen Sie im Dropdown „CSS Klasse“ den Stil
des Links aus, wie er im Frontend dargestellt werden soll. Z.B. „Externer Icon-Link“.
E-Mail
Geben Sie die Mailadresse ein, die verlinkt werden soll. Wählen Sie im Dropdown
„CSS Klasse“ den Stil des Links aus, wie er im Frontend dargestellt werden soll. Z.B.
„E-Mail Icon-Link“
News, Pressemitteilungen, Fachartikel, Veranstaltung, Portfolio
Bei den oben genannten Inhalten handelt es sich um Datensätze. Daher sind sie im
Link-Wizard in einzelnen Reitern zusätzlich aufgeführt. Mit Klick auf den jeweiligen
Reiter werden die bereits hinterlegten Datensätze dieser Kategorie aufgeführt.
Wählen Sie den zu verlinkenden Datensatz aus. Wählen Sie im Dropdown „CSS
Klasse“ den Stil des Links aus, wie er im Frontend dargestellt werden soll. Z.B.
„Interner Teaser Icon-Link“.
Seite | 34Wann sind Trennlinien notwendig?
Um Inhalte voneinander zu trennen können farbige Raster genutzt werden. Jedoch
dürfen nie zwei Raster mit unterschiedlichen Hintergrundfarben (weiß
ausgenommen) aufeinander folgen. Dies kann dazu führen, dass es notwendig wird,
zwei weiße Raster, die inhaltlich voneinander abgegrenzt sind, auch grafisch
deutlich zu trennen. Dafür wird das Element „Trenner“ (in „Besondere Elemente“)
benötigt. So kann z.B. ein Kundenzitat von einem Inhalt in weißem Raster
abgegrenzt werden.
Wie lade ich eine Datei hoch?
Gehen Sie links im Menü in die Dateiliste und wählen Sie dort den Ordner aus, in
dem Sie die Datei hochladen wollen.
Bilder
1. Ziehen Sie die Datei nun in den Inhaltsbereich. Alternativ können Sie auch
auf das Symbol “Datei hochladen” oberhalb des Inhaltsbereiches klicken
und anschließend die Datei von Ihrem Rechner auswählen.
2. Vergeben Sie einen Titel.
3. Hinterlegen Sie im Abschnitt “Barrierefreiheit | Alternativer Text” noch
Informationen zu dem Bild für User, die einen Screenreader nutzen und sich
die Seite vorlesen lassen. Beschreiben Sie dazu in kurzen Worten, was auf
dem Bild zu sehen ist.
4. Klicken Sie auf den Reiter „Metadaten“ und fügen Sie den entsprechenden
Copyright-Vermerk in das Feld „Urheberrecht“ ein.
5. Klicken Sie anschließend auf Speichern.
PDFs
1. Ziehen Sie die Datei nun in den Inhaltsbereich. Alternativ können Sie auch
auf das Symbol “Datei hochladen” oberhalb des Inhaltsbereiches klicken
und anschließend die Datei von Ihrem Rechner auswählen.
2. Vergeben Sie einen Titel.
3. Hinterlegen Sie im Abschnitt “Barrierefreiheit” noch Informationen zu dem
Pdf für User, die einen Screenreader nutzen und sich die Seite vorlesen
lassen.
4. Klicken Sie anschließend auf Speichern.
Seite | 35Video einbetten: YouTube
1. Klicken Sie auf den „+“-Button oberhalb des Inhaltsbereichs.
2. Kopieren Sie die Url des YouTube-Videos im Abschnitt “neue Mediendatei
hinzufügen” ein.
3. Vergeben Sie einen Titel und klicken Sie anschließend auf Speichern.
Video zum Download anbieten: mp4
1. Ziehen Sie die Datei in den Inhaltsbereich. Alternativ können Sie auch auf
das Symbol “Datei hochladen” oberhalb des Inhaltsbereiches klicken
und anschließend die Datei von Ihrem Rechner auswählen.
2. Vergeben Sie einen Titel und klicken Sie anschließend auf Speichern.
Wie pflege ich neue Icons ein?
In der Dateiliste sind im Ordner „icons“ bereits einige Icons des Dataport-Iconsets
hochgeladen. Neu zu erstellende Icons sollten Sie hier hinzufügen und sich dabei
immer dieser Gestaltung anlehnen.
Icons sollten jeweils in drei Größen vorliegen.
64 x 64 Pixel für Keyfacts:
120 x 120 Pixel für Teaser:
Seite | 36200 x 200 Pixel für besonders hervorgehobene Illustrations-Elemente:
Folgende Bedingungen müssen erfüllt sein:
■ Dateiformat: SVG
■ Nur Outlines, keine Schriften, keine Strichstärken
■ Farbton für Füllung: # 9E292B
Neue Icons werden ebenfalls in den Ordner „icons“ der Dateiliste hinzugefügt und
analog zu den bereits bestehenden benannt:
„icon_thema.svg“ für 64 x 64 Pixel Größe
„icon_thema.svg_m“ für 120 x 120 Pixel Größe
„icon_thema_l.svg“ für 200 x 200 Pixel Größe
Seite | 37Wie lege ich ein neues Formular an?
Formular aufbauen
1. Wählen Sie im Menü Liste aus.
2. Klicken Sie auf den Ordner Formulare im Seitenbaum.
Anschließend erscheint im Inhaltsbereich eine Übersicht der bereits
hinterlegten Formulare.
3. Klicken Sie auf Datensatz erstellen (das + Symbol neben „Bezeichnung“), um
ein neues Formular anzulegen.
4. Vergeben Sie einen eindeutigen Formular-Titel
5. Klicken Sie anschließend auf Seite neu erstellen.
6. Geben Sie einen Titel für die Formular-Seite ein. Z.B. „Kontaktdaten“.
7. Klicken Sie anschließend auf Felder neu erstellen.
8. Geben Sie eine Bezeichnung für das Feld ein. Dies erscheint auch auf der
Website und sollte für den User eindeutig sein, welche Information in dem
Feld zu hinterlegen ist.
9. Es gibt unterschiedliche „Typen“ für das Feld. In der Regel werden Sie eines
der folgenden Felder benötigen:
■ Textfeld (Input)
■ Textfeld (Mehrzeilig)
■ Mehrfachauswahl (Checkboxen)
■ Einfachauswahl (Radiobutton)
■ Abschicken (submit)
■ Zeige Text (hier wird nur ein Hinweis-Text hinterlegt. Der User muss
keine Eingaben machen)
10. Kennzeichnen Sie je Feld, ob die Eingabe des Users bei diesem Feld seine E-
Mail-Adresse oder den Namen des Absenders beinhaltet. Kicken Sie dazu
eine der beiden Checkboxen an.
Seite | 3811. Um ein Feld als Pflichtfeld zu deklarieren, klicken Sie auf den Reiter
Erweitert und setzen den Haken entsprechend.
12. Sie können im Dropdown Feldüberprüfung festlegen, inwiefern die Eingaben
des Users vor dem Abschicken des Formulars getestet werden sollen. Zum
Beispiel kann automatisch überprüft werden, ob es sich bei der Eingabe um
eine E-Mail-Adresse, eine Telefonnummer oder eine Url handelt.
13. Autocomplete Feld: Wenn User ihre Angaben im eigenen Browser
gespeichert haben, können sie das Formular in Teilen auch automatisch
befüllen lassen. Um dies zu ermöglichen, wählen Sie im Dropdown
Autocomplete Feld aus, welcher Daten-Typ (z.B. Nachname) automatisch in
dieses Feld übertragen werden kann.
14. Klicken Sie anschließend auf Speichern.
Formular integrieren
Um ein Formular auf einer Seite einzubinden, gehen Sie wie folgt vor:
1. Wählen sie die Seite im Seitenbaum aus, auf der Sie das Formular
hinzufügen wollen.
2. Klicken Sie im Inhaltsbereich an die Stelle, wo Sie das Formular integrieren
wollen. Wählen Sie im Fenster, das sich daraufhin öffnet, den Reiter Plugins
aus und klicken Sie auf Allgemeines Plugin.
3. Geben Sie dem Inhaltselement einen Titel.
4. Klicken Sie auf den Reiter Plugin auf das Dropdown „Ausgewähltes Plugin“
und wählen Sie Powermail.
5. Wählen Sie das hinterlegte Powermail Formular aus.
6. Hinterlegen Sie im Reiter Empfänger die E-Mail-Adresse, an die das
Formular nach Absenden geschickt werden soll. Wichtig: Hinterlegen Sie hier
auch einen Betreff der E-Mail. Ansonsten klappt der Mailversand nicht.
7. Klicken Sie anschließend auf Speichern.
Wichtig: Testen Sie unbedingt die korrekte Darstellung und Funktionsweise
Ihrs Formulars und nehmen Sie bei Bedarf Korrekturen vor.
Seite | 39Wie lege ich einen Redirect an?
1. Wählen Sie im Menü „Weiterleitungen“ aus
2. Klicken Sie auf das + Symbol, um einen neuen Redirect zu hinterlegen.
3. Bei Quelldomain sind alle Domains von Dataport hinterlegt (gekennzeichnet
mit einem *)
4. Hinterlegen Sie beim Quellpfad den Url-Pfad, die weitergeleitet werden soll,
beginnen mit „/“.
Beispiel: /Seiten/Datenschutzerklärung.aspx
5. Wählen Sie das Ziel aus, auf das der Quellpfad umgeleitet werden soll.
Klicken Sie dazu auf das Link-Symbol und wählen sie die entsprechende
Seite aus dem Seitenbaum aus.
6. Wählen Sie beim http-Status „301 Moved Permanently“ aus.
Seite | 40Workflows
Wie lege ich einen neuen Ansprechpartner/Autor/Team/Vorstand an?
1. Im Menü „Liste“ auswählen.
2. Im Seitenbaum den Ordner „Kontakte“ anwählen.
Dort befinden sich die Listen der „Kontakte“ und der „Kontaktanliegen“.
Für die Pflege eines neuen Ansprechpartners, Autors, Teams oder
Vorstandmitglieds ist vorerst die Liste der Kontakte interessant.
3. Über den +-Button einen neuen Datensatz erstellen.
Neuer Ansprechpartner
Als Datensatz-Typ „Contact“ ausgewählt lassen.
1. Füllen Sie die Felder „Akademischer Titel“, „Vorname“ und „Nachname“ aus.
Optional können Sie ein Bild des Ansprechpartners hinzufügen. Das Bild
muss im Vorfeld in der Dateiliste in den Ordner „kontakte“ hochgeladen
worden sein. Maße ca. 800x800 Pixel.
2. Über den Button „Editor öffnen“ im Dropdown des Bildes die drei Cropping-
Varianten für „Thumb“, „Square“ und „Landscape“ festlegen.
Seite | 413. Im Feld „Verantwortlich für“ den Zuständigkeitsbereich eintragen. Dieser
kann später im Plugin bei Bedarf überschrieben werden.
Mindestens eines der Felder „Telefon“, „Mobil“ oder „E-Mail“ muss ausgefüllt
werden.
4. Ist ein Ansprechpartner gleichzeitig Autor eines Fachartikels, muss das Feld
„Beschreibung (Autor)“ ausgefüllt werden.
5. Button „Speichern“ drücken.
Neuer Autor
Ein neuer Autor wird gepflegt wie ein neuer Ansprechpartner.
Ergänzende Hinweise:
■ Angaben zu „Telefon“, „Mobil“ und „E-Mail“ können entfallen.
■ Das Bild ist Pflicht.
■ Das Feld „Beschreibung (Autor)“ ist Pflicht.
Neuer Vorstand
Ein neues Vorstandsmitglied wird gepflegt wie ein neuer Ansprechpartner.
Ergänzende Hinweise:
■ Angaben zu „Telefon“, „Mobil“ und „E-Mail“ können entfallen.
■ Das Bild ist Pflicht.
■ Das Feld „Beschreibung (Executive)“ ist Pflicht.
■ Ist ein Vorstand gleichzeitig Autor eines Fachartikels, muss das Feld
„Beschreibung (Autor)“ ausgefüllt werden.
Neues Team
1. Wählen Sie als Datensatz-Typ „Team“ aus.
2. Die Felder „Teamname“, „Verantwortlich für“, „Telefon“ und „E-Mail“
anschließend ausfüllen.
3. Button „Speichern“ drücken.
Seite | 42Sie können auch lesen
