Web- und multimediabasierte Informationssysteme 2005

Größe: px

Ab Seite anzeigen:

Download "Web- und multimediabasierte Informationssysteme 2005"

Hansl Siegel
vor 5 Jahren
Abrufe

1 Jørn Pabst Web- und multimediabasierte Informationssysteme 2005 Typo3 Einstieg mit einem eigenen HTML-Template 1 Installation des Typo3-Paketes ( RC1-2.exe) Ggf. machen Sie ein Update des Typo3-Codes und der Datenbank. 2 Anlegen einer neuen Seite über den Globus (root-element id=0) 3 Für diese Seite ein leeres neues Template anlegen 3.1 Seite Anklicken 3.2 Im MenueFrame die Webfunktion Templates anwählen 3.3 Den Butten anklicken ohne etwas auszuwählen 3.4 Das PopUp positiv bestätigen 4 TypoScript einfügen 4.1 Rechts oben im Pulldown-Menue auf Info/Modify umschalten 4.2 Klick auf Click here to edit whole template record 4.3 Füllen sie die ersten beiden Felder nach ihrem belieben aus. 4.4 Fügen die folgende Zeilen in das Constants -Feld ein (Den Inhalt finden Sie auch als Textfile constants.txt im zip-file): #FrontendEditing config.admpanel = 1 # Datumsformat date_stdwrap.strftime = %e.%m.%y styles.content.strftime= %e.%m.%y # Sprache config.language = de config.locale_all = de # Targets, empty for no-frames websites PAGE_TARGET = content.pageframeobj = # Style styles.content.textstyle { altwrap = <p> </p> # styles.header.gfx1.file.fontfile = fileadmin/hatten.ttf styles.topmenue = background-color : #155555; cset {

2 color1 = #FFAD31 color2 = #4242FF color3 = #C6C6C6 #Content content { wrap.header1 = <h1> </h1> wrap.bodytext = <p class="contenttext"> </p> headerspace = space = wrap.header1 = <h1> </h1> wrap.header2 = <h2> </h2> wrap.header3 = <h3> </h3> wrap.header4 = <h4> </h4> altwrap.bodytext = # MetaTags plugin.meta.language = de plugin.meta.author = Jørn Pabst 4.5 Fügen die folgende Zeilen in das Setup -Feld ein (Den Inhalt finden Sie auch als Textfile setup.txt im zip-file): # Simulation statischer Dokumente # config.simulatestaticdocuments = 1 # URL-Parameter werden MD5 verschlüsselt # config.simulatestaticdocuments_penc = md5 # config.simulatestaticdocuments_notypeifnotitle = 1 # Anker vor jedem Element tt_content.stdwrap.datawrap = <A name="{field:uid"></a> # Spam-Schutz bei -Links config.spamprotect addresses = 2 config.spamprotect addresses_atsubst = (at) # Eigentliches Seiten-Element page = PAGE page.typenum = 0 # Index für die Suche page.config.index_enable = 1 page.config.index_externals = 1

3 # Einbinden der CSS-Datei page.includecss { file = fileadmin/format.css # Hardcoded Seiten-Hintergrundfarbe für alte Browser page.bodytag = <body bgcolor="#ffffff"> tt_content.stdwrap.datawrap = <div id="block"><a name="{field:uid"></a> </div> page.10 = TEMPLATE page.10 { #Einbinden der HTML-Vorlage-Datei template = FILE template.file = fileadmin/tmpl_page.html # Arbeitsbereiche workonsubpart = DOCUMENT_BODY subparts.content_left < styles.content.getleft subparts.content < styles.content.get subparts.content_right < styles.content.getright subparts.content_border < styles.content.getborder subparts.headline = TEXT subparts.headline.field = title subparts.headline.wrap = <h1> </h1> marks.breadcrumbs = HMENU marks.breadcrumbs.special = rootline marks.breadcrumbs.special.range = 1-1 marks.breadcrumbs.1 = TMENU marks.breadcrumbs.1.wrap = <div id= breadcrumbs ><p>sie sind hier: </p></div> marks.breadcrumbs.1.no { linkwrap = > * > * before = # Grafisches Hauptmenue subparts.menu = HMENU subparts.menu.minitems = 3 subparts.menu.maxitems = 6 subparts.menu.excludeuidlist = 2,12 # PageIDs der Teilbäume, die nicht im # Menue erscheinen sollen; # z.b. das MetaMenue subparts.menu.1 = GMENU subparts.menu.1 {

4 NO { wrap = XY = [10.w]+14, 21 backcolor = red blue yellow brown pink 10 = TEXT 10.fontFile = fileadmin/hatten.ttf 10.fontSize= fontStyle = bold 10.text.field = title 10.text.align = center 10.offset = 7,13 10.niceText = 1 10.shadow{ offset = 1,1 color = #BBBBBB RO <.NO RO { backcolor = red blue yellow brown pink 10.shadow.offset = 1,1 10.fontStyle = bold 10.shadow.color = #BBBBBB /* # Grafik Menue subparts.menu_level1 = HMENU subparts.menu_level1.entrylevel = 1 subparts.meta_menu.special.value = 2 subparts.menu_level1.1 = GMENU subparts.menu_level1.1.expall = 0 subparts.menu_level1.1.wrap = <table border="0" cellspacing="0" cellpadding="0" width="100%"> </table> subparts.menu_level1.1 { NO { wrap = <br /> XY = 209, 24 backcolor = green 5 = IMAGE 5.file = fileadmin/box.gif

5 5.offset = 0,7 10 = TEXT 10.fontFile = fileadmin/hatten.ttf 10.fontSize= fontStyle = bold 10.text.field = title 10.offset = 25,15 10.niceText = 1 10.shadow{ */ offset = 1,1 color = #BBBBBB ACT <.NO ACT = 1 ACT { backcolor = grey 10.shadow.offset = 1,1 10.shadow.color = #BBBBBB RO <.NO RO { backcolor = silver 10.shadow.offset = 1,1 10.shadow.color = #BBBBBB /* Alternativ ein Textbasiertes Hauptmenue */ /* # Text Hauptmenue subparts.menu = HMENU subparts.menu.minitems = 3 subparts.menu.maxitems = 6 subparts.menu.excludeuidlist = 2,12 # PageIDs der Teilbäume, die nicht im subparts.menu.1 = TMENU subparts.menu.1.no { # Menue erscheinen sollen; # z.b. das MetaMenue allwrap = * <td width="120" height="20" bgcolor="silver" nowrap> </td> * linkwrap =

6 # Ende des Text-Hauptmenues */ #Text-Untermenue als Tabellen-Konstrukt subparts.menu_level1 = HMENU subparts.menu_level1.entrylevel = 1 subparts.menu_level1.1 = TMENU subparts.menu_level1.1.expall = 0 subparts.menu_level1.1.no { allwrap = <tr height="1"><td height="1" bgcolor="#ffffff"></td></tr> <tr height="21"><td height="21"> </td></tr> subparts.menu_level1.1.act = 1 subparts.menu_level1.1.act { allwrap = <tr height="1"><td height="1" bgcolor="#ffffff"></td></tr> <tr height="21"><td height="21" class="bgfarbe"> <b> </b></td></tr> subparts.menu_level1.1.actifsub = 1 subparts.menu_level1.1.actifsub { allwrap = <tr height="1"><td height="1" bgcolor="#ffffff"></td></tr> <tr height="21"><td height="21" class="bgfarbe"> <b> </b></td></tr> beforeimg = fileadmin/down.gif beforeroimg = fileadmin/down.gif subparts.menu_level1.2 = TMENU subparts.menu_level1.2.expall = 1 subparts.menu_level1.2.no { allwrap = <tr height="21"><td height="21"> </td></tr>

7 subparts.menu_level1.2.act = 1 subparts.menu_level1.2.act { allwrap = <tr height="21"><td height="21" class="bgfarbe"> </td></tr> subparts.meta_menu = HMENU subparts.meta_menu.special = directory subparts.meta_menu.special.value = 2 # PageID des MetaMenus subparts.meta_menu.1 = TMENU subparts.meta_menu.1.no { linkwrap = * * after = // end: page 4.6 Entfernen Sie ggf. überflüssige Zeilenumbrüche. Eine Befehlszeile darf keinen Umbruch enthalten. 4.7 Passen sie die PageIDs der auszuschließenden Teilbäume an 4.8 Passen Sie die PageID des MetaMenues an ihren Seitenbaum an. 4.9 Belassen sie die 3 Häckchen für clear und rootlevel 5 Wählen sie im Bereich Include static content (default) und cset (default) aus. 6 Kopieren sie die benötigte Files (wie die HTML-Vorlage-Datei, TrueType-Schriftarten, Grafiken, etc) ins fileadmin-verzeichniss ihrer Installation (entweder per Filesystem oder per Datei-Upload). 7 Legen sie einige weiter Seiten und Unterseiten an. (Z.B. mit dem Befehl Functions aus dem Menue) 8 Rufen sie ihre Site mit der id auf ( Die notwendigen Files finden sie unter:

Ähnliche Dokumente

Erstellen eines HTML-Templates mit externer CSS-Datei

Erstellen eines HTML-Templates mit externer CSS-Datei Eigenschaften der Lösung Menü mit 2 Ebenen ohne Bilder, Menü besteht aus Text (Links) Durch CSS kann das Menü aber auch die Seite angepasst werden