TYPO3 Einführung - BOKU

Transcription

Zentraler Informatikdienst (ZID/BOKU-IT)
BOKUweb mit TYPO3
Diese Doku ist eine Einführung in das Content-Management-System TYPO3.
Sie erhalten einen Überblick über die grundlegenden Funktionen des Systems sowie den Einsatz
im BOKUweb.
Zielgruppe der
Dokumentation:
Webautor/innen, Mitarbeiter/innen, Forscher/innen
Anfragen bitte an:
ZID Hotline [email protected]
Inhaltsverzeichnis
1
2
3
4
Einführung ............................................................................................................................... 4
1.1
Content-Management-System TYPO3 .............................................................................. 4
1.2
Zugang zum System ......................................................................................................... 4
1.3
Benutzeroberfläche TYPO3 .............................................................................................. 5
1.3.1
Modulleiste ................................................................................................................ 6
1.3.2
Seitenbaum ............................................................................................................... 7
1.3.3
Arbeitsfläche .............................................................................................................. 9
Seiten und Inhalte erstellen...................................................................................................... 9
2.1
Neue Seite anlegen .......................................................................................................... 9
2.2
Seiten mit Inhalten befüllen ............................................................................................. 12
2.3
Seiten kontrollieren und freigeben................................................................................... 18
2.4
Rich Text Editor .............................................................................................................. 19
Bilder und Dateien verwalten ................................................................................................. 21
3.1
Neuen Ordner in Filelist anlegen ..................................................................................... 22
3.2
Dateien und Bilder in Ordner hochladen ......................................................................... 22
Übersicht Content-Elemente .................................................................................................. 24
4.1
Typical page content ....................................................................................................... 24
4.1.1
Header only ............................................................................................................. 24
4.1.2
Regular Text Element .............................................................................................. 25
4.1.3
Text & Images ......................................................................................................... 25
4.1.4
Images Only ............................................................................................................ 29
4.2
Special Elements ............................................................................................................ 29
4.2.1
File Links ................................................................................................................. 30
4.2.2
Media ....................................................................................................................... 30
4.2.3
Insert records ........................................................................................................... 31
4.3
Form Elements ............................................................................................................... 32
4.3.1
4.4
Plugins ............................................................................................................................ 40
4.5
Dynamic Content Elements............................................................................................. 41
4.5.1
Iframe ...................................................................................................................... 42
4.5.2
Themenseite: Service-Link ...................................................................................... 42
4.5.3
Themenseite: Kontakt .............................................................................................. 43
4.5.4
Teaserbild für OrgEHs, Termine-, LVA- und Forschungs-Seiten, Themen ............... 44
4.5.5
Themenseite: Altert Box........................................................................................... 45
4.5.6
Personen-Detailansicht aus BOKUonline ................................................................. 46
4.5.7
Personenanzeige klein aus BOKUonline ................................................................. 48
4.5.8
News-Box manuell (analog zu Newsanzeige) .......................................................... 49
4.6
5
6
Mail Form................................................................................................................. 33
Grid Elements ................................................................................................................. 50
Top-Stories (News-Items) ...................................................................................................... 52
5.1
News-Item anlegen ......................................................................................................... 53
5.2
News-Item auf Departmentlevel anzeigen....................................................................... 57
5.3
News-Item auf BOKU-Startseite anzeigen ...................................................................... 57
5.4
News-Item Zielgruppenseiten anzeigen .......................................................................... 57
5.5
News-Item auf BOKUscreens anzeigen .......................................................................... 58
5.6
Preview Funktion Top-Stories ......................................................................................... 59
5.7
Qualitätskriterien Top-Stories .......................................................................................... 60
Seiten und Inhalte verwalten .................................................................................................. 61
6.1
Seiten und Inhalte löschen .............................................................................................. 62
6.2
Seiten verschieben ......................................................................................................... 63
6.3
Inhalte verschieben ......................................................................................................... 65
7
8
9
6.4
Seiten kopieren und einfügen ......................................................................................... 67
6.5
Inhalte kopieren und einfügen ......................................................................................... 68
6.6
Mehrere Elemente auf einmal verschieben, kopieren und einfügen ................................ 69
Spezielle Seitentypen ............................................................................................................ 71
7.1
Standardseite.................................................................................................................. 71
7.2
Shortcut .......................................................................................................................... 71
7.3
Link auf Externen URL .................................................................................................... 72
Zweisprachige Seiten erstellen .............................................................................................. 73
8.1
Englische Version einer Seite anlegen ............................................................................ 73
8.2
Englische Version der Inhalte erstellen ........................................................................... 74
8.2.1
Übersetzung der Seite gleich wie im Deutschen ...................................................... 75
8.2.2
Unabhängige Übersetzung der englischen Inhalte ................................................... 77
WAI Richtlinien – Barrierefreiheit von Webseiten ................................................................... 78
10 Wichtige Informationen zum BOKUweb ................................................................................. 79
11 Short URLs im BOKUweb ...................................................................................................... 79
12 Bildersuche im Internet .......................................................................................................... 79
13 DOKU: Bugs im BOKUweb .................................................................................................... 79
14 Online-Informationen zu TYPO3 ............................................................................................ 79
15 Alternativen zu TYPO3 .......................................................................................................... 80
1 Einführung
Dieses Kapitel gibt einen allgemeinen Überblick über das Content-Management System TYPO3,
den Zugang zum System sowie den Aufbau der Benutzeroberfläche.
1.1
Content-Management-System TYPO3
TYPO3 ist ein freies Open Source Content-Management-System (CMS) und wurde 1997 von
Kasper Skårhøj entwickelt. Bei einem CMS wird Inhalt, Struktur und Layout voneinander getrennt.
Alle Webseiten und Inhalte werden automatisch in ein einheitliches Design und Layout überführt.
Für die Wartung der Seiten und Inhalte sind keine speziellen HTML- oder Systemkenntnisse nötig.
Redakteur/innen können sich so ganz auf die Pflege des Inhaltes konzentrieren, ohne sich um
Layout oder technische Aspekte sorgen zu müssen.
1.2
Zugang zum System
Bei Content-Management-Systemen unterscheidet man zwischen Backend und Frontend. Im
Backend werden die Seiten erstellt und editiert und dann im Frontend – im Layout und Design der
jeweiligen Webseite - angezeigt.
Der Zugang zum System kann jederzeit und überall von einem beliebigen Webbrowser erfolgen.
Cookies und JavaScript müssen aktiviert sowie Popup-Fenster für den Server erlaubt sein.
Auf der BOKU erfolgt der Login in das Backend von TYPO3 über Shibboleth unter folgender
Adresse: http://www.boku.ac.at/typo3/
Abbildung 1: Login via Shibboleth
Einloggen können Sie sich mit Ihrem Novell-Username & Passwort.
Achtung: Sollten Sie keine Berechtigungen zum Editieren von Seiten in TYPO3 haben, dann
muss der oder die EDV-Verantwortliche Ihrer Organisationseinheit diese über die ZID-Hotline [email protected] - für Sie beantragen.
BOKUweb mit TYPO3
4 (81)
Shibboleth ist eine Single Sign On Lösung. Bitte bedenken Sie, dass bei einer solchen Lösung ein
Logout aus einer Applikation (wie TYPO3) nicht auch ein Logout aus dem Single-Sign-On-System
bedeutet. Bitte schließen Sie daher immer ihren Webbrowser, wenn sie sicher ausgeloggt sein
wollen.
1.3
Benutzeroberfläche TYPO3
Die Benutzeroberfläche von TYPO3 gliedert sich in drei große Bereiche:
Modulleiste
Seitenbaum
Arbeitsfläche
Abbildung 2: Benutzeroberfläche TYPO3
In den einzelnen Bereichen der Benutzeroberfläche von TYPO3 sehen Sie immer nur jene
Elemente wofür Sie auch Berechtigungen haben.
BOKUweb mit TYPO3
5 (81)
1.3.1 Modulleiste
Die wichtigsten Bereiche in der Modulleiste sind der Web- und Filebereich:
Abbildung 3: Modulleiste TYPO3
Im Webbereich führen Sie einfache Arbeiten an Ihren Inhalten durch.
Im Filebereich geht es primär um das Hochladen von Dateien, die Sie für die Gestaltung Ihrer
Inhalte brauchen. Hier können Sie nach Belieben Ordnerstrukturen anlegen in denen Sie Ihre
Dateien und Bilder verwalten.
Der Bereich User Tools steht für die Benutzerverwaltung. Dort können Sie einige Einstellungen
ändern um TYPO3 an Ihre Bedürfnisse anzupassen.
Der Webbereich gliedert sich noch in weitere Unterbereiche:
Abbildung 4: Webbereich in Modulleiste
Page
Seite im Backend von TYPO3. Diesen Bereich werden Sie am häufigsten verwenden. Er ist auch
automatisch voreingestellt.
BOKUweb mit TYPO3
6 (81)
View
Seite im Frontend von TYPO3. Wir empfehlen Ihnen jedoch die Vorschau Icons zu verwenden und
sich die Seite in einem eigenen Reiter im Webbrowser anzeigen zu lassen.
List
Sie sehen alle Elemente die sich auf dieser Seite befinden und auch alle Funktionen die Sie in
TYPO3 auf dieser Seite ausführen können. Daher kann diese Seite anfänglich für Sie sehr
unübersichtlich und verwirrend wirken.
Info
Seiteninformationen (wenn denn vorhanden)
Functions
Hier können viele Seiten bzw. Unterseiten auf einmal erstellt werden.
Recycler
Hier können gelöschte Elemente wieder zurückgeholt werden.
1.3.2 Seitenbaum
Der Seitenbaum steht für alle Module der Modulgruppe zur Verfügung und gibt die jeweilige
Struktur baumartig wieder. Teilbäume können durch einen Klick auf das graue Dreieck geöffnet
und wieder geschlossen werden:
Abbildung 5: Seitenbaum öffnen
BOKUweb mit TYPO3
7 (81)
Das Filtersymbol kann zum Suchen nach Seiten benutzt werden:
Abbildung 6: Suche nach Seiten im Seitenbaum
Wenn Sie Seiten im Seitenbaum löschen oder neu hinzufügen, dann ist es oft sinnvoll mit Refresh
den Seitenbaum zu erneuern.
Oft ist es wichtig, dass Sie wissen welche Seiten ID die Seite hat auf der Sie gerade arbeiten.
Diese sehen Sie via Mouseover, wenn Sie mit dem Mauszeiger direkt zur Seite im Seitenbaum
hinzeigen:
Abbildung 7: Seiten ID
Im Seitenbaum kommen Sie über das Kontextmenü zu vielen nützlichen Befehlen:
Abbildung 8: Kontextmenü
BOKUweb mit TYPO3
8 (81)
1.3.3 Arbeitsfläche
Das ist Ihre große, detaillierte Arbeitsoberfläche. Die Darstellung ist abhängig vom jeweiligen
Modul mit dem Sie gerade arbeiten.
Alle Icons zur Bearbeitung Ihrer Seiten sind mit einer sensitiven Hilfe versehen. Das bedeutet,
dass Ihnen die Funktion des Icons angezeigt wird, wenn Sie mit der Maus drüberfahren:
Abbildung 9: Sensitive Hilfe der Icons in TYPO3
2 Seiten und Inhalte erstellen
In diesem Kapitel wird Ihnen gezeigt wie Sie neue Seiten erstellen, mit Inhalten befüllen und
freigeben.
2.1
Neue Seite anlegen
Im Seitenbaum wählen Sie über das Kontextmenü bei „Page Actions“ das Icon „New“ aus.
Anschließend müssen Sie noch die Position der neuen Seite bestimmen. Klicken Sie einfach auf
jenen Pfeil wo Ihre neue Seite befinden soll:
Abbildung 10: Neue Seite erstellen
Nun müssen Sie die Seiteneigenschaften bestimmen. Geben Sie zuerst im Reiter „General“ einen
Seitentitel ein:
BOKUweb mit TYPO3
9 (81)
Abbildung 11: Seiteneigenschaften bestimmen
Sie haben im Reiter „General“ auch die Möglichkeit die Felder „Alternative Navigation Title“ sowie
„Speaking URL path segment“ auszufüllen.
Mit dem „Alternative Navigation Title“ wird nicht der Seitentitel, sondern dieser in der Navigation im
Frontend angezeigt.
Mit dem „Speaking URL path segment“ können Sie den URL bestimmen, der für diese Seite
angezeigt werden soll, wenn Sie mit dem automatisch generierten nicht zufrieden sind:
Abbildung 12: Speaking URL path segment bestimmen
Achtung: Hier wird nicht automatisch überprüft ob Ihre Eingabe einmalig ist. Sie müssen selbst
überprüfen, ob dieses „Speaking URL path segment“ auf Ihren Seiten schon einmal vorhanden ist
oder nicht.
BOKUweb mit TYPO3
10 (81)
Im Reiter „Access“ können Sie die Sichtbarkeit der Seite definieren, den Veröffentlichungszeitraum
sowie auch die Zugriffsrechte (wer kann die Seite sehen) bestimmen:
Abbildung 13: Zugriff zu Seiten bestimmen
Es wird empfohlen die Seite so lange unsichtbar zu lassen, bis sie fertig ist und auch wirklich im
Web angezeigt werden soll.
BOKUweb mit TYPO3
11 (81)
Danach klicken Sie auf das Symbol für speichern und schließen:
Abbildung 14: Speichern und Schließen
Glückwunsch! Sie haben Ihre erste Seite angelegt. Sie scheint bereits im Seitenbau auf, hat
jedoch noch keinen Inhalt.
2.2
Seiten mit Inhalten befüllen
Um Ihre Seite mit Inhalt zu befüllen, klicken Sie in der Seite auf das grüne Plus:
Abbildung 15: Seite mit Inhalt befüllen
BOKUweb mit TYPO3
12 (81)
Sie erhalten nun eine Vielzahl von Content-Elementen zur Auswahl, die Sie verwenden können:
Abbildung 16: Content-Elemente in TYPO3
Folgende Elemente stehen Ihnen im BOKUweb zur Verfügung:






Typical page content
Special elements
Form elements
Plugins
Dynamic Content Elements
Grid Elements
Bei den meisten Content-Elementen können unter dem Reiter „Appearance" unterschiedliche
Layout-Varianten ausgewählt werden.
Je nachdem um welches Content-Element es sich handelt, stehen Ihnen folgende LayoutVarianten zur Verfügung:





Default
Weißer Teaser
Corner Box
FAQ
Hinweis, nicht druckbar
Wir haben für Sie im BOKUweb eine Übersichtsseite erstellt, auf der Sie alle im BOKUweb
verfügbaren Content-Elemente ansehen können. Klicken Sie sich am besten einmal durch:
http://short.boku.ac.at/it-content-elemente
BOKUweb mit TYPO3
13 (81)
Wir wählen hier nun ein einfaches, normales Textelement aus:
Abbildung 17: Auswahl Regular Text Element
Es erscheint die Arbeitsfläche für das Editieren des Content-Elements. Geben Sie einen Header
sowie einen Text ein:
Abbildung 18: Content-Element mit Inhalt befüllen
Achtung: wenn Sie einen Text von einer Webseite oder aus einem Dokument herauskopieren und
in TYPO3 einfügen möchten, dann enthält dieser immer noch Formatierungen. Um diese zu
BOKUweb mit TYPO3
14 (81)
entfernen, fügen Sie den Text am besten zuerst in den Editor ein, bevor Sie ihn dann in TYPO3
einfügen. So werden alle Formatierungen gelöscht.
Im Reiter „Appearance“ können Sie das Layout des Content-Elements bestimmen. Je nachdem
welches Content-Element Sie ausgewählt haben, stehen Ihnen unterschiedliche Varianten zur
Verfügung:
Abbildung 19: Layout des Content-Elements bestimmen
Die Layout-Variante FAQ ermöglicht es Ihnen Informationen in einem aufklappbaren Element zur
Verfügung zu stellen:
Abbildung 20: Layout FAQ
Es gibt auch die Möglichkeit das Layout „Hinweis, nicht druckbar“ auszuwählen. Dadurch wird
Ihnen das Element im Frontend als umrandetes Element angezeigt und bei der gedruckten Version
der Seite nicht berücksichtig.
BOKUweb mit TYPO3
15 (81)
Abbildung 21: Hinweis, nicht druckbar.
Im Reiter „Access“ könne Sie Sichtbarkeit des Content-Elements, den Veröffentlichungszeitraum
sowie die Zugriffsrechte bestimmen. Es ist also möglich, auf einer Seite die allen Personen
zugänglich ist, auch Content-Elemente anzulegen die nur für eine bestimmte Gruppe sichtbar sind.
Abbildung 22: Zugriff für Content-Element einschränken
Wenn Sie alle relevanten Informationen eingetragen haben, klicken auf speichern und schließen.
Nun haben Sie Ihre Seite mit einem Content-Element befüllt.
BOKUweb mit TYPO3
16 (81)
Wollen Sie nachträglich noch etwas verändern, dann klicken Sie einfach auf den Bleistift zum
Editieren des Elements:
Abbildung 23: Seite mit Content Element
Sie können jederzeit weitere Content-Elemente auf Ihrer Seite hinzufügen. Dazu klicken Sie
einfach auf das grüne Plus vor oder nach Ihrem bestehenden Element:
Abbildung 24: Weitere Content-Elemente einfügen
Wenn Sie über das Kontextmenü auf Show klicken, dann wird Ihnen Ihre Seite im Frontend
angezeigt:
Abbildung 25: Seite im Frontend anzeigen durch Klick auf Show
BOKUweb mit TYPO3
17 (81)
2.3
Seiten kontrollieren und freigeben
Wenn Sie Seiten erstellen, dann sind diese automatisch noch nicht freigegeben. Sie können zwar
von Ihnen im Frontend angezeigt werden, sind jedoch für die Öffentlichkeit nicht sichtbar. Sie
erkennen das an dem roten Symbol neben Ihrer Seite im Seitenbaum:
Abbildung 26: Seite ist noch nicht freigegeben
Nachdem Sie Ihre Seite fertig erstellt und kontrolliert haben, können Sie die Seite über das
Kontextmenü durch einen Klick auf „Enable“ freischalten, oder über die Seiteneigenschaften indem
Sie das Häkchen bei „Disable“ entfernen:
Abbildung 27: Seiten freigeben
Fertig! Nun ist Ihre Seite öffentlich sichtbar und scheint auch automatisch in der Navigation und der
Sitemap Ihrer Webseite auf.
BOKUweb mit TYPO3
18 (81)
2.4
Rich Text Editor
Der Rich Text Editor (RTE) ist ein Word-ähnlicher Editor innerhalb Ihres Web-Browsers. Die
unterschiedlichen Icons des RTE sind ebenfalls mit einer sensitiven Hilfe versehen.
Welche Formatierungsfunktionen Ihnen im RTE zur Verfügung stehen, hängt ganz von der
Konfiguration des TYPO3 Systems ab mit dem Sie arbeiten. Im BOKUweb sieht der RTE im
Allgemeinen so aus:
Abbildung 28: Rich Text Editor im BOKUweb
Die Funktionen im RTE sind eigentlich selbsterklärend. Zwei vielleicht weniger bekannte Features
finden Sie hier erklärt:
Abbildung 29: Rich Text Editor Erklärung Symbole
BOKUweb mit TYPO3
19 (81)
Sie können im RTE auch Farben verwenden. Dazu müssen Sie jedoch zuerst den gewünschten
Textteil markieren, erst dann können Sie Farben auswählen.
Abbildung 30: Farbauswahl im RTE
Achtung: bitte verwenden Sie Farben, im Hinblick auf die Barrierefreiheit von Webseiten eher
sparsam.
Der RTE verfügt auch über ein Kontextmenü, welches Ihnen durch einen Klick auf die linke
Maustaste angezeigt wird:
Abbildung 31: Kontextmenü im RTE
BOKUweb mit TYPO3
20 (81)
3 Bilder und Dateien verwalten
In diesem Kapitel wird Ihnen gezeigt, wie Sie Bilder und Dateien in TYPO3 am besten verwalten.
Hierfür ist die Filelist von zentraler Bedeutung:
Abbildung 32: Filelist
In dieser können Sie nach belieben eine Ordnerstruktur anlegen, in der Sie Bilder und andere
Dateien ablegen:
Abbildung 33: Seitenbaum Filelist
BOKUweb mit TYPO3
21 (81)
3.1
Neuen Ordner in Filelist anlegen
Über das Kontextmenü sowie auch über das grüne Plus können Sie neue Ordner anlegen:
Abbildung 34: Neuen Ordner in Filelist anlegen
3.2
Dateien und Bilder in Ordner hochladen
Zum Hochladen verwenden Sie den Punkt Upload Files im Kontextmenü oder das Symbol in Ihrer
Arbeitsfläche:
Abbildung 35: Dateien und Bilder hochladen
Achtung: Wir empfehlen Ihnen Bilder immer in der bestmöglichen Qualität in TYPO3
hochzuladen!
Danach wählen Sie über die Funktion „Durchsuchen“ eine oder mehrere Dateien im Dateisystem
Ihres Rechners aus und klicken auf „Upload files“:
Abbildung 36: Dateien und Bilder hochladen
Wenn Sie bereits hochgeladene Dateien oder Bilder durch andere ersetzen wollen, dann
vergessen Sie nicht den Punkt „Overwrite existing files“ anzuklicken. So werden die alten Dateien
oder Bilder automatisch durch die Neuen ersetzt.
BOKUweb mit TYPO3
22 (81)
Alle hochgeladenen Elemente können Sie in TYPO3 immer und immer wieder verwenden, ohne
diese erneut hochladen zu müssen:
Abbildung 37: Hochgeladenen Bilder
Mit dem Bleistift zum Editieren können Sie die Elemente bearbeiten und mit wichtigen Copyrightund Lizenzinformationen ergänzen. Diese werden dann im Frontend durch ein Mouse Over –
angezeigt:
Abbildung 38: Copyright- und Lizenzinformationen hinzufügen
BOKUweb mit TYPO3
23 (81)
4 Übersicht Content-Elemente
In diesem Kapitel erhalten Sie eine Übersicht über die unterschiedlichen Content-Elemente die Sie
im BOKUweb verwenden können.
4.1
Typical page content
In diesem Bereich finden Sie jene Content-Elemente, die Sie mit Sicherheit am häufigsten
verwenden werden um Ihre Seiten zu gestalten:
Abbildung 39: Typical page content
4.1.1 Header only
Über dieses Content-Element fügen Sie lediglich Überschriften in unterschiedlichen Größen ein.
Darunter können Sie jederzeit weitere Content-Elemente einfügen:
Abbildung 40: Headergrößen Frontend
BOKUweb mit TYPO3
24 (81)
4.1.2 Regular Text Element
Dieses Content-Element besteht aus einem Header und einem Textteil:
Abbildung 41: Regular Text Element
4.1.3 Text & Images
Dieses Element besteht aus einem Header, einem Textteil und einem oder mehrere Bilder. Die
Bilder fügen Sie über den Reiter Images ein:
Abbildung 42: Bild hinzufügen
BOKUweb mit TYPO3
25 (81)
Danach wählen Sie die gewünschten Bildelemente aus und laden diese in das Content-Element
hoch:
Abbildung 43: Bild hochladen
BOKUweb mit TYPO3
26 (81)
Nun wurde das Bild hinzugefügt und kann – bei Bedarf –von Ihnen mit Titel, Link, Alternative Text
sowie Description (Caption) versehen werden.
Der Alternative Text wird angezeigt, wenn im Webbrowser kein Bild angezeigt wird. Dies ist
einerseits für die Barriere Freiheit der Webseite sehr wichtig und andererseits für die Erfassung
des Inhalts durch Suchmaschinen.
Die Description (Caption) wird als Bildbeschreibung unter dem Bild angezeigt.
Auch können Sie durch ein Häkchen auf Enabled bei Enlarge on Click bestimmen, dass das Bild
im Frontend bei einem Klick vergrößert wird.
Abbildung 44: Bild in Content-Element
BOKUweb mit TYPO3
27 (81)
Unter dem Reiter „Appearance“ können Sie bei „Image Alignment“ die Position und Anordnung
bestimmen:
Abbildung 45: Position und Anordnung Images
BOKUweb mit TYPO3
28 (81)
4.1.4 Images Only
Dieses Content-Element ermöglicht es Ihnen nur Bilder, in unterschiedlicher Anordnung und
Darstellung, in Ihre Seite einzubauen.
Das Hochladen der Bilder funktioniert gleich wie bei den Text & Image Elementen. Die Anordnung
der Bilder bestimmen Sie über den Reiter „Appearance“:
Abbildung 46: Images Only, Reiter Appearance
4.2
Special Elements
Im Bereich Special Elements können Sie File Links, Media Elemente sowie Records einfügen:
Abbildung 47: Special elements
BOKUweb mit TYPO3
29 (81)
4.2.1 File Links
Dieses Element ermöglicht es Ihnen mehrere Files auf einmal mit Links zu versehen. Dadurch
ersparen Sie sich die Eingabe im RTE. Sie können einzelne Files auswählen, oder aber auch eine
ganze File-Collection hinzufügen:
Abbildung 48: Files hinzufügen
4.2.2 Media
Über das Content-Element Media können Sie Video- oder Audiodateien in Ihren Seiten integrieren.
Sie können damit sowohl lokal gespeicherte Video- oder Audio-Dateien als File (durch einen
Upload) sowie auch externe Dateien (z.B.: YouTube Videos) einbinden.
4.2.2.1 Media Element via URL oder Upload einbinden
Wenn Sie Video- oder Audiodateien über einen URL oder einen Upload einbinden möchten, dann
müssen Sie dies über den Reiter „Media“ tun:
Abbildung 49: Media-Element einbinden
Fügen Sie einfach den entsprechenden URL oder das gewünschte File ein.
Achtung: bei URL: http:// nicht vergessen! Ansonsten kann das Video nicht angezeigt werden.
BOKUweb mit TYPO3
30 (81)
4.2.3 Insert records
Dieses Element ermöglicht es Ihnen auf andere Elemente zur referenzieren. Damit können Sie ein
Element an unterschiedlichen Stellen positionieren, müssen es jedoch nur an einer Stelle pflegen.
Wählen Sie einfach das gewünschte Element aus, auf das Sie referenzieren möchten:
Abbildung 50: Auf ein anderes Element referenzieren.
BOKUweb mit TYPO3
31 (81)
Das Element wird Ihnen dann in einer anderen Farbe im Backend von TYPO3 angezeigt:
Abbildung 51: Referenziertes Element in TYPO3
4.3
Form Elements
Über dieses Content-Element können Sie ein Mail Form einrichten:
Abbildung 52: Form elements einfügen
BOKUweb mit TYPO3
32 (81)
4.3.1 Mail Form
Das Mail Form in TYPO3 ist leider nicht sehr userfreundlich. Hier wird Ihnen Schritt für Schritt
erklärt wie Sie vorgehen müssen um ein Mailformular zu erstellen. Sollten Sie dennoch
Unterstützung brauchen, können Sie sich jederzeit an die Hotline des ZID - hotline(at)boku.ac.at –
wenden.
Wählen Sie das Element „Mail Form“ aus und geben Sie, wenn nötig, einen Header an. Klicken Sie
danach auf speichern:
Abbildung 53: Header vergeben und speichern
BOKUweb mit TYPO3
33 (81)
Danach können Sie die Felder Ihres Formulars selber bestimmen. Klicken Sie einfach auf das
Symbol neben dem Feld „Form“ und es werden Ihnen alle Feldmöglichkeiten angezeigt.
Achtung: Das Kästchen rechts neben dem Configuration-Feld wird Ihnen erst angezeigt, wenn Sie
einmal auf „Speichern“ geklickt haben.
Abbildung 54: Mail Form
Jene Felder die Sie benötigen, ziehen Sie einfach in den rechten Bereich und lassen Ihn dort
fallen. Sollte bei Ihnen diese Darstellung nicht stimmen, dann versuchen Sie einen anderen
Browser (z.B. google chrome) zu benutzen.
Abbildung 55: Mail Form Felder bestimmen
BOKUweb mit TYPO3
34 (81)
In diesem Beispiel habe ich ein einfaches Kontaktformular erstellt. Es besteht aus den Feldern:






Vorname (Text Field)
Nachname (Text Field)
Matrikelnummer (Text Field)
E-Mail (Email)
Ihre Mitteilung (Text Area)
Submit-Button (Submit Button)
Jedes dieser Felder habe ich in das blaue Feld rechts gezogen und dort „fallen gelassen“.
Für jedes Feld gibt es Pflichtfelder die Sie ausfüllen müssen. Diese sind mit einem gelben
Rufzeichen versehen. Alle anderen Felder sind optional von Ihnen zu befüllen:
Abbildung 56: Pflichtfelder ausfüllen
Den Bereich „Label Properties“ befüllen Sie einfach mit der gewünschten Bezeichnung für das
Feld, z.B.: Vorname. Danach müssen Sie auf das grüne Häkchen klicken, ansonsten wird Ihre
Eingabe nicht gespeichert:
Abbildung 57: Label Properties bestimmen
BOKUweb mit TYPO3
35 (81)
Den Bereich „Attributes Properties“ müssen Sie ebenfalls ausfüllen. Die Bezeichnung kann
dieselbe sein wie bei den „Label Properties“, doch Sie müssen darauf achten KEINE UMLAUTE,
SONDERZEICHEN oder LEERZEICHEN zu verwenden! Ansonsten wird Ihnen Ihr Formular nicht
richtig angezeigt.
Um Ihre Eingabe zu bestätigen, drücken Sie ebenfalls wieder auf das grüne Häkchen:
Abbildung 58: Attributes Properties benennen
Haben Sie alle benötigten Felder eingegeben, dann sieht Ihre Seite im Backend ungefähr so aus –
je nachdem welche Felder Sie für Ihr Formular benötigt haben:
Abbildung 59: alle benötigten Formularfelder eingegeben
BOKUweb mit TYPO3
36 (81)
Hier beginnt jener Teil, der für Webredakteure und Webredakteurinnen nicht sehr userfreundlich
und leider etwas kompliziert ist.
Sie müssen unter dem Reiter „Form“ im Bereich „Behaviour“ die „Confirmation page“ deaktivieren:
Abbildung 60: Confirmation Page deaktivieren
Danach müssen Sie ebenfalls im Reiter „Form“ im Bereich „Post Processors“ die gewünschten
Mailadressen eingeben.



In das Feld „Email adress of the recipient“ geben Sie jene E-Mailadresse ein, an die das
Formular versendet werden soll. Soll das Formular an mehrere Adressen gehen, dann
können Sie die E-Mailadressen einfach durch einen Beistrich voneinander trennen.
Bestätigen Sie dieses Feld mit dem grünen Häkchen.
Im Feld „Email adresse of the sender“ geben Sie einfach eine beliebige Mailadresse ein.
Am besten einfach nochmals jene die Sie schon im darüber liegenden Feld „Email adress
of the recipient“ eingetragen haben. Bestätigen Sie dieses Feld mit dem grünen Häkchen.
Im Feld „Subject“ geben Sie den Betreff ein der mit dem Mailformular versendet werden
soll. Bestätigen Sie dieses Feld mit dem grünen Häkchen.
Abbildung 61: Post Processors
BOKUweb mit TYPO3
37 (81)
Danach speichern und schließen Sie Ihr Mailformular, um wieder in die Anfangsansicht zu
kommen:
Abbildung 62: speichern und schließen
Damit nach dem Absenden des Formulars auch eine Bestätigung erfolgt geben Sie hier im HTMLQuellcode folgende Passage (gelb markiert) ein:
messages.success = TEXT
messages.success.value = erfolgreich versendet
Abbildung 63: HTML-Quellcode ergänzen
BOKUweb mit TYPO3
38 (81)
Danach speichern und schließen Sie das Content-Element. Ihr Mailformular wird Ihnen nun im
Frontend korrekt angezeigt:
Abbildung 64: Mailformular im Frontend
Wenn das Formular abgesendet wird, dann werden die Inhalte in HTML versendet. Das bedeutet,
dass Sie direkt im Mail auf „einfachen Text“ umstellen müssen. In GroupWise sieht das Symbol
dafür so aus:
Abbildung 65: direkt im Mail auf einfachen Text umstellen
BOKUweb mit TYPO3
39 (81)
4.4
Plugins
Dieses Element ermöglicht es Ihnen ein einzelnes Dokument zum Download (inkl. Abo-Funktion)
einzubinden:
Abbildung 66: Plugins
Sie laden das Dokument einfach hoch und bestimmen Überschrift sowie Bezeichnung:
Abbildung 67: Dokument Download
Im Frontend wird Ihnen das Dokument dann zum Download angezeigt. Das Besondere bei diesem
Element ist die Funktion „Bei Update benachrichtigen“:
Abbildung 68: Dokument Download Frontend
BOKUweb mit TYPO3
40 (81)
Eingeloggte User können bei dieser Funktion ein Häkchen setzen und werden dann bei Upload
einer aktualisierten Version dieses Dokuments, per E-Mail benachrichtigt:
Abbildung 69: Dokument Download Abo-Funktion
4.5
Dynamic Content Elements
Im Bereich Dynamic Content Elements stehen Ihnen unterschiedlichste Elemente zur Verfügung:
Abbildung 70: Dynamic Content Elements
BOKUweb mit TYPO3
41 (81)
Nicht alle Elemente werden Sie für Ihre Seiten benötigen. Wichtige Elemente finden Sie im
Folgenden erklärt.
4.5.1 Iframe
Wenn Sie über die notwendigen Kenntnisse verfügen, dann können Sie das Content-Element
Iframe verwenden. Wir empfehlen Ihnen aber generell - Einbettungen von fremden Seiten in die
BOKU Website – wenn möglich, zu vermeiden. Viele gängige Browser blockieren externe Inhalte
auf einer Website. Oft ist der Hinweis, dass Inhalte blockiert werden sehr unscheinbar und User
sehen lediglich eine leere Seite.
4.5.2 Themenseite: Service-Link
Das Content-Element „Themenseite: Service-Link“ ermöglicht Ihnen eine einheitliche Darstellung
um z.B.: auf Services zu verlinken.
Fügen Sie einfach alle relevanten Informationen (Bild, Link, Text) ein und positionieren Sie das
Element an einer geeigneten Stelle auf Ihrer Seite. Wir empfehlen Ihnen hierfür das Element in ein
Grid-Element einzufügen, da es sich sonst über die ganze Seite erstreckt und so nicht
ansprechend aussieht.
Abbildung 71: Service Link
BOKUweb mit TYPO3
42 (81)
4.5.3 Themenseite: Kontakt
Auch das Content-Element „Themenseite: Kontakt“ ermöglicht Ihnen eine einheitliche Darstellung
von Kontaktinformationen.
Verlinken Sie die Kontaktbox und geben Sie gegebenenfalls einen Text ein. Wenn Sie keinen Text
eingeben, dann erscheint automatisch der Satz „Benötigen Sie Hilfe?“ im Frontend.
Auch hier empfehlen wir Ihnen, diese Box an einer geeigneten Stelle auf Ihrer Seite zu
positionieren - am besten in ein Grid-Element.
Abbildung 72: Themenseite Kontakt
BOKUweb mit TYPO3
43 (81)
4.5.4 Teaserbild für OrgEHs, Termine-, LVA- und Forschungs-Seiten, Themen
Das Teaserbild für OrgEHs, Termine-, LVA- und Forschungs-Seiten, Themen befindet sich auf
jeder Startseite einer Organisationseinheit sowie auf jeder Themenstartseite. Hier können Sie Bild
und bei Bedarf auch Titel und Text einfügen:
Abbildung 73: Teaserbild OrgEHs und Themen Backend
Im Frontend wird Ihnen dann das Bild mit einem Overlay (wenn Titel und Text befüllt sind)
angezeigt. Hinterlegen Sie keinen Text, dann wird das Overlay nicht angezeigt, sondern nur das
Bild:
Abbildung 74: Teaserbild OrgEHs und Themen Frontend
BOKUweb mit TYPO3
44 (81)
4.5.5 Themenseite: Altert Box
Alert Boxen sollen auf bestehende Probleme hinweisen und sollten nur bei sehr wichtigen
Meldungen eingesetzt werden. Sie sind nicht dafür gedacht permanent oder lange auf einer Seite
zu bleiben, denn sonst wird irgendwann nicht mehr auf den Hinweis geachtet.
Für sehr wichtige Nachrichten, Links, Meldungen oder Hinweise - die Sie gerne länger auf einer
bestimmten Seite hätten - eignen sich die manuellen News-Boxen viel besser.
Geben Sie relevante Informationen direkt im Content-Element ein und positionieren Sie auch
dieses Element an geeigneter Stelle auf Ihrer Seite (z.B.: in einem Grid-Element):
Abbildung 75: Altert Box Backend und Frontend
BOKUweb mit TYPO3
45 (81)
4.5.6 Personen-Detailansicht aus BOKUonline
Um dieses Content-Element einzufügen brauchen Sie die jeweilige BOKUonline
Personennummer.
Diese finden Sie in BOKUonline, wenn Sie die Visitenkarte der gewünschten Personen öffnen,
oben im Adresspfad.
Abbildung 76: BOKUonline Personennummer
BOKUweb mit TYPO3
46 (81)
Tragen Sie diese ein und klicken Sie auf „Speichern und Schließen“:
Abbildung 77: Personen-Detailansicht aus BOKUonline Backend
Im Frontend sehen Sie dann alle relevanten Informationen zur jeweiligen Person:
Abbildung 78: Personen-Detailansicht aus BOKUonline Backend
BOKUweb mit TYPO3
47 (81)
4.5.7 Personenanzeige klein aus BOKUonline
Dieses Element steht Ihnen auch in einer kleinen Variante (mit oder ohne Header) zur Verfügung.
Wir empfehlen Ihnen dieses Element am rechten Rand der Webseite zu positionieren. Hierfür
können Sie Grid-Elements verwenden.
Abbildung 79: Personenanzeige klein aus BOKUonline Backend und Frontend
BOKUweb mit TYPO3
48 (81)
4.5.8 News-Box manuell (analog zu Newsanzeige)
Die News-Boxen eignen sich hervorragend um wichtige Nachrichten, Links, Meldungen oder
Hinweise für längere Zeit auf einer Seite zu positionieren.
Hierfür geben Sie alle relevanten Informationen (Titel über und unter Bild, Untertitel, Text, Link und
bei Bedarf Icon) direkt im Content-Element ein:
Abbildung 80: News-Box manuell Backend und Frontend
BOKUweb mit TYPO3
49 (81)
4.6
Grid Elements
Der Bereich Grid Elements ermöglicht es Ihnen Ihre Seiten durch unterschiedliche Elemente
besser zu strukturieren und übersichtlicher zu gestalten:
Abbildung 81: Grid Elements
Sie können Ihre Seite – je nachdem wie Sie es wünschen – in Spalten aufteilen. Fügen Sie dafür
einfach ein Grid-Element auf Ihrer Seite ein. In diesem, können Sie dann weitere Elemente
anlegen:
Abbildung 82: Grid-Element 2:1
BOKUweb mit TYPO3
50 (81)
Auch ist es möglich Spalten ineinander zu verschachteln. Dies kann manchmal recht hilfreich sein
– vor allem für die Anordnung von Bildern:
Abbildung 83: Spalten ineinander
BOKUweb mit TYPO3
51 (81)
5 Top-Stories (News-Items)
Als Top-Stories bezeichnen wir wichtige aktuelle Hinweise im BOKUweb.
Jede Organisationseinheit hat die Möglichkeit eigene News-Items über den News-Container in
TYPO3 zu erstellen. Diese werden automatisch auf der Startseite der eigenen
Organisationseinheit sowie am übergeordneten Departmentlevel angezeigt.
Zusätzlich gibt es aber auch noch die Möglichkeit, News-Items auf unterschiedlichen Ebenen
anzeigen zu lassen – sie also zu Top-Stories zu machen.
In TYPO3 gibt es hier folgende Optionen auszuwählen:




Anzeigen auf Departmentlevel
o keine gesonderte Freigabe nötig
Anzeigen auf Startseite (nur auf Anfrage)
Anzeigen auf einzelnen Zielgruppenseiten (nur auf Anfrage)
Anzeigen auf BOKUscreens (nur auf Anfrage)
Natürlich ist es auch weiterhin möglich eine Top-Story nur auf der Start- bzw. den
Zielgruppenseiten zu schalten, ohne die News auch auf der Startseite der Organisationeinheit
anzeigen zu lassen. Kontaktieren Sie hierfür einfach die Hotline – hotline(at).boku.ac.at – und
schicken Sie uns alle notwendigen Informationen, die wir für die Top-Story benötigen.
Auch wenn Sie selbst ein News-Item anlegen, bitten wir Sie dennoch, uns über die Hotline zu
informieren.
Es gibt auch die Möglichkeit eine Strategische Top-Story zu schalten. Alle Informationen dazu
finden Sie im BOKUweb unter: http://short.boku.ac.at/it-top-stories
BOKUweb mit TYPO3
52 (81)
5.1
News-Item anlegen
News-Items generieren Sie über den News Container.
Wenn in Ihrem News-Container noch keine News-Items angelegt sind, dann erstellen Sie das erste
News-Element am besten über die List View. Sie klicken auf das grüne Plus und wählen das Item
„News“ aus.
Abbildung 84: Erstes News-Item erstellen
Befinden sich in Ihrem News-Container schon News-Items, dann ist es nicht notwendig in die List
View zu wechseln. Klicken Sie einfach über die Page View auf das grüne Plus rechts neben dem
Header.
Abbildung 85: News-Item erstellen
Sie erhalten nun die Oberfläche eines neuen News-Items und können diese befüllen.
BOKUweb mit TYPO3
53 (81)
Bei News-Type können Sie unterschiedliche Möglichkeiten auswählen:



News (normale News)
Internal Page (News wird auf interne Seite verlinkt)
External Page (News wird auf externe Seite verlinkt)
Abbildung 86: Oberfläche News-Item
Im Feld „Date & Time“ wird die aktuelle Zeit automatisch eingetragen, kann aber von Ihnen
jederzeit händisch geändert werden.
BOKUweb mit TYPO3
54 (81)
Mit dem Feld „Archive“ können Sie bestimmen, ab wann Ihre News in das News-Archiv
verschoben werden soll. Hier ist es wichtig zu berücksichtigen, dass man beim Archiv-Datum
immer +1 Tag hinterlegen sollte. Möchte man also, dass eine Top-Story bis 01.01.2016 online ist,
dann muss man das Archive-Datum auf 02.01.2016 setzen.
Im Reiter „Access“ können Sie mit „Publish Date“ bestimmen, wann Ihre News veröffentlicht wird.
Mit „Expiration Date“ hingegen legen Sie fest, ab wann die News endgültig und unwiderruflich
gelöscht werden soll.
Achtung: Wenn Sie ein „Expiration Date“ setzen, dann wird Ihre News auch nicht im News-Archiv
dokumentiert!
Abbildung 87: News-Items Reiter Access
Über den Reiter „Relations“ können Sie der News Bilder oder Dateien hinzufügen.
Abbildung 88: News-Items Reiter Relations
BOKUweb mit TYPO3
55 (81)
Im Reiter „BOKU News Anzeige“ können Sie auswählen, auf welcher Ebene Ihre News für wie
lange angezeigt werden soll. Auf der Startseite Ihrer Organisationseinheit wird Ihr News-Item
automatisch angezeigt. Im Reiter „BOKUscreens Anzeige“ können Sie Text sowie
Schaltungsdauer für die BOKUscreens hinterlegen.
Abbildung 89: News-Item Reiter BOKU News Anzeige und Reiter BOKUscreens Anzeige
BOKUweb mit TYPO3
56 (81)
5.2
News-Item auf Departmentlevel anzeigen
Wenn Sie diese Option auswählen, dann wird Ihr News-Item auch automatisch auf dem
übergeordneten Departmentlevel angezeigt. Eine gesonderte Freigabe ist hierfür nicht mehr
notwendig.
5.3 News-Item auf BOKU-Startseite anzeigen
Um die News auch auf der BOKU-Startseite anzeigen zu lassen, müssen Sie über die TYPO3 die
Anfrage stellen und dafür das Häkchen setzen. Ihre News erscheinen nicht automatisch auf der
Startseite, sondern wird erst nach einer Prüfung durch dafür verantwortliche Personen
freigegeben.
Bitte informieren Sie uns auch immer über unsere Hotline [email protected] wenn Sie ein
News-Item zur Freigabe angelegt haben.
5.4
News-Item Zielgruppenseiten anzeigen
Wollen Sie, dass Ihre News auch auf den einzelnen Zielgruppenseiten zu sehen sind, dann
müssen Sie diese Option in TYPO3 auswählen. Zusätzlich müssen Sie auch angeben auf welchen
Zielgruppenseiten Ihre News angezeigt werden soll. Die unterschiedlichen Zielgruppen können Sie
im Reiter „Options“ auswählen.
Abbildung 90: News-Item auf welchen Zielgruppenseiten anzeigen
Auch hier erscheint Ihre News nicht automatisch auf den gewünschten Zielgruppenseiten, sondern
wird erst nach einer Prüfung durch dafür verantwortliche Personen freigegeben.
Bitte informieren Sie uns auch immer über unsere Hotline hotline(at)boku.ac.at wenn Sie ein
News-Item zur Freigabe angelegt haben.
BOKUweb mit TYPO3
57 (81)
5.5
News-Item auf BOKUscreens anzeigen
Wenn Sie möchten, dass Ihr News-Item auch auf den BOKUscreens angezeigt wird, dann wählen
Sie diese Option in TYPO3 im Reiter „BOKUscreens Anzeige“ aus. Zusätzlich müssen Sie noch
die Dauer (Beginn/Ende) der News bestimmen sowie Überschrift und Text für die BOKUscreens
hinzufügen.
Abbildung 91: News-Item auf BOKUscreens anzeigen
Bitte berücksichtigen Sie die Textvorgaben für die BOKUscreens sowie die Vorgaben für Bilder.
Infos dahingehend finde Sie hier: http://www.boku.ac.at/zid/themen/beinformed/infomanagement/top-stories/qualitaetskriterien-top-stories/
BOKUweb mit TYPO3
58 (81)
Preview Funktion Top-Stories
5.6
Wenn man ein News-Item erstellt hat, dann gibt es im die Möglichkeit sich eine Preview der
unterschiedlichen Ebenen anzeigen zu lassen.
Klicken Sie hierfür einfach auf das Symbol „Save document and view page“. Dann öffnet sich in
einem eigenen Reiter eine Vorschau des News-Items:
Abbildung 92: Preview News-Item
Sie erhalten nun einen Überblick, wie Ihre News auf den unterschiedlichen Ebenen auf der Sie sie
schalten können aussieht:







Strategische Top-Story im Startseiten-Slider auf der BOKU-Startseite
Startseite/Masonry (News-Item auf der BOKU-Startseite)
Department-Startseite
Zielgruppen-Startseite
BOKUScreens (diese können Sie leider nicht einsehen, da Sie hier keinen Zugriff auf das
dahinterliegende Netzwerk haben.)
Detailansicht (Ansicht bei Klick auf Top-Story mit Detailtext)
Newsletter
BOKUweb mit TYPO3
59 (81)
5.7
Qualitätskriterien Top-Stories
Um Ihr News-Item auf der BOKU-Startseite, den gewünschten Zielgruppenseiten sowie den
BOKUscreens zu veröffentlichen, ist eine gesonderte Freigabe notwendig.
Damit diese Freigabe schnell und problemlos erfolgen kann, müssen Sie bei der Erstellung Ihrer
Top-Story einige Anforderungen berücksichtigen.
Genaue Infos zu den Qualitätskriterien einer Top-Story finden Sie hier:
http://www.boku.ac.at/zid/themen/be-informed/infomanagement/topstories/qualitaetskriterien-top-stories/
BOKUweb mit TYPO3
60 (81)
6 Seiten und Inhalte verwalten
In diesem Kapitel wird erklärt wie Sie Seiten und Inhalte kopieren, verschieben und löschen
können.
Achtung: arbeiten Sie über die List-View, dann achten Sie darauf, dass Ihnen auch alle
verfügbaren Elemente angezeigt werden. Dies erreichen Sie durch die Aktivierung der Bereiche:



Extended view
Show clipboard
Localization view
Standardmäßig sind diese Elemente in TYPO3 nämlich nicht aktiviert.
Abbildung 93: alle Elemente in List-View anzeigen
BOKUweb mit TYPO3
61 (81)
6.1
Seiten und Inhalte löschen
Seiten und Inhalte löschen Sie am besten über das Kontextmenü direkt bei der Seite bzw. dem
Content-Element.
Abbildung 94: Inhalte und Content-Elemente löschen über Kontextmenü
BOKUweb mit TYPO3
62 (81)
Es ist jedoch auch möglich Seiten und Inhalte über die List-View zu löschen:
Abbildung 95: Inhalte und Content-Elemente löschen über List-View
6.2
Seiten verschieben
Seiten können direkt im Seitenbaum mittels „Drag & Drop“ verschoben werden. Klicken Sie einfach
auf die Seite und ziehen Sie sie an jene Stelle an der Sie die Seite gerne hätten:
Abbildung 96: Seiten im Seitenbaum verschieben
Wenn Sie eine Seite zur Unterseite machen möchten, dann ziehen Sie die Seite einfach in die
gewünschte Überseite hinein.
BOKUweb mit TYPO3
63 (81)
Auch können Seiten in der List-View verschoben werden. Hierfür verwenden Sie das Symbol
„Move Page“ und bestimmen den Ort an den Ihre Seite verschoben werden soll:
Abbildung 97: Seiten in der List-View verschieben
BOKUweb mit TYPO3
64 (81)
6.3
Inhalte verschieben
Möchten Sie Inhalte in einer Seite verschieben, dann können Sie das mit „Drag & Drop“ direkt im
Page-Bereich machen. Ziehen Sie das Element einfach an die gewünschte Stelle und lassen es im
grünen Bereich fallen:
Abbildung 98: Content-Elemente verschieben
BOKUweb mit TYPO3
65 (81)
In der List-View können sie Content-Elemente mit den Pfeilsymbolen verschieben. Dies ist jedoch
nur innerhalb der Seite möglich. Mit dem Symbol „Re-position content element“ ist es jedoch
möglich die Content-Elemente an ganz anderen Stellen zu positionieren:
Abbildung 99: Content-Elemente in List-View verschieben
BOKUweb mit TYPO3
66 (81)
6.4
Seiten kopieren und einfügen
Seiten können Sie ganz einfach über das Kontextmenü kopieren:
Abbildung 100: Seiten über Kontextmenü
Danach klicken Sie im Kontextmenü an der gewünschten Stelle auf „Paste into“ oder „Paste after“:
Abbildung 101: Seite an gewünschter Stelle einfügen
Sie können die kopierte Seite durchaus auch auf einmal an mehreren Stellen einfügen.
BOKUweb mit TYPO3
67 (81)
Seiten können auch in der List-View kopiert und eingefügt werden. Nutzen Sie dafür die
entsprechenden Symbole.
Abbildung 102: Seiten kopieren und einfügen in der List-View
Achtung: durch das Einfügen der Seite ändern sich der Seitentitel sowie die Sichtbarkeit der Seite
automatisch.
6.5
Inhalte kopieren und einfügen
Inhalte können über das Kontextmenü kopiert und beliebig oft eingefügt werden:
Abbildung 103: Inhalte kopieren und einfügen über Kontextmenü
Auch über die List-View ist das kopieren und einfügen von Elementen möglich.
Abbildung 104: Inhalte kopieren und einfügen über List-View
BOKUweb mit TYPO3
68 (81)
6.6
Mehrere Elemente auf einmal verschieben, kopieren und einfügen
Um mehrere Elemente auf einmal verschieben, kopieren oder einfügen zu können, müssen Sie in
die List-View wechseln und sich in dieser am besten alle Elemente anzeigen lassen. Somit wird
Ihnen auch das Clipboard angezeigt:
Abbildung 105: Wechseln in die List-View
Klicken Sie auf das „Plus“ bei „Clipboard #1“. Dadurch erhalten Sie Checkboxen bei den einzelnen
Elementen. Wählen Sie die gewünschten Elemente aus und klicken Sie auf das Symbol „transfer
the selection of records to clipboard“.
Abbildung 106: Elemente auf Clipboard transferieren
BOKUweb mit TYPO3
69 (81)
Nun werden Ihnen alle Elemente die Sie ausgewählt haben, auf Ihrem Clipboard angezeigt. Sie
müssen nun nur noch die Aktion die Sie durchführen wollen, auf dem Clipboard auswählen:
Abbildung 107: Clipboard mit Elementen
Danach können Sie die Elemente an jedem beliebigen Ort und auch beliebig oft über die List-View
einfügen. Klicken Sie dazu einfach auf das Symbol „Paste in clipboard content“.
Abbildung 108: Elemente vom Clipboard einfügen
Nachdem Einfügen sind Ihre Elemente automatisch unsichtbar gestellt.
Achtung: Es stehen Ihnen Clipboard #1, Clipboard #2 und Clipboard #3 zur Verfügung. Auf diese
Clipboards können Sie unterschiedliche Elemente hinzufügen, die Sie dann an unterschiedlichen
Stellen wieder einfügen können. Sie können jedoch nur den gesamten Inhalt von Clipboard #1
einfügen und nicht nur zwei Elemente davon.
Achtung: wenn Sie das Element „Move elements“ auswählen, dann werden Ihre Elemente
ausgeschnitten und können nur einmal von Ihnen eingefügt werden.
BOKUweb mit TYPO3
70 (81)
7 Spezielle Seitentypen
Folgendes Kapitel erläutert spezielle Seitentypen die in TYPO3 erstellt werden können. Auch wird
der Aufbau der Webseiten der Organisationseinheiten im BOKUweb erklärt.
7.1
Standardseite
Wenn Sie eine neue Seite erstellen, dann können Sie unter dem Reiter „General“, den „Page
Type“ auswählen. Automatisch voreingestellt ist eine normale Webseite „Standard“:
Abbildung 109: Standardseite erstellen
7.2
Shortcut
Sie können jedoch auch einen Shortcut erstellen. Das bedeutet, Sie verlinken die Seite auf eine
andere, innerhalb von TYPO3 liegende, Seite. Dazu wählen Sie den „Page Type Shortcut“ und
bestimmen die Seite auf die Sie verlinken möchten:
Abbildung 110: Shortcut erstellen
BOKUweb mit TYPO3
71 (81)
Achtung: Dieser Seitentyp dient nur dazu, dass die eigentliche Seite zusätzlich auch an anderen
Stellen in der Navigation erscheint und dort ebenfalls angeklickt werden kann. Sie können zu
einem Shortcut keine Seiteninhalte hinzufügen. Für Leserinnen und Leser kann ein Shortcut oft
verwirrend wirken, da man dadurch an eine komplett fremde Stelle in der Navigation springt.
Shortcuts sollten deshalb eher selten eigensetzt werden.
7.3
Link auf Externen URL
Durch dieses Element verlinken Sie auf eine Seite außerhalb von TYPO3:
Abbildung 111: Link auf Externen URL
Achtung: Auch zu diesem Seitentyp können Sie keine Seiteninhalte hinzufügen und auch diesen
Typ sollten Sie eher sparsam verwenden.
BOKUweb mit TYPO3
72 (81)
8 Zweisprachige Seiten erstellen
TYPO3 unterstützt mehrsprachige Webseiten. In diesem Kapitel wird Ihnen die Vorgehensweise
für englischsprachige Seiten gezeigt, bei weiteren Sprachen gehen Sie einfach analog vor.
Es ist nicht zwingend nötig die kompletten Inhalte der Seite zu übersetzen. Es reicht auch oft, nur
kurz die wichtigsten Informationen in der gewünschten Sprache zusammenzufassen. Seiten die es
in der Zweitsprache nicht gibt, scheinen in der Navigation dieser auch nicht auf.
8.1
Englische Version einer Seite anlegen
Dazu wählen Sie in der Arbeitsfläche von TYPO3 die gewünschte Sprache aus:
Abbildung 112: Englische Version erstellen
Anschließend benennen Sie die Seite und verstecken diese noch, bis Sie sie fertig gestellt haben:
Abbildung 113: Englische Seite benennen und verstecken
BOKUweb mit TYPO3
73 (81)
Klicken Sie danach auf speichern und schließen und Ihre englische Seite ist erstellt!
Wenn Sie die Seiteneigenschaften der deutschen Seite bearbeiten möchten, dann müssen Sie auf
den Bleistift zum Editieren links oben in der Arbeitsfläche klicken. Die englischen
Seiteneigenschaften editieren Sie neben dem englischen Seitentitel:
Abbildung 114: Seiteneigenschaften ändern
Englische Version der Inhalte erstellen
8.2
Bei der Übersetzung der Inhalte in eine andere Sprache gibt es zwei verschiedenen Möglichkeiten
wie Sie in TYPO3 vorgehen können:


Übersetzung der Seite gleich wie im Deutschen
Unabhängige Übersetzung der englischen Inhalte
BOKUweb mit TYPO3
74 (81)
8.2.1 Übersetzung der Seite gleich wie im Deutschen
Hierfür müssen Sie in die „List View“ wechseln um sich alle Möglichkeiten zur Bearbeitung von
Inhalten anzeigen zu lassen:
Abbildung 115: List View
Bei allen Inhaltselementen für die es noch keine Übersetzung gibt, scheint in der Spalte „Localize
to“ eine englische Fahne auf:
Abbildung 116: List View mit „Localize to“
Wenn Sie auf die englische Fahne klicken, dann erstellt Ihnen TYPO3 eine englische Version
dieses Inhaltselements. Das bedeutet, dass alle Formatierungen, Links, Bilder etc. automatisch im
Inhaltselement erhalten bleiben und Sie noch die Übersetzung eingeben müssen.
BOKUweb mit TYPO3
75 (81)
Um Ihnen die Übersetzung zu erleichtern, zeigt Ihnen TYPO3 unter jedem Eingabefeld den
deutschen Text an. Vergessen Sie nicht die Übersetzungshinweise von TYPO3 („Translate to
English“) zu entfernen.
Abbildung 117: Übersetzung der Inhalte
Nachdem Sie die Inhalte des Content-Elements übersetzt haben, klicken Sie auf speichern und
schließen und Sie haben eine englische Version eines Inhaltselements erstellt.
BOKUweb mit TYPO3
76 (81)
8.2.2 Unabhängige Übersetzung der englischen Inhalte
Hierzu klicken Sie einfach im englischen Bereich Ihrer Seite auf das grüne Plus. Alle ContentElemente die Sie dann auswählen, sind automatisch auf Englisch voreingestellt:
Abbildung 118: Unabhängige englische Überetzung erstellen
BOKUweb mit TYPO3
77 (81)
9 WAI Richtlinien – Barrierefreiheit von Webseiten
Die WAI Richtlinien - Web Content Accessibility Guidelines - streben an Webseiten barrierefrei zu
machen, das bedeutet Sie Personen mit besonderen Bedürfnissen leichter zugänglich zu machen.
Darunter fallen zum Beispiel Menschen mit Blindheit oder Sehbehinderung, Gehörlosigkeit sowie
nachlassendem Hörvermögen, Lernbehinderungen, kognitive Einschränkungen, eingeschränkte
Bewegungsfähigkeit, Sprachbehinderungen, Photosensibilität und Kombinationen aus diesen
Behinderungen.
Neben vielen technischen Aspekten können Sie als Webredakteurin oder Webredakteur durch die
Gestaltung Ihrer Webinhalte sehr viel Einfluss darauf nehmen, wie Menschen mit besonderen
Bedürfnissen diese wahrnehmen.
Bitte berücksichtigen Sie folgende Punkte bei der Gestaltung Ihrer Webinhalte im BOKUweb und
versuchen Sie diese immer im Hinterkopf zu behalten wenn Sie Ihre Seiten bearbeiten:




Verwenden Sie Farben im Text nur sehr eingeschränkt und versuchen Sie diese nicht als
Orientierungsschema zu benutzen.
Strukturieren Sie Ihre Inhalte – verwenden Sie Header als Sprungpunkte. Damit ist
gemeint, dass Sie nicht ein großes Content-Element auf Ihrer Seite anlegen sollten,
sondern Inhalte in mehrere kleine Elemente aufteilen sollten. Dadurch können die Inhalte
leichter von diversen Tools interpretiert werden, die Menschen mit besonderen
Bedürfnissen nutzen um Webseiten zu lesen.
Geben Sie Bildern einen Alternativtitel, der von einem Screenreader interpretiert werden
kann.
Wenn Sie Inhalte via Bilder, Grafiken oder Videos bereitstellen, dann sorgen Sie dafür dass
es alternative Informationsquellen für Menschen mit besonderen Bedürfnissen gibt die
diese Inhalte nicht – oder nur sehr schwer – konsumieren können.
BOKUweb mit TYPO3
78 (81)
10 Wichtige Informationen zum BOKUweb
Wie ist die Startseite meiner Organisationseinheit aufgebaut? Welche Informationen im BOKUweb
kann ich selbst wo bearbeiten/verändern und welche sind automatisch generiert?
Diese und natürlich viele andere Fragen treffen bei uns regelmäßig über die Hotline ein. Wir haben
daher für Sie unter nachfolgender Adresse eine Seite zusammengestellt, die einen Überblick über
allen wichtigen Informationen zum BOKUweb gibt: http://short.boku.ac.at/it-info-bokuweb
11 Short URLs im BOKUweb
Im BOKUweb generiert sich der URL-Pfad aus dem Seitenbaum in TYPO3. Es wird also genau der
Pfad nachgebildet, wo die jeweilige Seite im Backend von TYPO3 liegt.
Alle Webredakteurinnen und Webredakteure haben jedoch die Möglichkeit diese langen URLs
ganz einfach zu kürzen. Alle Möglichkeiten finden Sie im BOKUweb unter:
http://short.boku.ac.at/zid-short-url
12 Bildersuche im Internet
Immer wieder merken wir, dass der Bedarf an guten Bildern sehr groß ist. Gleichzeitig ist gerade
im letzten Jahr das Angebot an hochwertigen Bildern, deren Lizenzmodell in vielen Fällen eine
kostenfreie Nutzung gestattet, immens gewachsen.
Deswegen haben wir einige Hinweise und Tipps für Sie zusammengestellt, wie Sie in vielen Fällen
schnell und ohne viel Aufwand zu tollen Bildern kommen, ohne Geld für Lizenzen zu benötigen
und wie sie diese im BOKUweb einsetzen können: http://short.boku.ac.at/it-bildersuche
13 DOKU: Bugs im BOKUweb
Auf diesen Seiten finden Webredakteure und Webredakteurinnen Informationen über kleine Bugs
im BOKUweb, für die es im Moment noch keine Lösung gibt und die wir - mittelfristig - also noch
nicht beheben können: http://short.boku.ac.at/it-bugs-bokuweb
14 Online-Informationen zu TYPO3
Informationen über das BOKUweb mit TYPO3 finden Sie online unter:
http://www.boku.ac.at/typo3einf/
Allgemeine Informationen über TYPO3 finden Sie hier: http://typo3.org/
BOKUweb mit TYPO3
79 (81)
15 Alternativen zu TYPO3
Wenn Sie überlegen TYPO3 auch als Content-Management-System für private Projekte
einzusetzen, dann bedenken Sie bitte, dass TYPO3 zwar für Webautoren und Webautorinnen sehr
einfach und bequem zu verwenden ist, die Implementierung, Konfiguration und Administration
eines TYPO3 Systems jedoch einen sehr hohen professionellen Aufwand darstellt.
TYPO3 eignet sich in erster Linie für den Webauftritt eines sehr großen Unternehmens.
Für kleinere Projekte mit einem kleineren Redaktionsteam gibt es geeignetere ContentManagement-Systeme. Besonders häufig eingesetzt werden z.B. Joomla oder WordPress.
BOKUweb mit TYPO3
80 (81)
Historie
Letzte Änderung:
1. Juni 2016
Die aktuelle Version dieser Dokumentation finden Sie auf den Serviceseiten
des ZID unter: http://www.boku.ac.at/typo3einf/
Dokument
BOKUweb mit TYPO3
BOKUweb_mit_TYPO3_DE_V.1.0.19_2016-06-01
Quelldokument
BOKU
---
Aktualisierungsdatum/ Autor
Version Änderungen
2014-03-19 (MO/ZID)
1.0.0
Dokumentation erstellt (auf Basis der TYPO3 Einführung geschrieben von Hubert Partl)
2014-03-28 (MO/ZID)
1.0.1.
Ausführliche DOKU Mailformular und Info bzgl. Iframe ergänzt.
2014-06-06 (MO/ZID)
1.0.2.
Top-Story Kapitel: Separate Start- und Zielgruppenseitenfunktion hinzugefügt sowie Infos bzgl.
Preview auf News_Items.
2014-08-25 (MO/ZID)
1.0.3
Info hinzugefügt, dass bei Top-Stories nach wie vor Info an die Hotline notwendig ist sowie die
Möglichkeit bei den BOKUscreens ein Alternativ-Bild hinzuzufügen.
2014-08-28 (MO/ZID)
1.0.4
Qualitätskriterien Top-Stories ergänzt.
2014-09-30 (MO/ZID)
1.0.5
Info über aktuelle TYPO3 Version ergänzt.
2014-10-15 (MO/ZID)
1.0.6
Foto bei Dynamic Content Elements ausgetauscht.
2014-12-09 (MO/ZID)
1.0.7
Update: Header H5 weg, Text&Image Element Icon, Hinweise Iframe.
2015-02-20 (MO/ZID)
1.0.8
Update Screenshots: neuer Reiter BOKUscreens Anzeige.
2015-04-21 (MO/ZID)
1.0.9
Update: Nicht druckbare Elemente, WAI Informationen, Seiten ID, Rechtschreibung & Grammatik.
2015-05-15 (MO/ZID)
1.0.10
Umstrukturierung Infos Top-Stories. Keine neuen Inhalte!
2015-05-22 (MO/ZID)
1.0.11
Hinzufügen der Infos bzgl. Strategischer Top-Stories. Verweis auf neue Infos im BOKUweb bzgl.
BOKUweb Aufbau und Fotosuche.
28-05-2015 (MO/ZID)
1.0.12
News-Preview Infos aktualisiert und Hinweis auf Layout FAQ.
05-08-2015 (MO/ZID)
1.0.13
Infos zur Personen-Detailansicht (BOKUonline Personennummer) aus BOKUonline ergänzt.
23-10-2015 (MO/ZID)
1.0.14
Infos bzgl. Short-URL Service hinzugefügt.
09-11-2015 (MO/ZID)
1.0.15
Top-Story Infos gekürzt, da Infos im BOKUweb ergänzt.
25-01-2016 (MO/ZID)
1.0.16
Infos bzgl. Teaser bei automatisierten Inhalten hinzugefügt.
15-03-2016 (MO/ZID)
1.0.17
Infos bzgl. DOKU: Bugs im BOKUweb ergänzt.
22-04-2016 (MO/ZID
1.0.18
Infos bzgl. neuen Content-Element ergänzt.
01-06-2016 (MO/ZID)
1.0.19
Info ergänzt: Personenanzeige klein aus BOKUonline kann nun auch ohne Header verwendet
werden.
BOKUweb mit TYPO3
81 (81)

TYPO3 Einführung - BOKU

Transcription

Documents pareils

TYPO3 COOP - Hochschule Darmstadt

Pressemitteilung der Fa. Weber eBusiness Services, Balingen

Typo3-Entwickler/-Entwicklerin gesucht Typo3

Profil: Thomas Hümmler

dokzentrum.org: AUFBAU + ARCHITEKTUR im TYPO3