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

Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

Embed Size (px)

Citation preview

Page 1: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 1

Einführung in die Homepagebearbeitung, 1.Termin

Von Justin Jetter

07.01.2012

Page 2: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

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

Page 3: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

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“

Page 4: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 4

Übersicht

Page 5: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 5

Das Backend

Page 6: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

Justin Jetter 07.01.2012

Einführung in die Homepagebearbeitung 6

Bastelstunde!!

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

Page 7: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

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…..

Page 8: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

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

Page 9: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

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

Page 10: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

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

Page 11: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

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.

Page 12: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

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 ;)

Page 13: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

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

Page 14: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

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

Page 15: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

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

Page 16: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

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.

Page 17: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

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

Page 18: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

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

Page 19: Einführung in die Homepagebearbeitung, 1.Termin · Justin Jetter 07.01.2012 Einführung in die Homepagebearbeitung 3 Ablauf •Erklären der AddOns –News schreiben –Termine hinzufügen

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)