Geben Sie in Ihrem Browser folgende URL ein: http://typo3.p632203.webspaceconfig.de/

Geben Sie in den Verzeichnisschutz Benutzer: demo und bei Passwort: demo+123 ein.
Nun sehen Sie das zukünftige Frontend der Webseite.

Um in das Backend zu gelangen, geben Sie hinter oben stehende URL /typo3 ein. (typo3.p632203.webspaceconfig.de/typo3)
Hier können Sie sich nun mit Ihren Zugangsdaten die Sie von uns bekommen haben einloggen.

Um die Bildausrichtung anzupassen, gehen Sie wie folgt vor:

• Öffnen/Erstellen Sie ein "Text und Bilder" Element
• Klicken Sie oben auf den Reiter "Bilder"
• Wählen Sie unter Galerieeinstellungen die gewünschte Ausrichtung und Position

Folgende Möglichkeiten stehen Ihnen zur Ausrichtung und Positionierung zur Verfügung:

• Oben links/mittig/rechts
  Das Bild wird links/zentriert/rechts oberhalb des Textes dargestellt.
   
• Unten links/mittig/rechts
  Das Bild wird links/zentriert/rechts unterhalb des Textes dargestellt.
   
• Im Text links/rechts
  Das Bild wird links/rechts ausgerichtet und vom Text umflossen.
   
• Neben dem Text links/rechts
  Das Bild wird links/rechts ausgerichtet. Der Text fließt neben dem Bild vorbei.

Diese Möglichkeit besteht. Hier können Sie sich aus der Variante 1 - Text mit Bild rechts - den Button kopieren.

Klicken Sie auf das Stiftsymbol um in den Bearbeitungsmodus zu gelangen. Im Textfeld klicken Sie in der Bearbeitungsleiste auf Quellcode. Am Ende des Textes steht folgender Code:

<p><a class="btn btn-blue" href="t3://page?uid=1">Button</a></p>

Diesen kopieren Sie sich und fügen diesen am Ende des gewünschten Textes ein. Falls Sie hierbei Hilfe benötigen, melden Sie sich bitte gerne jederzeit.

Die Icons sind in der Dateiliste unter dem Punkt 'ICONS' hinterlegt.
Falls Ihnen ein passendes Icon fehlt, geben Sie uns bitte Bescheid.

Sie klicken auf das Stift-Symbol der zu bearbeitenden Box und klicken oben im Reiter auf Erscheiungsbild.

Hier können Sie über den Punkt Layout die Farbe der Box abändern:

• Dunkelgrün
• Hellblau
• Dunkelblau
• Grau

Bitte achten Sie hier, falls die Farben anpassen auf ein einheitliches Bild.

Es kann vorkommen, dass im Textfeld am Ende des Textes sich Leerzeilen eingeschlichen haben. Bitte kontrollieren Sie, ob unterhalb des Textes keine unnötigen Leerzeilen sind.

Da wir die Bildformate in der Programmierung vorgegeben haben, schneidet dass System diese automatisiert zu.
Falls es sich jedoch um länger gezogene Quer- oder Hochformat Bilder handelt, können Sie diese wie folgt anpassen.

1. Element bearbeiten über das Stiftsymbol
2. Oben im Reiter Erscheinungsbild können Sie bei Rahmen die Option "Bild Originalmaße" anzeigen auswählen.
3. Das Bild wird nun im Frontend in den Originalmaßen angezeigt

Achtung: Falls das Bild nun zu groß sein sollte, nehmen Sie folgende Einstellungen vor

1. Elemtn bearbeiten über das Stiftsymbol
2. Reiter Bilder im Abschnitt Medienanpassungen (unterhalb der eingefügten Bilder)
3. Breite jedes Elements auf 500 setzen

Falls dies immer noch zu groß sein sollte, einfach 50 weniger nehmen, bis es die gewünschte Größe hat.

Wenn Sie ein Bild in ein Text-Bild-Element einfügen müssen, brauchen Sie die Größe nicht anpassen, da wir dies bereits vorgegeben haben.

Beim Hochladen der Bilder in der Dateiliste bitte darauf achten, dass die Bilder nicht zu groß sind. (Header Bilder sollten knapp unter 1 MB liegen, andere Bildelement sollten 300 KB unterschreiten)

Über das Programm Paint haben sie die Möglichkeit, folgendermaßen die Bildgröße anzupassen:

• Rechtsklick auf das zu komprimierende Bild
• Öffnen mit > Paint
• In Paint:
  • Reiter Start > Größe ändern
  • "Pixel" wählen und Haken bei "Seitenverhältnis beibehalten" setzen
  • Horizontal 800px bei Inhaltsbildern und 2000px bei Headerbildern einstellen (sofern das Original größer ist)
  • Vertikale Größe passt sich automatisch an!
  • Bild speichern und hochladen

Um optimale Ergebnisse zu erzielen, sollten die Fotos, nachdem sie in Paint verkleinert wurden, zusätzlich komprimiert (Reduktion digitaler Daten) werden.
Dazu stehen ihnen verschiedene Websites zur Verfügung. Hier zwei Beispiele, die sie bedenkenlos verwenden können:

• https://kraken.io/web-interface (Das kostenlose Webinterface hat eine Dateigrößenbeschränkung von 1 MB)
• https://compressor.io/  

Da die Bilder als Kreis ausgegeben werden, ist hier das Seitenverhältnis 1:1. 
Hier sind quadratische Bilder am geeignetsten.

Hier besteht die Möglichkeit, wenn mehr Formulare auf einer Seite untereinander ausgegeben werden sollen, diese in zwei Spalten zu gliedern.

Es muss somit innerhalb der Formular Variante ein neuer Inhalt angelegt werden. Wählen Sie hier oben im Reiter den letzten (T3SB Grid) aus und klicken Sie auf 2 Columns.
Jetzt werden somit zwei bearbeitbare Spalten angelegt. Hier können Sie nun das Element Formualre zum Downloaden auf beiden Seiten einfügen.

Falls Sie bei der Umsetzung Hilfe benötigen, oder wir dies in der Muster Variante integrieren sollen, melden Sie sich gerne jederzeit.

1. Kopieren Sie das Inhaltselement Slick Slider mit Bildern auf der Musterseite und fügen es auf gewünschter Unterseite im Headerbereich ein.
2. Bearbeiten Sie das eben eingefügte Inhaltselement über das Stiftsymbol und klicken Sie auf den Reiter Bilder.
3. Dort können Sie nun sämtliche Bilder, die im Slider angezeigt werden sollen, einfügen. (Wichtig! Barrierefreiheit und Copyrightnachweis hinterlegen.)

Hinweis: Soll nur ein Bild, statt des Sliders angezeigt werden, führen Sie die Schritte trotzdem, wie oben beschrieben aus. Der Slider wird erst aktiviert, wenn mehr als ein Bild hinterlegt wurde.

Mitarbeiter verwalten (nur Admins)

Um einen neuen Mitarbeiter anzulegen bzw. zu bearbeiten, muss dieser in der CSV-Datei data.csv ergänzt/angepasst und erneut hochgeladen werden. 
Ein dazugehöriges Mitarbeiterfoto kann optional im Unterordner img bereitgestellt werden. Wichtig: Der Bildname in der CSV-Datei muss mit dem des bereitgestellten Bildes übereinstimmen.

Der Task wird einmal täglich durchgeführt, neue Mitarbeiter werden also ggf. erst am nächsten Tag angezeigt.

Datenausgabe verwalten (nur Admins)

Möchten Sie Angaben wie Anrede, Adresse usw. ausblenden, gehen Sie wie folgt vor:

1.  Öffnen Sie die Detailseite csv_import in der Listenansicht (Wichtig: Diese Seite ausgeblendet lassen!)
2. Öffnen Sie den Mitarbeiter, der bearbeitet werden soll, über das Stiftsymbol rechts vom Mitarbeiternamen.
3. Hier haben Sie nun die Möglichkeit, jede Angabe ein- bzw. auszublenden.

Mitarbeiter auf einer Detailseite ausgeben

1. Muster "Variante 3 - Ansprechpartner neu" mit dem lila Rahmen kopieren und an gewünschter Stelle einfügen. 
2. Lila Box rechts aktivieren und auf das Stiftsymbol klicken, um die Überschrift "Variante 3 - Ansprechpartner neu" anzupassen. Speichern und zurück.
3. In-Box "Contact List" rechts aktivieren und auf das Stiftsymbol zum Bearbeiten klicken. In dem Feld "Plug-In:" die gewünschte(n) Person(en) auswählen.
   Sie haben die Möglichkeit über das Filter-Symbol Personen zu suchen. 
4. Wenn Sie eine Person fälschlicherweise ausgewählt haben und entfernen möchten, klicken Sie auf das Mülleimer-Symbol. 
5. Dann wie gewöhnlich Speichern.

Um eine Weiterleitung zu erstellen, gehen Sie wie folgt vor:

1. Öffnen Sie links das Modul "Weiterleitungen"
2. Erstellen Sie über das Plussymbol ganz oben eine neue Weiterleitung
3. Wählen Sie unter Quelldomain die Domain die weitergeleitet werden soll (z. B. www.lra-mue.de)
4. Unter Pfad tragen Sie den Pfad hinter der Quelldomain ein (alles hinterhalb des /. Z. B. /seite/unterseite)
   Gibt es keinen Pfad hinter der Domain tragen Sie bitte nur / ein.
5. Unter Ziel wählen Sie, wohin weitergeleitet werden soll
6. Unter HTTP-Statuscode wählen Sie 301

Abstände zwischen Containern (Elemente mit lila Rahmen in TYPO3):

• Container haben vordefinierte Abstände, die nicht geändert werden können.
• Um sie optisch besser voneinander abzugrenzen, kann ein grauer Hintergrund hinzugefügt werden.
• Öffnen Sie dazu die Bearbeitung des Containers (Klick auf das Stiftsymbol).
• Wählen Sie im Menü "Erscheinungsbild" > "Layout" den grauen Hintergrund aus.

Abstände zwischen Inhaltselementen:

• Im Gegensatz zu Containern können die Abstände bei anderen Inhaltselementen angepasst werden.
• Gehen Sie dazu in den Bearbeitungsmodus des Elements.
• Unter "Erscheinungsbild" finden Sie die Optionen "Abstand davor" und "Abstand danach".
• Hier können Sie zusätzliche Abstände über oder unter dem Element festlegen.

1. Bei der Formularerstellung über „neues Element erstellen“ das Element „Typolink Checkbox“ auswählen.
2. Den Text, der im Formular neben der Checkbox angezeigt werden soll, rechts unter „Label“ einfügen.
3. Den zu verlinkenden Text mit doppelten eckigen Klammern umschließen (z. B. [[Datenschutzerklärung]]).
4. Unter "Link", über das Büroklammer-Icon, wie gewohnt die Verlinkung setzen.
5. Falls gewünscht, den Haken bei „Pflichtfeld“ setzen.

Um eine Mikroseite in TYPO3 anzulegen, gehen Sie wie folgt vor:

1. Legen Sie eine Standard-Unterseite an gewünschter Stelle ein.
2. Öffnen Sie mit Rechtsklick > Bearbeiten auf die eben erstellte Unterseite die Seiteneigenschaften
3. Aktivieren Sie unter "Verhalten" die Option "Als Anfang der Website benutzen"
4. Wählen Sie unter "Erscheinungsbild" für beide Backend-Layouts "100%" aus und speichern Sie die Änderungen
5. Öffnen Sie links das Modul "Template" und wählen Sie "Template für neue Website erstellen"
6. Wählen Sie nun "Vollständigen Datensatz bearbeiten"
7. Binden Sie unter "Enthält" die folgenden statischen Template per Klick ein
   1. Fluid Content Elements
   2. Fluid Content Elements CSS
   3. Sketch Room Template TYPO3 11
   4. Form
   5. Mask
   6. Containeritems
   7. Bootstrap Grid System
   8. [joppnet] Lightbox
   9. Faceted Search
   10. News
   11. News Styles Twitter Bootstrap
   12. News Styles Twitter Bootstrap V5
   13. Slick
   14. Contact Person
   15. Form Search
   16. Div2007 language setup
8. Aktivieren Sie unter "Optionen" sämtliche Einstellungen und speichern Sie Ihre Einstellungen
9. Öffnen Sie links das Modul "Sites"
10. Öffnen Sie die eben erstellte Seite über das Stiftsymbol
11. Legen Sie hier Titel der Website, Site Identifier (kann frei gewählt werden) und den Einstiegspunkt (URL über die die Seite erreichbar sein soll) fest.

Um den Inhalt des Footers anzupassen, gehen Sie wie folgt vor:

1. Öffnen Sie in TYPO3 die Unterseite "Footer" im Ordner "Zusatzseiten"
2. Bearbeiten Sie hier, wie gewohnt, die Inhalte

Nehmen Sie folgende Einstellungen vor, um Redakteuren die Möglichkeit zu geben, Weiterleitungen erstellen:

1. Öffnen Sie im Backend das Modul "Backend-Benutzer"
2. Bearbeiten Sie den Benutzer, dem die zusätzlichen Berichtigungen erteilt werden sollen, über das Stiftsymbol
3. Wählen Sie im Reiter "Allgemein" unter "Gruppe" per Klick die Gruppe "Weiterleitungen" aus
4. Speichern Sie die Anpassungen

1. Öffnen Sie im Backend die Unterseite "Zusatzinhalt" im Ordner "Zusatzinhalt".
2. Bearbeiten Sie das HTML-Element auf der Unterseite.
3. Kopieren Sie einen `<a>`-Tag, um ein neues Element zu erstellen.
4. Fügen Sie den kopierten `<a>`-Tag an der gewünschten Stelle ein.
5. Passen Sie im `href`-Attribut die Verlinkung an (`z. B. /pfad/` für interne, z. B. `www.domain.de` für externe Links).
6. Ändern Sie den Titel des Elements im `title`-Attribut.
7. Passen Sie den Klassennamen im `class`-Attribut an (z.B. "sideflag-aktuelles").
8. Ändern Sie den angezeigten Text innerhalb von `<span></span>`.
9. Kopieren Sie ganz oben innerhalb von `<style></style>` eine Zeile und passen Sie den Klassennamen an.
10. Tauschen Sie unter "content" das Icon aus, indem Sie den passenden Unicode von https://fontawesome.com/v5/search verwenden (Unicode finden Sie bei Klick auf das Icon rechts oben).

1. Erstellen Sie das gewünschte Inhaltselement, aber aktivieren Sie es noch nicht.
2. Rufen Sie die Unterseite im Frontend auf, auf der das zu prüfende Element angezeigt werden soll.
3. Bewegen Sie die Maus nach rechts unten auf den Bildschirm, wo Sie einen roten Schalter finden. Klicken Sie darauf, um das Admin-Panel zu aktivieren.
4. Im geöffneten Admin-Panel klicken Sie auf „Einstellungen“.
5. Unter „Vorschau“ wählen Sie „Verborgene Datensätze anzeigen“ aus.
6. Klicken Sie auf „Einstellungen aktualisieren“, um Ihre Auswahl zu bestätigen. Die Seite wird daraufhin neu geladen und zeigt nun auch die verborgenen Inhalte als Vorschau an.
7. Wenn Sie die Anzeige der verborgenen Inhalte nicht mehr benötigen, können Sie diese Funktion auf demselben Weg wieder deaktivieren.

Diese Schritte erlauben es Ihnen, Inhalte zu überprüfen, bevor sie für alle Besucher der Seite sichtbar gemacht werden.