Websites erstellen mit Contao: [Einstieg, Konfiguration, Administration ; Schritt fu r Schritt zum eigenen Contao-Projekt ; Erweiterungen, Theme Manager, SEO u.v.m. ; DVD-ROM Beispiele, Frontend-Templates, Editoren, Video-Lektionen]

Buchcover......Page 1 Websites erstellen mit Contao......Page 2 Liebe Leserin, lieber Leser......Page 3 Auf einen Blick......Page 4 Impressum......Page 5 Inhalt......Page 6 Geleitwort des Fachgutachters......Page 20 Vorwort......Page 22 TEIL I - Contao kennenlernen......Page 24 1.1.1 Brauchen Sie ein Content-Management-System?......Page 26 1.1.2 Contao unterstützt Sie bei Inhalt, Gestaltung und Funktionen......Page 27 1.2 Die Website zum Programm: www.contao.org......Page 28 1.3 Ein paar Highlights von Contao......Page 29 1.4 Die Community im Web: »www.contao-community.de«......Page 31 2 Schnelldurchlauf: So funktioniert Contao......Page 32 2.1 Das Frontend ist die Website......Page 33 2.2 Das Backend ist die Verwaltungsabteilung......Page 34 2.3 Die Seitenstruktur ist das Fundament der Website......Page 36 2.4 Themes bestimmen das Aussehen der Site......Page 37 2.5 Module erzeugen den Quelltext für das Frontend......Page 38 2.6 Jede Seite hat ein Seitenlayout......Page 39 2.7 Seitenlayouts verbinden die Seiten mit Stylesheets......Page 42 2.8 Jeder Artikel gehört zu einer Seite......Page 43 2.9 Ein Artikel besteht aus Inhaltselementen......Page 44 2.10 Das Backend ist für Redakteure sehr übersichtlich......Page 47 2.11 Zusammenfassung – so tickt Contao......Page 48 TEIL II - Contao installieren......Page 50 3.1.1 Statische Webseiten: Der Webspace als Lagerhalle......Page 52 3.1.2 Content-Management-System: Der Webspace als Werkstatt......Page 53 3.2 Die Installation von XAMPP Lite (Windows)......Page 54 3.2.2 Das XAMPP Control Panel......Page 55 3.2.3 Testen, ob der Webserver funktioniert......Page 57 3.3.1 Den Sicherheitscheck aufrufen......Page 58 3.3.2 Einen Passwortschutz für MySQL und phpMyAdmin einrichten......Page 59 3.3.4 Die neuen Sicherheitseinstellungen testen......Page 61 3.4.1 DocumentRoot: »htdocs«, der Ordner für die Webseiten......Page 63 3.4.2 Der PHP-Übersetzer: Als Modul oder als CGI......Page 64 3.5.1 MySQL verwaltet mehrere Datenbanken......Page 67 3.5.2 SQL ist die Sprache zur Verwaltung von Datenbanken......Page 68 3.6 phpMyAdmin verwaltet die Datenbanken von MySQL......Page 69 3.7 XAMPP-Matrix – die Komponenten im Überblick......Page 70 4.1 Vorbereitung: Die Systemvoraussetzungen......Page 72 4.2 Offline: Contao auf Ihrem Rechner installieren......Page 73 4.3.1 Informationen über Webhoster im Forum......Page 83 4.3.2 Webspace prüfen: Das Contao-Systemdiagnosetool......Page 84 4.3.3 Dateien auf den Webspace kopieren......Page 85 4.3.5 Die Installation im Überblick......Page 87 4.4 Safe Mode Hack: Der FTP-Modus von Contao......Page 88 4.4.1 »Sie benötigen wahrscheinlich den Safe Mode Hack«......Page 89 4.4.3 Online: So richten Sie den Safe Mode Hack ein......Page 90 4.4.4 Offline-Webspace: SMH bei einer lokalen Installation umgehen......Page 92 4.5 Alte PHP-Version: Parse error.........Page 93 4.6 Sonstige potenzielle Probleme bei der Installation......Page 94 4.7 Umzug: Von XAMPP auf den Online-Webspace......Page 95 4.8.1 Besitzer, Benutzer und Berechtigungen: 644 und 755......Page 98 4.8.2 PHP und Contao: Benutzerrechte, Modul und (Fast)CGI......Page 99 4.8.4 Sicherheitsloch: »Alles auf 777« ist keine gute Idee......Page 100 5.1 Überblick: Das Backend......Page 102 5.2 Ganz oben: Der Infobereich......Page 103 5.3 Links: Der Navigationsbereich (Backend-Module)......Page 104 5.4 Rechts: Der Arbeitsbereich......Page 105 5.5 »System Einstellungen«......Page 106 5.5.1 Der »Titel der Webseite«......Page 107 5.5.2 Das Format für Angaben von Datum und Zeit......Page 108 5.6 Der Dateimanager: »System Dateiverwaltung«......Page 109 5.6.1 Ordner erstellen mit dem Dateimanager......Page 110 5.6.2 Dateien mit dem Dateimanager hochladen......Page 111 5.7.2 Erweiterungen aus dem Backend heraus installieren......Page 113 TEIL III - Schritt für Schritt zur ersten Website......Page 116 6.1 »No pages found« – Die Seitenstruktur erstellen......Page 118 6.1.1 Der Startpunkt für eine neue Website......Page 119 6.1.2 Sprachen-Fallback für den Startpunkt aktivieren......Page 120 6.1.3 Die Startseite für die Beispielsite erstellen......Page 122 6.1.4 Die Seitenstruktur für die Beispielsite erweitern......Page 123 6.2.1 Das erste Theme erstellen......Page 125 6.2.2 Das erste Seitenlayout erstellen......Page 127 6.2.3 Ein kurzer Blick in den Quelltext......Page 128 6.3 Das erste Frontend-Modul: »Navigation – Hauptnavi«......Page 129 6.3.1 Ein Navigationsmodul erstellen......Page 130 6.3.2 Das Navigationsmodul im Seitenlayout einbinden......Page 131 6.4.1 Module für den Kopfund den Fußbereich erstellen......Page 133 6.4.2 Die Module für den Kopfund den Fußbereich im Seitenlayout einbinden......Page 134 6.5 Das erste Stylesheet erstellen und zuweisen......Page 135 6.5.2 Stylesheet bearbeiten: Einen Style für »body« erstellen......Page 136 6.5.3 Das Stylesheet mit dem Seitenlayout verbinden......Page 138 6.5.4 Weitere Styles für Kopfbereich, Hauptspalte und Fußbereich......Page 140 6.6.1 Der Artikelbaum: Die Übersicht über alle Artikel......Page 143 6.6.2 Die Einstellungen für einen Artikel......Page 144 6.6.3 Inhaltselemente zu einem Artikel hinzufügen......Page 145 6.6.4 Den Artikel mit dem Seitenlayout verbinden......Page 147 6.7.1 Es gibt verschiedene Arten von Templates......Page 148 6.7.2 Das HTML der Navigation im Quelltext......Page 150 6.7.3 Backend-Modul »Templates«: Templates update-sicher anpassen......Page 151 6.7.4 Ein kurzer Blick in das Template »nav_default.tpl«......Page 153 6.8 Das Contao-Prinzip: Altogether now......Page 154 7.1.1 Gestatten: Das CSS-Framework von Contao......Page 156 7.2 Arbeiten mit internen Stylesheets......Page 157 7.2.1 Der interne CSS-Editor: CSS per HTML-Formular......Page 158 7.2.2 Übung: Header und Footer mit dem internen CSS-Editor gestalten......Page 159 7.2.3 Tipps für die Arbeit mit dem internen CSS-Editor......Page 161 7.2.4 Integration von internen Stylesheets in »Seitenlayouts«......Page 162 7.3.2 Das Reset-Stylesheet »basic.css« importieren......Page 163 7.3.3 Das Reset-Stylesheet »basic.css« im Detail......Page 166 7.4 Das Suchen und Filtern von Styles in internen Stylesheets......Page 168 7.4.1 Styles mit bestimmten Selektoren suchen......Page 169 7.4.2 Filtern nach Kategorie......Page 170 7.5.1 Die Erweiterung »[csseditor]« installieren und kennenlernen......Page 172 7.5.3 Einschränkungen bei der Arbeit mit »[csseditor]«......Page 174 7.6 Übung: Gestaltung der Navigation per CSS......Page 175 7.7 Externe Stylesheets: CSS außerhalb der Datenbank......Page 177 7.7.1 Vorgehensweise: Die Arbeit mit externen Stylesheets......Page 178 7.7.2 Integration von externen Stylesheets in »Seitenlayouts«......Page 182 7.8 Teamwork: Interne und externe Stylesheets zusammen......Page 183 7.9 Fazit: Jeder kann so arbeiten wie er gerne möchte......Page 184 7.10.1 Das HTML-Grundgerüst von Contao in »fe_page.tpl«......Page 185 7.10.2 »$this->framework«: Die Einstellungen aus dem Seitenlayout......Page 187 7.10.4 Das CSS-Framework von Contao aus Benutzersicht......Page 189 7.10.5 Der Kern des CSS-Frameworks: »system/contao.css«......Page 191 7.10.6 Patches für IE6 und 7: »system/iefixes.css«......Page 192 8.1 Übersicht: Seiten, Module und Artikel......Page 194 8.2 Die Navigationsmodule im Überblick......Page 195 8.3 Die Seitenstruktur der Beispielsite erweitern......Page 196 8.4 Vertikale Navigation mit zwei Ebenen......Page 198 8.5 Horizontale Navigation mit zwei Ebenen......Page 204 8.6 Horizontale und vertikale Navigation zusammen......Page 212 8.7 Metanavigation: Eine »Individuelle Navigation«......Page 216 8.8 Sitemap: Das Inhaltsverzeichnis der Website......Page 222 8.9.1 Quicknavigation und Quicklink......Page 227 8.9.2 Navigationspfad: Die Breadcrumb-Navigation »Sie sind hier«......Page 228 8.9.3 Buchnavigation: Von einer Seite zur nächsten und zurück......Page 229 TEIL IV - Inhalte erstellen und verwalten......Page 232 9.1 Artikel und Inhaltselemente im HTML-Quelltext......Page 234 9.2 Das Inhaltselement »Überschrift«: »ce_headline«......Page 235 9.3 Das Inhaltselement »Text«: »ce_text«......Page 238 9.3.2 Der Editor TinyMCE im Überblick......Page 239 9.3.3 Hyperlinks erstellen im Editor TinyMCE......Page 241 9.3.4 Das Inhaltselement »Text« mit einem Bild erweitern......Page 244 9.3.5 Das HTML für das eingefügte Bild und ein CSS-Bilderrahmen......Page 247 9.4.1 Das Inhaltselement »Bild« im Einsatz......Page 248 9.4.2 »Bild-Einstellungen«: Die Möglichkeiten der Bildanpassung......Page 251 9.5.1 Eine Bildergalerie erstellen......Page 253 9.5.2 Die Bildergalerie im HTML......Page 256 9.5.3 Beschriftung von Galerien: »meta.txt«......Page 257 9.6 Das Inhaltselement »Top-Link«: «ce_toplink»......Page 259 9.7.1 Die Links zur Syndikation aktivieren......Page 262 9.7.2 Die Links zur Syndikation per CSS gestalten......Page 263 10.1.1 Der Eingabeassistent für das Inhaltselement »Tabelle«......Page 266 10.1.2 Importieren der Daten mit einer CSV-Datei......Page 268 10.1.3 Das HTML für das Inhaltselement »Tabelle«......Page 270 10.1.4 Das Inhaltselement »Tabelle« per CSS gestalten......Page 271 10.2 Das Inhaltselement »Akkordeon«: »ce_accordion«......Page 273 10.2.1 Seitenlayout vorbereiten und Artikel erstellen......Page 274 10.2.2 Das Eingabeformular für das Inhaltselement »Akkordeon«......Page 275 10.2.3 Zugeschaut und mitgebaut: Drei Akkordeons erstellen......Page 277 10.2.5 Das CSS zur Gestaltung eines Akkordeons......Page 278 10.2.6 Optional: Grafiken zur Statusanzeige......Page 280 10.3.1 Inhaltselement »Text«: Ein Link in einer Mediabox......Page 281 10.3.2 Das Inhaltselement »HTML«: »ce_html«......Page 283 10.4.1 Das Inhaltselement »Code«: »ce_code«......Page 285 10.4.2 Das Inhaltselement »Aufzählung«: »ce_list«......Page 287 10.4.4 Die »Include«-Elemente im Kurzüberblick......Page 288 11.1 Ein Kontaktformular für die Beispielsite erstellen......Page 290 11.2.1 Das HTML für das Kontaktformular......Page 301 11.2.2 Das CSS für das Kontaktformular......Page 303 11.3.1 Formularfelder einfügen: Die Feldtypen im Überblick......Page 305 11.3.2 Überschrift und Erklärung für zusätzliche Informationen......Page 306 11.3.4 Das Passwortfeld: Automatisch mit Bestätigungsfeld......Page 307 11.3.5 Das Select-Menü: Auswahllisten per Klick......Page 308 11.3.6 Das Radio-Button-Menü: Optionsfelder deluxe......Page 310 11.3.7 Das Checkbox-Menü: Kontrollkästchen deluxe......Page 313 11.3.8 »Datei-Upload«: Besucher können Dateien hochladen......Page 314 11.3.9 Die Sicherheitsfrage zur Spamvermeidung......Page 315 11.4 Sinnvolle Erweiterungen zur Arbeit mit Formularen......Page 317 12 Suchfunktion: Die Beispielsite durchsuchen......Page 318 12.1 Teil 1: Eine Suchseite erstellen......Page 319 12.2 Teil 2: Das Suchformular erstellen und einbinden......Page 327 12.3 Die Syntax der Suchfunktion im Überblick......Page 335 13 Die Erweiterung »Nachrichten«......Page 336 13.2 Das Backend-Modul »Nachrichten«: Beiträge erstellen......Page 337 13.2.1 »Newsarchiv«: Ein Nachrichtenarchiv erstellen......Page 338 13.2.2 Nachrichtenbeiträge schreiben......Page 339 13.3.1 Eine neue Seite zur Anzeige eines Beitrags (Einzelansicht)......Page 342 13.3.2 Das Modul »Nachrichten – Teaser anzeigen [Nachrichtenarchiv]«......Page 344 13.3.3 Das Modul »Beitrag anzeigen [Nachrichtenleser]«......Page 345 13.3.4 Einbinden des Moduls »Nachrichten – Teaser anzeigen«......Page 346 13.3.5 Einbinden des Moduls »Nachrichten – Beitrag anzeigen«......Page 347 13.4.1 Das HTML des Moduls »Nachrichten – Teaser anzeigen«......Page 349 13.4.2 Das CSS für das Modul »Nachrichten – Teaser anzeigen«......Page 351 13.4.3 Das HTML des Moduls »Nachrichten – Beitrag anzeigen«......Page 352 13.4.4 Das CSS für das Modul »Nachrichten – Beitrag anzeigen«......Page 353 13.5 Bilder zu Teasern und Beiträgen hinzufügen......Page 354 13.6 Einen Feed zum Abonnieren der Beiträge erstellen......Page 357 13.7.1 Die Kommentarfunktion aktivieren......Page 359 13.7.2 Kommentare schreiben und überprüfen......Page 360 13.7.3 Kommentare und Fehlermeldungen gestalten......Page 361 13.7.4 Kommentare im Backend verwalten......Page 363 13.8 Navigation: Beiträge monatsweise auswählen......Page 364 13.8.2 Das Modul »Nachrichten – Monat auswählen« einbinden......Page 365 13.8.3 Das HTML des Moduls »Nachrichten – Monat auswählen«......Page 366 13.8.4 Das CSS für das Modul »Nachrichten – Monat auswählen«......Page 367 13.9.1 Die Modultypen und die Modultemplates »mod_news*.tpl«......Page 369 13.9.2 Die vier Subtemplates »news_*.tpl«......Page 370 14.1 Die Erweiterung »Kalender«: Termine verwalten......Page 372 14.1.1 Die Erweiterung »Kalender« in der Übersicht......Page 373 14.2.1 Das HTML vom Frontend-Modul »Kalender«......Page 378 14.2.2 Das CSS zum Gestalten eines Kalenders......Page 380 14.2.3 HTML und CSS zur Gestaltung der Einzelansicht......Page 384 14.3.1 Die Kurzanleitung für die FAQ-Erweiterung......Page 385 14.3.2 Die FAQ-Erweiterung gestalten......Page 387 15 Die Erweiterung »Newsletter«......Page 390 15.1.1 Einen Verteiler erstellen......Page 391 15.1.2 Abonennten verwalten: Die Empfänger des Newsletters......Page 392 15.1.3 Einen Newsletter erstellen......Page 393 15.1.4 Einen Newsletter versenden......Page 394 15.2 Newsletter im Frontend anzeigen......Page 396 15.2.2 Das HTML der Frontend-Module zur Newsletterdarstellung......Page 397 15.3 Newsletter im Frontend abonnieren und kündigen......Page 398 15.3.1 Die Kurzanleitung zum Abonnieren und Kündigen......Page 399 15.3.2 Das HTML der Frontend-Module »Abonnieren« und »Kündigen«......Page 400 16 Die Startseite gestalten......Page 402 16.1 Ein neues Layout für die Startseite......Page 403 16.2 Inhalt für die Hauptspalte: Newsbeiträge und Termine......Page 404 16.2.2 Die Frontend-Module auf der Startseite einbinden......Page 405 16.2.3 Newsbeiträge und Termine gestalten......Page 407 16.3 Artikel mit Teaser auf der Startseite......Page 409 16.4.1 Lesetipps mit einem Quicklink-Modul......Page 411 16.4.3 Die Sidebar gestalten......Page 412 16.5.1 Eine neue Seite mit dem Modul »Eventliste« erstellen......Page 414 16.5.3 Den Minikalender gestalten......Page 415 16.6 Newsletter abonnieren in der Sidebar......Page 417 TEIL V - Systemverwaltung......Page 420 17.1.1 Der Theme-Manager verwaltet bekannte Komponenten......Page 422 17.1.2 »Blaues Theme« von der Beispielsite exportieren......Page 423 17.1.3 All-in-one: Das Innenleben einer CTO-Datei......Page 424 17.1.4 Was nicht in einem Theme enthalten ist......Page 425 17.2 Das »Cover Theme«: Die Beispielsite im neuen Look......Page 426 17.3 Über die Anpassung von Themes......Page 429 17.4.1 Im Seitenlayout eingebundene Module sind unproblematisch......Page 431 17.4.2 In Artikeln eingebundene Frontend-Module sind Inhalt......Page 432 17.4.3 Was mit in Artikeln eingebundenen Modulen schiefgehen kann......Page 433 17.4.4 Reparatur: Anpassung von in Artikeln eingebundenen Modulen......Page 434 17.5 Sicherheitshinweise für Contao-Themes......Page 435 17.5.4 Angriff von innen......Page 436 17.6 Fazit: Themes sind klasse......Page 437 18 Die Optimierung für Suchmaschinen......Page 438 18.1.1 Content-Management-Systeme und URLs......Page 439 18.1.2 Die drei URL-Einstellungen von Contao......Page 440 18.1.3 Drei Voraussetzungen zum Umschreiben der URLs......Page 441 18.1.4 Contao im Unterordner: Die »RewriteBase« in der ».htaccess«......Page 442 18.1.6 So wird’s gemacht: URLs umschreiben in der Praxis......Page 443 18.2 Flache oder hierarchische URLs?......Page 445 18.3.1 Seitenname und Seitenalias im Backend von Contao......Page 446 18.3.2 Der Titel der Seite: » ... «......Page 448 18.3.3 Die Beschreibung der Seite: » «......Page 451 18.4.1 Statusmeldungen: Der Webserver schickt eine Nummer mit......Page 452 18.4.2 404-Seite nicht gefunden: Darf’s vielleicht was anderes sein?......Page 454 18.4.3 403 Zugriff verweigert: Diese Seite gibt es, aber nicht für Sie......Page 456 18.5 Eine XML-Sitemap für Google & Co......Page 457 19.1 Mitglieder und Benutzer: Der Unterschied......Page 460 19.2.2 Mitglieder einrichten......Page 462 19.3.1 Seiten zur Anund Abmeldung erstellen......Page 463 19.3.2 Die Module zur Anmeldung im Überblick......Page 464 19.3.3 Ein Modul für das Anmeldeformular: »[Login-Formular]«......Page 465 19.3.5 Modul für den Link zur Anmeldeseite: »[Eigener HTML-Code]«......Page 466 19.4.1 Die Module zum Anund Abmelden in Artikeln einbinden......Page 467 19.4.2 Module für den Fußbereich im Seitenlayout einbinden......Page 468 19.4.3 Anund Abmeldung testen......Page 469 19.4.4 Das Anmeldeformular gestalten......Page 471 19.5 Einen geschützten Downloadbereich einrichten......Page 472 19.6.1 Das Modul »Passwort vergessen«......Page 476 19.6.3 Die automatische Registrierung für Mitglieder......Page 478 20.1 Benutzerverwaltung: Die Übersicht......Page 480 20.2 Die Benutzergruppe »Redakteure – Nachrichten«......Page 481 20.3 Die Benutzerin »Helen Lewis« einrichten......Page 486 20.3.1 Testen der Einstellungen: Ein Klick, und Sie sind Helen Lewis......Page 488 20.4.1 Benutzergruppe »Redakteure – Artikel« einrichten......Page 490 20.4.2 Benutzer zuweisen und testen......Page 491 20.5.1 Zugriffsrechte: Was mit Seite und Artikel gemacht werden darf......Page 492 20.5.2 Zugriffsrechte für die freigegebenen Seiten setzen......Page 493 21.1 Das System-Log protokolliert Aktivitäten von Contao......Page 496 21.2 Webstatistiken mit Google Analytics......Page 497 21.3.1 Der Cache-Modus in »System Einstellungen«......Page 498 21.3.2 Cache-Einstellungen: Die Cachezeit für die Seiten definieren......Page 499 21.3.3 Systemwartung: Daten bereinigen......Page 500 21.3.4 Systemwartung: Suchindex neu aufbauen......Page 501 21.4 Backups erstellen......Page 502 21.5 Der Live Update Service: Das automatische Update......Page 504 21.6 Das manuelle Update per FTP......Page 505 22.1.1 Die Systemkonfiguration: localconfig.php......Page 508 22.1.2 Data Container Arrays: Die »dcaconfig.php«......Page 509 22.1.3 Sprachkonfiguration: Die »langconfig.php«......Page 510 22.2.1 Ein Stylesheet für den TinyMCE: »tl_files/tinymce.css«......Page 511 22.2.2 Textbausteine im TinyMCE: Inhalte aus Vorlage einfügen......Page 512 22.2.3 Die Symbolleisten des TinyMCE anpassen......Page 513 22.3 Anfahrtskizze mit Google Maps......Page 516 22.3.1 Die Konfiguration des Frontend-Moduls......Page 517 22.3.2 Die Ermittlung der Koordinaten......Page 518 22.4.1 Eigene Layoutbereiche erstellen und aktivieren......Page 519 22.4.3 Contao mit anderen CSS-Frameworks nutzen......Page 520 22.5.1 Ein Startpunkt für jede Website......Page 521 22.5.2 Mehrsprachige Website mit automatischer Sprachwahl......Page 522 22.5.4 Zusammenfassung: Mehrere Websites in mehreren Sprachen......Page 523 22.6 Die Insert-Tags im Überblick......Page 524 22.6.1 Insert-Tags für Link-Elemente......Page 525 22.6.2 Benutzereigenschaften: Insert-Tags für Frontend-Benutzer......Page 526 22.6.3 Umgebungsvariablen......Page 527 22.6.5 Verschiedenes: Datum, E-Mail und Sprachen......Page 528 C......Page 530 D......Page 531 G......Page 532 M......Page 533 P......Page 534 S......Page 535 W......Page 536 Z......Page 537