Anne-Kathrin. Merz. Contao. Das umfassende Praxisbuch. inklusive CD-ROM

Transkript

1 Anne-Kathrin Merz Contao Das umfassende Praxisbuch inklusive CD-ROM

2 00 Contao.book Seite 3 Donnerstag, 5. August :53 15 Anne-Kathrin Merz Contao Das umfassende Praxisbuch

3 00 Contao.book Seite 4 Donnerstag, 5. August :53 15 Bibliografische Information Der Deutschen Nationalbibliothek Die Deutsche Nationalbibliothek verzeichnet diese Publikation in der Deutschen Nationalbibliografie; detaillierte bibliografische Daten sind im Internet über < abrufbar. Bei der Herstellung des Werkes haben wir uns zukunftsbewusst für umweltverträgliche und wiederverwertbare Materialien entschieden. Der Inhalt ist auf elementar chlorfreiem Papier gedruckt. ISBN Auflage kundenbetreuung@hjr-verlag.de Telefon: / Telefax: / mitp, eine Marke der Verlagsgruppe Hüthig Jehle Rehm GmbH Heidelberg, München, Landsberg, Frechen, Hamburg Dieses Werk, einschließlich aller seiner Teile, ist urheberrechtlich geschützt. Jede Verwertung außerhalb der engen Grenzen des Urheberrechtsgesetzes ist ohne Zustimmung des Verlages unzulässig und strafbar. Dies gilt insbesondere für Vervielfältigungen, Übersetzungen, Mikroverfilmungen und die Einspeicherung und Verarbeitung in elektronischen Systemen. Lektorat: Sabine Schulz Sprachkorrektorat: Petra Heubach-Erdmann Satz: III-satz, Husby, Druck: Beltz Druckpartner GmbH und Co. KG, Hemsbach Coverbild: negrobike Fotolia.com

4 00 Contao.book Seite 5 Donnerstag, 5. August :53 15 Für CoRaLi

5 00 Contao.book Seite 6 Donnerstag, 5. August :53 15

6 00 Contao.book Seite 7 Donnerstag, 5. August :53 15 Eine Einleitung oder: Was erwartet Sie? Danke Teil I Contao verstehen Ein paar grundsätzliche Überlegungen Testsysteme und Produktivumgebung Webdesign: mehr als nur die Optik Planung von Inhalten und Seitenstrukturen Design und Template Usability ist Pflichtprogramm Überlegungen zu SEO und Online-Marketing Aus Konzept und Layout-Entwurf wird eine Website Planung, Umsetzung und Qualitätssicherung im täglichen Betrieb Zusammengefasst: Eine Art von Checkliste Ein fiktives Projekt Die Beteiligten Ganz typische Anforderungen Ganz typische Aufgaben Die Installation und ihre Zutaten Was Sie vorab wissen sollten Systemanforderungen Ein Blick in die mitgelieferte CD Der lokale Webserver mit XAMPP Installation unter Windows XP Installation unter Mac Grundsätzliches Vorbereitungen für die Installation MySQL: Sie brauchen eine Datenbank Contao-Dateien auf dem Server bereitstellen

7 00 Contao.book Seite 8 Donnerstag, 5. August : PHP Ein letzter Check-up Die Installationsroutine Das eigene Passwort für die Installationsroutine Der Datenbank-Connect Frontend-Templates Troubleshooting Erste Orientierung Eine kleine Standortbestimmung Seiten: Eine Frage der Struktur Themes Das Seitenlayout: Mehr als nur Design Artikel: Noch ein Container Inhalte und noch mehr Inhalte Module: kleine Bausteine für Navigation und Funktion Templates Erweiterungen Der Administrationsbereich Backend-Module: Inhalte Backend-Module: Layout Backend-Module: Benutzerverwaltung Backend-Module: System Backend-Module: Benutzerfunktionen Arbeiten mit Contao: Übersichten und Ansichten Die Baumansicht Die Listenansicht Eltern-Kind-Ansicht Typische Handgriffe und Klicks In großen Listen mehr Überblick behalten: Datensätze sortieren und filtern Speichern und zurück: Navigieren in Bäumen und anderen Ansichten Ausschnitte im Baum wählen Wenn es schnell gehen soll:»mehrere bearbeiten« Die Zwischenablage Helferlein und Prinzipien, die Sie kennen sollten Dynamische Formulare

8 00 Contao.book Seite 9 Donnerstag, 5. August : AJAX-gesteuert Elemente auflisten und bearbeiten Verzeichnisse, Dateien- und Bilderauswahl Sicherheitshalber: Versionierung und Papierkorb Der TinyMCE-Editor eine klitzekleine Einführung So ähnlich wie ein Textverarbeitungsprogramm HTML hat mit Textverarbeitung nichts zu tun Verzeichnisse und Dateien Zusammenfassung Inhaltliches: Seitenstruktur und Seiten Die Seitenstruktur das Grundgerüst Eine Seitenstruktur planen Neue Seiten anlegen: Eine Typfrage Startpunkt einer neuen Website Reguläre Seite Externe und Interne Weiterleitung Die Fehlerseiten Seite eine Frage der Einstellung Seiten und Seitenstruktur im Griff Seitenstruktur: Noch einmal der Reihe nach Effizient arbeiten mit der Seitenstruktur Themes: Layout und Funktion Das Theme: eine Begriffsbestimmung Der Theme-Manager Aufgaben des Theme-Managers Ein Theme anlegen Import eines bestehenden Themes Arbeiten mit Themes Erste Schritte: Seitenlayout und CSS-Stylesheets Die Zutaten für ein Seitenlayout Ein Seitenlayout definieren und anpassen Stylesheets verwalten und erstellen Noch einmal zusammengefasst Artikel: Inhalte erstellen und verwalten Artikel Der Artikelbaum Artikel und Artikelteaser: Artikel anreißen

9 00 Contao.book Seite 10 Donnerstag, 5. August : Artikel anlegen und bearbeiten Inhaltselemente Das Prinzip Inhaltselement Inhaltselemente einbinden Inhalte bearbeiten Textelemente Text das Inhaltselement für alle Fälle Überschrift Aufzählung: Das Inhaltselement Liste Tabelle Der Top-Link Artikel: Syndikation Syndikation: Verteilen von Inhalten Inhalte drucken oder exportieren Inhalte via Social Media verteilen Überlegenswertes und Wissenswertes Überlegenswert: Ein Inhaltselement oder mehrere Viele oder wenige Artikel Artikel außerhalb der Hauptspalte anzeigen Artikel Texte weitere Inhaltselemente Weitere Inhaltselemente Noch mehr Textelemente Das Akkordeon als spezielles Textelement Der Hyperlink Die Mediabox im Einsatz Code: für den Profi Alles rund ums Bild Ein einzelnes Bild Bild-Einstellungen mehr Funktion Bild-Einstellungen: zum Nachdenken Eine Bildergalerie Dateimanagement im Inhalt Zwischendurch eine einzelne Datei: Der Dateidownload Dateidownloads: Eine Reihe von Dateien Anmerkungen zum Download Meta.txt eine Beschreibungsdatei für andere Dateien Dateidownload noch ein bisschen komfortabler

10 00 Contao.book Seite 11 Donnerstag, 5. August : Erweiterungen, Module und andere Inhaltselemente: Include-Elemente Erweiterungen und Module Wiederverwendbarkeit und Vermeidung von Redundanzen Platzhalter: Insert-Tags Grundsätzliches Inhalte einbinden mit Insert-Tags vom Typ include Platzhalter, um Links zu erstellen System-Variablen Weitere nützliche Insert-Tags Navigation und andere Module Module: Ein Einstieg Es gibt eine Menge Module Module anlegen Seitenstruktur und Menü: ein Team Das Navigationsmenü Individuelle Navigation: Aus der Seitenstruktur ausbrechen Navigationsmenüs: die Templates Quicknavigation und Quicklink: auf schnellstem Weg Buchnavigation: Blättern Auch durch Artikel kann man navigieren Die Artikelliste Artikelnavigation: 1-2-3, weiter oder zurück Die Artikel-Module gegenübergestellt Navigationselemente für mehr Übersicht Mit Brotkrumen den richtigen Weg finden Die Sitemap: Alles auf einen Blick Noch mehr Module Ein Zufallsbild einbinden Flash-Film Datensätze auflisten mit dem Modul Auflistung Module funktionale und inhaltliche Bausteine Module ins Seitenlayout integrieren Module in Artikel einbinden Wer sich ewig bindet

11 00 Contao.book Seite 12 Donnerstag, 5. August :53 15 Teil II Contao-Websites layouten HTML und CSS eine kleine Einführung Eine ganz kurze Einführung in HTML Wie (X)HTML-Dateien aufgebaut sind HTML-Elemente Einige Beispiele CSS: Cascading Style Sheets CSS-Anweisungen schreiben Auf die richtige Reihenfolge und auf den Kontext kommt es an HTML-Dateien mit CSS-Anweisungen ausstatten Standards, Best Practices und auch»no-gos« Standardkonform? Barrieren Im Detail: Themes, Seitenlayouts und das CSS-Framework Noch einmal: Das Theme Vorbereitung zum Arbeiten mit Themes Mit einem Framework zum Seitenlayout Seitenlayouts und das Contao-CSS-Framework Seitenlayouts das Grundgerüst fe_page Das Framework geht an die Arbeit Seitenlayouts mit eigenen Layoutbereichen CSS-Stylesheets Beteiligte Stylesheets Eigene CSS-Stylesheets Die CSS-Eingabemaske im Detail Richtig positioniert und zugeschnitten Abstand halten und die Frage nach der Ausrichtung Im Hintergrund: Farbe und Bild Rahmen Typografisches Listen Falls die Eingabemaske nicht ausreicht: eigenes CSS Was Sie wissen sollten Versionierung, Import und externe Bearbeitung Behalten Sie die Übersicht

12 00 Contao.book Seite 13 Donnerstag, 5. August : Was Sie sich überlegen sollten Wiederverwendbarkeit sichern Ein Stylesheet für den Druck Die Reihenfolge von Stylesheets Praxisbeispiele: CSS-Angaben für das Seitenlayout Abstände definieren Hintergrundfarben und -bilder Zusammengefasst Das Layouten von Menüs und Inhalten Styling einzelner Elemente: Vorlagen Klassische Menüs stylen Das Template zum Menü Das Modul zum Menü Weitere Navigationselemente Artikel und Inhaltselemente layouten Allgemeines Prinzip Der Artikel und sein Teaser Textelemente layouten CSS-Klassen für Bilder und Bildergalerien Weitere Inhaltselemente Zusammenfassung Templates, Layouts, Themes: fortgeschrittene Techniken Eigene Klassen und IDs Eigene CSS-IDs, -Klassen und Abstände für einzelne Bausteine Im Einsatz: Individuelles Styling für einzelne Elemente Bestehende und eigene Templates Templates: Vorlagen für alle Contao-Bausteine Eigene Templates erstellen und verwalten Eigene Templates: Ein Beispiel Mehrere Themes, verschiedene Templates Fortgeschrittenes Layouting Bestehende Seitenlayouts übernehmen und anpassen Umrüsten auf Contao

13 00 Contao.book Seite 14 Donnerstag, 5. August : Praxisbeispiel: nicht-websichere Schriften einsetzen mit Cufón Total individuell (mit und abseits des CSS-Frameworks) geht das? Themes exportieren Dateien, die zum Layout gehören Export eines Themes Ein (Ein-)Blick in die exportierte cto-datei Webdesign leicht(er) gemacht Teil III Contao administrieren Benutzer und Mitglieder Im Administrationsbereich: Benutzer Benutzergruppen und Benutzer anlegen Redaktionsteams ein kurzer Abstecher Benutzerfunktionen Persönliche Daten: Eigene Einstellungen ändern Rückgängig: Der»Papierkorb« Task Center: Zuständigkeiten verteilen Im Frontend: Mitglieder Mitgliedergruppen und Mitglieder anlegen Module: Mitglieder auf Ihrer Website Die Registrierung Login und Logout Passwort vergessen Persönliche Daten Insert-Tags: Für eine persönliche Ansprache Nicht mehr mitmachen: Konto schließen Die Mitgliederliste: Das ausgelagerte Modul Module fürs Frontend stylen Berechtigungssystematik im Frontend Schutz für Seiten, Module und Inhalte Nur für Nicht-Mitglieder Ein paar Beispiele aus dem Alltag Abschließend

14 00 Contao.book Seite 15 Donnerstag, 5. August : Das System Einstellungen: Die Basics System-Einstellungen über die Administrationsoberfläche vornehmen System-Einstellungen: Die Konfigurationsdatei localconfig.php Ein CMS will gepflegt sein System-Log Systemwartungsaufgaben Exkurs: Die Verzeichnisstruktur Contao umziehen Vorbereitungen Umzug ganz der Reihe nach Zusammenfassung Teil IV Anhänge Contao: Die Erweiterungen Mehr als nur Inhalt On Board Drittanbieter-Erweiterungen Erweiterungen sind auch Inhalte Erweiterungen: Inhalte und Module Erweiterungen praktisch eingesetzt Drittanbieter-Erweiterungen Der Erweiterungskatalog Die Erweiterungsverwaltung Als Nächstes: Contao-internen Zusatzfunktionen Der Formulargenerator Ein Formular Formulare anlegen Vorbereitungen Das Formular konfigurieren Formularfelder Überschrift Erklärung

15 00 Contao.book Seite 16 Donnerstag, 5. August : HTML Fieldset Textfeld Passwortfeld Textarea Select-Menü Radio-Button-Menü Checkbox-Menü Datei-Upload Verstecktes Feld Sicherheitsfrage Absendefeld Ein einfaches Kontaktformular Typische Anforderungen Vorbereitungen Das Kontaktformular anlegen Das Formular im Frontend Formulare einbinden Formulare stylen Usability-Überlegungen efg Extended Form Generator Mehr Komfort für den Besucher Mehr Komfort für den Redakteur und mehr Möglichkeiten für Webentwickler Nachrichten und Events: Kontakt zur Außenwelt Ein Blick in die Welt der Nachrichten im Internet News abonnieren: RSS und Atom Nachricht oder Event? Nachrichtenarchive und Kalender anlegen Konzeptionelles und Vorbereitungen Nachrichtenarchive und Kalender konfigurieren Nachrichtenbeiträge und Events Der Nachrichtenbeitrag Events: Termine und Veranstaltungen Kommentare verwalten Ein neuer Kommentar wurde geschrieben Kommentare freigeben oder auch nicht

16 00 Contao.book Seite 17 Donnerstag, 5. August : Neuigkeiten und Events auf der Website Module zusammenspielen lassen Vorarbeiten an der Seitenstruktur Listen und Leser Die Nachrichten-Module Nachrichtenliste Nachrichtenleser Das Nachrichtenarchiv-Menü Das Nachrichtenarchiv Das Nachrichtenarchiv und sein Menü Die Event-Module Kalender Eventliste Eventliste-Menü Eventleser Darstellung und Styling Das Modul und sein Innenleben Template-Einstellungen für Nachrichten und Events Nachrichten: von kurz bis umfangreich Variantenreiche Darstellung von Events Das Kommentar-Template Bloggen mit Contao Anforderungen an ein Weblog kurze Zusammenfassung Contao Weblog-gerecht gepeppt Externe Feeds auf der eigenen Website Konfiguration des RSS-Reader Moduls RSS Reader: Anzeige im Frontend Newsletter: Verschicken Sie Briefe Vor dem ersten Versand Vorbereitungen: die Weiterleitungsseite Die Newsletter-Kategorie: Verteiler Einen Newsletter erstellen Empfänger Der Versand Die Testsendung

17 00 Contao.book Seite 18 Donnerstag, 5. August : Newsletter versenden Das Newsletterarchiv im Frontend Abonnement und Kündigung Newsletterliste und Newsletterleser Layouten rund um den Newsletter Newsletter als HTML Die Newsletter-Module in Form bringen FAQ: Fragen und Antworten Vorüberlegungen und Vorarbeiten FAQ anlegen und verwalten FAQ-Kategorien anlegen Fragen und Antworten zu einer Kategorie Die FAQ-Module Die FAQ-Liste Der FAQ-Leser Fragen und Antworten verständlich layouten Die FAQ-Liste Der FAQ-Leser Eine Suche einrichten Vorbereitungen System-Einstellungen Der Suchindex Die Suche: das Modul Suchmaschine Das Modul Suchmaschine Das Modul Suchmaschine auf der Website Ein Suchfeld mit Hilfe eines Formulars anlegen Ein Suchformular und die Suchmaschine Erstellung des Formulars Einbindung des Formulars in ein Seitenlayout Styling rund um die Suche Die Suchmaschine Die Treffermenge übersichtlich und benutzerfreundlich gestalten

18 00 Contao.book Seite 19 Donnerstag, 5. August :53 15 Teil V Contao anwenden Mehrfach-Domain-Betrieb und Mehrsprachigkeit Mehrere eigene Websites in einer Contao-Installation verwalten Das Szenario Die Vorüberlegungen Mehrfach-Domain-Betrieb: Wie wird s gemacht? Themes im Mehrfach-Domain-Betrieb Mehrsprachige Websites Variante 1: Mehrere Sprachen, mehrere Domains Variante 2: Mehrere Sprachen, eine Domain Anstehende, sprachliche Anpassungen Weitere Sprachen ergänzen Drittanbieter-Erweiterungen Mehrsprachigkeit eine abschließende Diskussion Usability, Barrieren und das Thema Suchmaschinen Eine Begriffsbestimmung Usability: Der Mensch am und vor dem Computer Barrierefreiheit Suchmaschinenfreundlichkeit und Suchmaschinenoptimierung Contao: eine solide Basis für barrierefreie Websites Verordnungen zur Barrierefreiheit Die BITV im Schnellüberblick Contao, der Standard und die Barrierefreiheit Freundlich sein zu Suchmaschinen Suchmaschinenfreundliche URLs Es zählt nicht nur der Code Wie aus den Zutaten eine gute Mischung wird: Suchmaschinenoptimierung in Contao Seitenstruktur und Seiten Artikel und die Schlüssel zum Inhalt Seitenstruktur und Artikel: Überlegungen zum Zusammenspiel Googles Werkzeuge Die XML-Sitemap

19 00 Contao.book Seite 20 Donnerstag, 5. August : Google Analytics Alternativen zu Google Analytics Wie geht es weiter? Individuelle Konfigurationsmöglichkeiten Contao konfigurieren Die verschiedenen Konfigurationsdateien Updateresistent? DCA: Data Container Arrays und die dcaconfig.php Was ist ein DCA? DCA-Angaben anpassen Beispiel: Eingabefelder konfigurieren Pflichtfelder und optionale Angaben Eingaben überprüfen Beispiel: Eingabemasken konfigurieren Beispiel: Umgestaltungen im Backend Anpassungen von Paletten Anordnung einzelner Felder Sprachdateien und Texte anpassen Beispiel: Individuelle Textbausteine Allgemeine oder sprachabhängige Änderungen Hilfetexte ändern Sprachdateien: Noch einmal Schritt für Schritt Systemkonfiguration: die Dateien config.php und die lokale Konfiguration Was Konfigurationsdateien festlegen Die Datei localconfig.php ergänzen Beispiel: Den Administrationsbereich anpassen Backend-Module und Erweiterungen deaktivieren Inhaltselemente einschränken Ein Ausblick Pflege, Wartung und Qualitätssicherung Contao anwenderfreundlich konfigurieren Das Wissen um den Endanwender Backend-Module nicht für jedermann Den TinyMCE-Editor anpassen Die Konfigurationsdatei für den TinyMCE

20 00 Contao.book Seite 21 Donnerstag, 5. August : Ein eigenes Stylesheet für den TinyMCE-Editor Die tinymce.css und das Seitenlayout Die Menüleiste des Editors abspecken Diskussion: Inhaltselemente und HTML-Vorlagen Inhaltselemente: Nervenschonend für Redakteur und Designer? HTML-Vorlagen erstellen und nutzen Schulungen und Handbücher Schulungen Handbuch ein paar Tipps Wartung und Wartungsverträge Systemwartung Datenbankbackup System-Updates Viel Spaß mit Contao Teil VI Contao anwenden Glossar A Contao Wissenswertes in Kürze A.1 Die wichtigsten Bearbeitungs-Icons und ihre Bedeutung A.2 Die wichtigsten Templates A.2.1 Frontend Templates A.2.2 Module und Sonstiges A.2.3 Formular A.2.4 Mitglieder A.2.5 Nachrichten A.2.6 Events A.2.7 Kommentare A.2.8 Newsletter A.2.9 FAQ A.3 Die Contao-Klassen A.3.1 Merkregeln A.3.2 Übersicht CSS-Klassen

21 00 Contao.book Seite 22 Donnerstag, 5. August :53 15 B Must Haves und Nice To Haves B.1 Contao im Netz B.2 FTP-Tools B.3 HTML und CSS B.4 Webdesign-Helferlein B.4.1 Addons für den Firefox B.4.2 Browser-Testing B.5 Immer zu gebrauchen B.6 Informationsarchitektur, Usability, SEO und Accessiblity B.6.1 Informationsarchitektur, Usability und mehr B.6.2 Suchmaschinenoptimierung und Marketingmaßnahmen B.6.3 Barrierefreiheit Stichwortverzeichnis