Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die...

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 1

Einführung in die Homepagebearbeitung, 1.Termin

Von Justin Jetter

07.01.2012

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 2

Ablauf

• Eine kurze Übersicht

• Oberfläche des Backend

• Einrichten der Verbindung

• Editieren

– Erstellen neuer Unterseiten

– Erstellen/Bearbeiten von Textblöcken

– Erklären des Modulsystems

– Bilder hochladen/einbinden

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 3

Ablauf

• Erklären der AddOns

– News schreiben

– Termine hinzufügen

– Bilder skalieren

• „Betreutes Rumspielen“

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 4

Übersicht

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 5

Das Backend

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 6

Bastelstunde!!

Wir bauen uns ein L(okal)A(rea)(Network)…

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 7

Homepage, ohne Internet?!

• Wenn die Verbindung steht:

– Browser öffnen (Firefox, Opera oder Internet Explorer, Google

Chrome, Safari, …)

– http://192.168.1.10 aufrufen

– Warten bis alle soweit sind…..

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 8

Erste Schritte

• http://192.168.1.10/redaxo aufrufen

• Neue Unterseite erstellen

• Textblock hinzufügen und Speichern

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 9

Modulsystem

• Module haben Front- und Backend

• Können von Administratoren erstellt/geändert werden

• Stehen nicht allen zur Verfügung

– Rechtevergabe

• Erleichtern das Erstellen wiederkehrender Inhalte

– Können php-Skripte enthalten

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 10

Und wie geht das mit Bild?

• Bilder müssen erst hochgeladen werden

– Auf Ordnerstruktur achten

• Kleine Bilder -> kurze Ladezeiten

– Für Autor und Leser

• Hochgeladene Bilder in einen Text einbinden

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 11

AddOns??

• Sind kleine Skripte die für Leben sorgen.

• Sorgen für dynamischen Inhalt

• Gibt es weit mehr als bisher zu sehen sind

• Können und sollten nur von mir (Justin) verändert werden

• Sollte man beherrschen

– Zumindest die, auf die man Zugriff hat.

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 12

Ich hab was zu melden!!

• Um eine Newsmeldung zu erstellen, das AddOn „Neuigkeiten“ verwenden

• Das „+“ oben links erstellt einen neuen Eintrag – Zugehörige Kategorie auswählen

• mit „STRG“ auch mehrere möglich

– Überschrift eingeben

– Neuigkeit eintippen

– Den Rest ignorieren und speichern • Aber Sichtbarkeit einstellen ;)

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 13

Wo taucht das jetzt auf?

• News werden automatisch überall dort angezeigt, wo die entsprechende Kategorie ausgewählt ist

– Rechts im Ticker

– Dort wo das Newsmodul entsprechend eingestellt ist

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 14

Mensch, da is‘ was los!!

• Um Veranstaltungen in den Kalender einzutragen nutzt man den „SVKalender“

– Die Einträge sind chronologisch sortiert

• Ein neuer Eintrag wird, wie zuvor, mit dem „+“ erstellt

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 15

Mensch, da is’ was los!!

• 1. Zeit angeben

• 2. Datum einstellen

– Auf das Kalenderblatt klicken

• Ja.. Das ist noch nicht schön…

• 3. Die übrigen Felder ausfüllen und speichern

• 4. Gibt’s nicht, das war’s schon

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 16

Das lädt so lange…

• Viele, vor allem aber große Bilder verlängern die Ladezeiten deutlich

• Die Lösung:

– Bilder skalieren per AddOn

• Das AddOn „Image Resize“ tut dies, ist aber im Normalfall nicht sichtbar.

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 17

Warum „Image Resize“?

• Arbeitet auf dem Server, vor der Datenübertragung

• Legt einen Cache an

• Weils keine Kopfschmerzen macht.

– Wenn man es verstanden hat

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 18

Ja, wie denn nu?

• Ein Auszug aus der Anleitung: Benutzung: Um eine Vorschaugrafik zu generieren wird es durch Aufrufen mit einer speziellen Url umgewandelt, z.B: index.php?rex_resize=100w__imagefile Modi: w = width (Skalieren in der Breite) h = height (Skalieren in der Höhe) c = crop (Bildausschnitt herausschneiden) a = automatic (Skalieren anhand der längsten Seite des Bildes) Anwendungsbeispiele: Skaliere das Bild auf eine Höhe von 150px. Die Proportionen des Bildes werden beibehalten. index.php?rex_resize=150h__imagefile Skaliere das Bild anhand der längsten Seite, diese auf eine Länge von 200px. Die Proportionen des Bildes werden beibehalten. index.php?rex_resize=200a__imagefile

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 19

So, das war Das.

Jetzt geht’s ans selbst Probieren,

Viel Erfolg!

(Es gibt keine doofen Fragen)