Anleitung zur Pflege einzelner Seiten im CMS mit Typo3
Anleitung zur Pflege einzelner Seiten im CMS mit Typo3
Anleitung zur Pflege einzelner Seiten im CMS mit Typo3
Sie wollen auch ein ePaper? Erhöhen Sie die Reichweite Ihrer Titel.
YUMPU macht aus Druck-PDFs automatisch weboptimierte ePaper, die Google liebt.
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong><strong>Anleitung</strong><strong>zur</strong> <strong>Pflege</strong><strong>einzelner</strong> <strong>Seiten</strong><strong>im</strong> <strong>CMS</strong> <strong>mit</strong> <strong>Typo3</strong>tottawa Seite 1
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>InhaltsübersichtLogin in das <strong>CMS</strong>-System S. 2Bearbeitungsoptionen <strong>im</strong> Menü „Seite“ S. 5Texteditor S. 65Link einfügen/bearbeiten S. 7Bilder einfügen (Suchen/Upload) S. 8<strong>Seiten</strong> bearbeiten S. 9<strong>Seiten</strong> verschieben S. 9<strong>Seiten</strong> umbenennen S. 9Inhaltselement auswählen S. 10Inhaltselement positionieren S. 11Arbeiten <strong>mit</strong> dem Formularassistenten S. 12Einbinden einer (versteckten) Antwortseite (z.B. als Dankseite) S. 13Ändern der Benutzerdaten S. 16EMailPasswort u.a.Verlinkung von <strong>Seiten</strong> S. 18Aufbau <strong>einzelner</strong> <strong>Seiten</strong> S. 21Unterschiedliche Abstände zwischen Text und Bildern einrichtenSpezielle Bearbeitungen und Formatierungen S. 22Anlagen IAnlage 1 S. 26Arbeiten <strong>mit</strong> Tabellen S. 27Anlagen IIAnlage 2 S. 30Anlage 3 S. 31Druck <strong>einzelner</strong> Webseiten S. 35ProblembehandlungS. 37 ff.tottawa Seite 2
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>Über http://www.kirchenkreis-osnabrueck.de/typo3/ als Benutzer in das System einloggenUsername: kk_gemeindePassword: gemeinde(Note: Cookies must be enabled!)Wie und wo kann ich diese Option einschalten?Näheres folgt an späterer Stelle.Bei der Anmeldung unbedingt beachten:Genaue Syntax von Username und Password – Gross-/ KleinschreibungWeitere Probleme, die entstehen können:Wie komme ich be<strong>im</strong> Starten des Internet Explorers weiter zum Login-Bildschirm?Die Webadressehttp://www.kirchenkreisosnabrueck.demuss noch ergänztwerden um typo3, um zum Login-Bildschirm zu gelangen (genaueSchreibweise!)Siehe auch obentottawa Seite 3
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>Wenn die Interneteinstellungen für Cookies nicht entsprechend eingestellt sind, kann dies zuLogin-Schwierigkeiten führen. In diesem Fall muss ich <strong>im</strong> Internetexplorer unterExtras/Internetoptionen/Datenschutz die Sicherheitseinstellungen ändern und Cookies für dieseWebseite zulassenhttp://www.kirchenkreis-osnabrueck.de/typo3An dieser Stelle kann der Name der Webseite angegeben werden, für die Cookies zugelassenwerden sollenhttp://www.kirchenkreis-osnabrueck.de/typo3tottawa Seite 4
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>Nach erfolgreichem Login sind wir nun auf der Startseite des <strong>CMS</strong>, von wo man über dieNavigationsliste die verschiedenen Menüpunkte ansteuern kann. Um <strong>Seiten</strong> zu bearbeiten undda<strong>mit</strong> für den Anwender interessant ist eigentlich nur der Menüpunkt Seite!Um in das Fenster <strong>mit</strong> denunterschiedlichenBearbeitungsoptionen zugelangen klicke ich in derMenüauswahl <strong>mit</strong> der linkenMaustaste auf den Text„Seite“ und sehe so, je nachBenutzereinstellungen den<strong>Seiten</strong>baum, der <strong>im</strong> Aufbaudem Explorer gleichtIn der Task Übersichtwerden u.a. die letztenbearbeiteten <strong>Seiten</strong> anzeigt.Beispiel für den User „suchtberatung“Aktuellen Bearbeitungsstand anzeigenWenn „parallel“ gearbeitet wird1231. Modul-Leiste2. NavigationsleistedesjeweiligenModuls3. Detail-Ansicht =Arbeits-Bereich desNutzerstottawa Seite 5
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>Im <strong>Seiten</strong>baum dann <strong>mit</strong> der linken Maustaste auf das <strong>Seiten</strong>symbolvor der entsprechenden Seite klicken und über Bearbeiten in zumBearbeitungsmodus der entsprechenden Seite gelangen.Fehler! rechteMaustaste –Kontextmenü desInternet Explorers!Hier bestehen nun die unterschiedlichen Bearbeitungsmöglichkeiten1 23 45tottawa Seite 6
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>1. <strong>Seiten</strong>titel bearbeitenHier besteht die Möglichkeit, den inhaltlichen <strong>Seiten</strong>aufbau zu verändern –<strong>Seiten</strong>elemente einfügen, löschen, neu anordnenOder auch nur einfach die Seite umzubenennen2. Seite verschiebenAktuelle Seite innerhalb des <strong>Seiten</strong>baumes (neu) einodnen3. Neue Seite (innerhalb des <strong>Seiten</strong>baumes anlegen)4. Neuer Inhalt (innerhalb der aktuellen Seite anlegen)5. Texteditor öffnen<strong>Seiten</strong>inhalt (Text) innerhalb der aktuellen Seite je nach Art des InhaltselementesbearbeitenDie vermutlich am häufigsten zu verwendende Aufgabe wird darin bestehen, Anderungen aminhaltlichen Aufbau der Seite vorzunehmen, d.h. den Texteditor zu öffnen und inhaltlicheÄnderungen vorzunehmenDie Symbole <strong>im</strong> Texteditor von links nach rechts:Text aus des Zwischenablage einfügen Absatzart Zeichenartfett kursiv unterstrichenlinksbündig zentriert rechtsbündigNummerierung AufzählungszeichenAnpassung des EinzugsLink einfügen siehe nächste SeiteBild einfügentottawa Seite 7
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>Hier kann man Links zu Email-Formularen und anderen Web-<strong>Seiten</strong>, aber auchVerknüpfungen <strong>mit</strong> Dateien oder <strong>Seiten</strong> innerhalb des Systems herstellenDie am häufigsten verwendetenFunktionen werden die Verknüpfung<strong>mit</strong> einer Emailadresse (Email) oderzu einer anderen externen Webseite(Externe URL) seinHier die Adresse der Webseite, dieaufgerufen werden soll, eintragen undanschließend auf den Button „Linksetzen“ klickenz.B. www.google.de eintragen und auf Link setzen klickenFERTIGHier die Email-Adresse des Empfängers einsetzen und „Link setzen“ anklicken1. Textfarbe einrichten2. Link setzenz.B. info@evlka.de eintragen und auf Link setzen klickenDie Farbe des Links kann über die Textfarbeeingerichtet werden. Wählen Sie aus derFarbskala den Farbton #990099 und setzensie anschließend den Link. Im Browsererscheint der Link in der eingestellten Farbe.Wichtig ist aber, die Reihenfolge einzuhalten:FERTIGtottawa Seite 8
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>Hierüber werden Bilder für ein <strong>Seiten</strong>element ausgewählt.Aus den <strong>zur</strong> Verfügung stehenden Ordnernoderals Upload aus der„Arbeitsumgebung des Rechners“BilderauswahlPositionierung des Bildesinnerhalb des <strong>Seiten</strong>elementesDurch Dateienbrowsen, bzw.Bilder auf demArbeitsplatzrechnersuchen undauswählentottawa Seite 9
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong><strong>Seiten</strong>titel ändernElementinnerhalb des<strong>Seiten</strong>baumesverschiebennach oben, d.h.eine Ebenehöher <strong>im</strong><strong>Seiten</strong>baumtottawa Seite 10
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>TYP DES INHALTSELEMENTS AUSWÄHLEN:Wählen Sie bitte den <strong>Seiten</strong>typ aus, den Sie erstellen wollen:Typischer <strong>Seiten</strong>inhaltNormaler TextFügt ein normales Textelement ein.Text <strong>mit</strong> darunter liegendem BildFügt ein normales Textelement ein, unter dem eine Reihe von Bilder angezeigtwerden kann.Text <strong>mit</strong> rechts liegendem BildFügt einen normales Textelement ein, an dessen rechter Seite eine Reihe vonBildern angezeigt werden kann.Nur BilderEine beliebige Anzahl von in Zeilen und Spalten angeordneten Bildern <strong>mit</strong>Beschriftung.AufzählungEine einzelne Aufzählungsliste.TabelleEine einfache Tabelle <strong>mit</strong> bis zu 8 Spalten.Mit der linken Maustaste den<strong>Seiten</strong>inhalt auswählenSpezielle ElementeDateiverweiseFügt eine Liste von Dateien zum Herunterladen ein.Mult<strong>im</strong>ediaFügt ein Medienelement (Video, Musikstück, usw.) ein.SitemapErstellt eine Sitemap für die Webseite.HTMLMit diesem Element kann reiner HTML Code auf der Seite eingefügt werden.FormulareMailformularEin Mailformular, <strong>mit</strong> dem die Besucher Ihnen Bemerkungen zuschicken können.SuchformularFügt ein Suchformular auf der Seite ein.AnmeldeformularAn-/Abmeldungsformular für Besucher. Dies wird für Passwort-geschützteWebseiten benutzt. Sie müssen Webseiten-Benutzer und Benutzergruppenanlegen, um den <strong>Seiten</strong>schutz zu benutzen.ErweiterungenAllgemeines PluginWenn Sie ein Plugin einfügen wollen, welches nicht in den unten stehendenOptionen aufgelistet ist, dann wählen Sie diesen Element-Typ und selektieren dasgewünschte Plugin später in der Auswahlbox.Inline frameEin IFRAME <strong>zur</strong> Seite hinzufügen.FotogalerieInsert photo gallery on your page.NewsDieses Plugin zeigt News-Meldungen an.tottawa Seite 11
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>2: POSITION AUSWÄHLEN:Wählen Sie nun die Position aus, an der das Element auf der Seite positioniert werden soll:TestseiteNORMALCheckliste <strong>zur</strong> Bearbeitung der neuen Homepage Was ist zu tun? Was gibt es zubeachten?Auf der Testseite soll die Vorgehensweise bei der Homepageerstellung <strong>mit</strong> dem contentsmanagement sy...Positionen des Inhaltselementes<strong>im</strong> <strong>Seiten</strong>baum<strong>Seiten</strong>elementbearbeiten<strong>Seiten</strong>elementan eine andereStellepositionieren<strong>Seiten</strong>elemententfernentottawa Seite 12
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>FormatierungenTexteingabeNachdem das neue Inhaltselement „oberhalb“ des Grafikelementes <strong>mit</strong> dem entsprechendenElement angelegt worden ist, hat die Seite das gewünschte Layout, welches natürlich auchnoch variiert werden kann.tottawa Seite 23
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>Spezielle Bearbeitungen und FormatierungenWord-Formatierungen entfernen, bzw. Zeilenabstände anpassenMöglichkeit <strong>im</strong> Internet Explorer:Im Texteditor auf das Symbol A klicken und „Komplette HTML-Formatierung entfernenwählen. Anschließend in der Textformatierung auf „normal“ klicken und die unter Umständeneingegebenen Zeilenabstände sind auf einfach eingestellt.Wesentlich mehr Komfort bietet der Editor <strong>im</strong> Firefox-Modus, wobei jedoch dieBearbeitungsmöglichkeiten gerade <strong>im</strong> Einfügemodus eingeschränkt sind. Aber fürFormatierungszwecke ist er in jedem Fall komfortabler.tottawa Seite 24
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>Richtwerte für Textformatierung für alle <strong>Seiten</strong> des Kirchenkreises:SchriftartARIALSchriftgröße 8 pt.AbsatzartNORMALÜber dieses Symbol können alle Word-Formatierungen entfernt werden, auch u.U.vorformatierte ZeilenabständeAnmerkung: Die in den Bildschirmausdrucken teilweise verwendete Adresse cms2.diewerberei.de lautet nach Freischaltung der Homepagewww.kirchenkreis-osnabrueck.deDas Handbuch wird weiter bearbeitet und aktualisiert tottawa Seite 25
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>Anlage 11. Auf der linken Seite den „Menüpunkt „Seite“ wählen2. Vor derm <strong>Seiten</strong>titel <strong>mit</strong> der linken Maustaste auf das <strong>Seiten</strong>symbol klicken3. Anschließend über „Ansehen“ die entsprechende Seite in der Vorschau ansehentottawa Seite 26
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>Arbeiten <strong>mit</strong> Tabellen <strong>im</strong> <strong>CMS</strong>Tabelle einfügen< Einfügebildschirm unter Anlage 2>Im <strong>CMS</strong> gibt es sehr viele Möglichkeiten,Tabellen zu bearbeiten, es entsprichtansatzweise den Möglichkeiten die auchMicrosoft Word bietet. Das Bild links zeigtdie unterschiedlichen Editiermöglichkeiten– die Symbole finden sich auch in derSymbolleiste, allerdings nur <strong>im</strong> Editorunter Firefox – nicht unter dem Internet-ExplorerUm die (auf der Webseite) nicht sichtbarenTabellenränder zu sehen, aktivieren Sie"Ränder umschalten"TextausrichtungTabellenformatierungentottawa Seite 27
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>1. ZelleigenschaftenBreite und Höhekönnen hier festgelegtwerdenSpezielleFormatierungen wieRahmen und Farbenkönnen festgelegtwerden2. Diese Option gibt es in mehreren Varianten, d.h. zeilenweise kann Höhe und Breitevorgegeben werdenEbenso Rahmen undFarbformatierungentottawa Seite 28
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>3. Eigenschaften von Tabellen bearbeitenBeschreibung der TabellenartZusammenfassung von Zweckund Struktur der TabelleLegende s.u.LegendeTabellenflußLegendeAusrichtungLegende Abstandu. EinzugFestlegung der Vorder- undHintergrundfarbeBild Verweismöglichkeittottawa Seite 29
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>Anlage 2Wie bereits auf Seite 27. beschrieben kann hiereine Tabelle eingefügt worden1. Auswahl Zeilen- und Spaltenanzahl2. Layouteinstellungentottawa Seite 30
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>Anlage 3Anmerkung:Die folgenden Möglichkeiten dienen eher den erweiterten Bearbeitungsmöglichkeiten undsind in erster Linie für fortgeschrittene Anwender relevant.Legende CSSSpezielle Formate für Tabellen können über dieCSS Style Auswahl festgelegt werdenXHTML und unser Stylesheet (CSS): Formatierungs-Beispieletottawa Seite 31
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>Für linksbündiges Bild wählen Sie (Überraschung!) class=left – diesen Quellcode müssenSie übrigens nicht per Hand schreiben, sondern können ihn bequem aus dem MenüBildeigenschaften wählen, in das Sie per Rechtsklick gelangen.Umfließen von Bildern beenden: beendet das Umfließen eines Bildes <strong>mit</strong> Text; der folgendeTextabsatz geht wieder über die gesamte Zeilenbreite.Für Bildunterschriften habe ich am 14. September 2004 eine neue Klasse (bu) ins Styesheetgeschrieben; diese sorgt dafür, dass die Unterzeile klein und rechtsbündig wird:solche Zeile einfach <strong>mit</strong> class=bu markierenLogik und OptikHervorhebung <strong>mit</strong> b (boldface) = phys. Auszeichnung (vgl. Auswahl "erlaubter"Auszeichnungen: selfhtml.teamone.de/html/text/physisch.htm#elemente)...vs. Hervorhebung <strong>mit</strong> = logische Auszeichnungrein optische Hervorhebung <strong>mit</strong> class=rotlogisch + optisch kombiniert in Hervorhebung <strong>mit</strong> (Rundschreiben dazu)warum solche logischen Auszeichnungen wünschenswert sind(http://selfhtml.teamone.de/html/text/logisch.htm#elemente):Demo: Hervorhebung <strong>mit</strong> em (emphasis)Demo: Hervorhebung <strong>mit</strong> class=infobox<strong>zur</strong> logisch-korrekten Verwendung von , und :(Beginn blockquote)Ich bin Blindtext. Von Geburt an. Es hat lange gedauert, bis ich begriffen habe, was esbedeutet, ein blinder Text zu sein: Man hat keinen Sinn. Man wirkt hie und da aus demZusammenhang gerissen. Oft wird man gar nicht erst gelesen. Aber bin ich deshalb einschlechter Text? Ich weiß, dass ich nie die Chance haben werde, <strong>im</strong> Stern zu erscheinen.Aber bin ich darum weniger wichtig? Ich bin blind! Aber ich bin gerne Text. Und sollten Siemich jetzt tatsächlich zu Ende lesen, dann habe ich etwas geschafft, was den meisten"normalen" Texten nicht gelingt. (Ende blockquote)tottawa Seite 32
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>Hier einige Aufzählung:ungeordnete Listen (ul) werden automatisch <strong>mit</strong> der kleinen Grafik versehen (Dreiecks-Pfeilnach rechts):Beginn Aufzählg. liAufz-Eintrag (list item) Nr. 2Ende der Aufz.Hier eine geordnete Aufzählung:1. normal Standard defaultB. li type=Aiii. li type=iSie können die Nummerierung <strong>mit</strong> einem beliebigen Wert, zB auch <strong>mit</strong> Null, beginnenlassenAuch geschachtelte Aufzählungen sind möglich, in der Wysiwyg-Ansicht über denMenüpunkt "Absatz: Einzug vergrößern", den Sie per Rechtsklick erreichen.Und hier eine Definitions-Liste (dl):test dttest dddt = zu definierender Terminus (Definiendum)Definition dd (Definiens)Bei Tabellen kann man noch <strong>mit</strong> cellspacing und -padding exper<strong>im</strong>entierentable heading(th)wird automat.m. gr. Hintergrd. dargestelltnormale Zelle (= table data, td) <strong>mit</strong> 1px border, ohne cellpadding/cellspacingEnde 1. Tabelle, Beginn 2. Tabelle:tableheadingnormaleZelle(th)(td)wird automat. m. gr. Hintergrddargestellt<strong>mit</strong> 1px border und 4px cellpadding (=Abstand innerh. derZellen)Ende 2. Tabelle, Beginn 3. Tabelle:tableheading(th)wird automat. m. gr. Hintergrd. dargestellttottawa Seite 33
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>normaleZelle(td)<strong>mit</strong> 1px border und 4px cellspacing (=Abstand zwischen denZellen)Die aus Menüs bekannte "Geisterschrift" zeigt an, wenn Menüpunkte zwar prinzipiellvorhanden, aber aktuell nicht auswählbar sind. Diese Eigenschaft machen wir uns zunutzefür den Bereich der nicht-editierbaren Keywords <strong>im</strong> Redaktionsformular:TU, Technische Universität, BS, Braunschw eig,style sheet font angaben stil+Legende AusrichtungBei der Ausrichtung kann sowohl die Ausrichtung des Textes, rechts- oder linksbündig,Blocksatz oder zentriert, festgelegt werden oder die Positionierung des Textelementesinnerhalb der Zelle (oben, <strong>mit</strong>te, unten, an der Grundlinie)Legende Abstand und EinzugZeichenabstand und Absatzkontrolle (Einrücken des Textes)Legende „Tabellenfluss“tottawa Seite 34
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>Vorgehensweise <strong>zur</strong> opt<strong>im</strong>alen <strong>Seiten</strong>einrichtung be<strong>im</strong> Druck <strong>einzelner</strong> Webseiten1. Im Browsermenü über Datei / Druckvorschau die aktuelle <strong>Seiten</strong>ansicht der Webseiteansehen2. Im Folgemenü den Button Seite einrichten die Ränder der aktuellen Seite anzeigen unddie Optionen so einstellen, dass die Seite als komplette Seite angezeigt wird. Am bestentottawa Seite 35
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>die Seite <strong>im</strong> Querformat anzeigen, um Datenverlust ( „abgeschnittene Zeilen“) <strong>im</strong>Ausdruck zu vermeiden.Diese Einstellung sollten zum Erreichen opt<strong>im</strong>aler Druckqualität der gewünschtenWebseite vor jedem Ausdruck überprüft werden.3. Weitere Optionen, die aufdem Ausdruck erscheinensollen4. Anschließend kann dieSeite, nachdem die<strong>Seiten</strong>einstellung <strong>mit</strong> OKübernommen wurdenausgedruckt werden, und esdürften keine Datenverluste zu verzeichnen sein.tottawa Seite 36
<strong>CMS</strong>- Benutzerhandbuch für <strong>Typo3</strong>Problembehandlung <strong>im</strong> <strong>CMS</strong>Problematik:Die Formatierungsmöglichkeit fürdie Überschriften fehlt.Lösung:Haken vor „Zweite Optionspaletteanzeigen“ setzenAlle Formatierungsoptionensind wieder verfügbartottawa Seite 37
Change language