-
Template Vorlage in Typo3 einbinden
12.10.2009 in Webentwicklung und Webadministration von imaginata
- Kategorie: Webentwicklung und Webadministration
- Erstellt mit Programmversion: Typo3
- Dateigröße (PDF): 1.3 MB
- Bisherige Zugriffe: 2838
Lieber Gast …
… die Inhalte von PSD-Tutorials.de stehen nur registrierten Mitgliedern zur Verfügung. Damit wollen wir den Communitygedanken weiterführen. Als Mitglied trägst du - wenn auch nur im Kleinen - zum Puls der Community bei. Und nur so ist es möglich, weiterhin hochwertige Inhalte für alle bereitzustellen.
Vorteile der kostenlosen Mitgliedschaft
Mit der kostenlosen und schnell erledigten Registrierung erhältst du viele nachhaltige Vorteile, die wir dir hier in aller Kürze aufzeigen möchten:
- PSD steht für professionelles Know-how in den Bereichen Bildbearbeitung mit Photoshop, Fotografie, Webentwicklung, Layout- und Vektorbearbeitung, 3D-Bearbeitung mit Cinema 4D und Co.
- Über 2200 Tutorials mit druckbarer PDF-Datei und teilweise den zugehörigen Arbeitsmaterialien
- Mehr als 500 Video-Trainings als Stream zur Direktanzeige und zum Download
- Abruf von über 1000 Downloads zu Photoshop-Presets, 3D-Modellen, Grußkarten, Texturen & Co
- Zugriff auf ein sehr aktives Forum mit Antworten im Minutentakt
- Deine Daten sind sicher. Sie werden nicht weitergegeben! Die Mitgliedschaft kann jederzeit und ohne Aufwand wieder gelöscht werden.
Reinschnuppern als Gast
Niemand kauft gerne die Katze im Sack, auch wenn sie kostenlos ist. Wir haben eine Handvoll Tutorials und Video-Trainings ausgesucht, die du auch als Gast ohne Registrierung ansehen kannst. Gefallen sie dir, stehen dir nach der Registrierung alle oben genannten Inhalte zur Verfügung.
- Download: Sepia-Vintage-Effekt-Aktion
- Download: Spiegelungen 2
- Download: Vektor-Logo (Eidechse)
- Tutorial: Linien zum Glühen bringen
- Tutorial: Ballons aus einer Schublade
- Tutorial: Neue Pinsel erstellen leicht gemacht
- Tutorial: Kommerzielle Fotografie 01: Berufswunsch Fotografie
- Videotraining: Die Programmoberfläche und der Arbeitsbereich von Adobe InDesign
- Videotraining: Lichtscheinkontureneffekt mit Animation
- Videotraining: CorelDRAW X6 Grundlagen - Hilfsmittel Freihand, 2-Punkt-Linie, Bezier, B-Spline, Polylinie, Stift, 3-Punkt-Kurve
- Videotraining: CorelDRAW X6 Grundlagen: Hilfsmittel Form - Heranziehen, Zurückweisen
Das Punktesystem
Einen winzigen Haken gibt es noch. Es gibt bei uns ein Punktesystem. Damit soll erreicht werden, dass Mitglieder sich aktiv in unserer Community beteiligen. Sobald du im Forum schreibst oder Tutorials kommentierst, bekommst du Punkte. Mit diesen Punkten kannst du wiederum Tutorials anschauen oder Downloads herunterladen. Mit der Registrierung bei PSD-Tutorials.de erhältst du ein Startguthaben von 100 Punkten, womit du schon ein gutes Stück weit kommst.
Photoshop-Workshop-DVD - Webdesign
- Webdesign mit Photoshop: alle erstellten Layouts mit Arbeitsdatei (PSD)!
- Umsetzung erstellter Weblayouts in HTML/CSS
- Tipps & Tricks zum Webdesign in Photoshop und zur Webentwicklung
Kommentare
Tutorial empfehlen
Anleitung (Bilder + Extras werden nur für Mitglieder eingeblendet)
Ansicht in Typo3:
In Typo 3 muss man das Menü wie folgt angeben:
MENU_OBEN = HMENU (Erzeugt hierarchische Menüs).
MENU_OBEN {
special = directory
# ID eben dieser Seite, an der das Menü anfangen soll
special.value = 1
# erste Menüebene
1 = TMENU
1 {
#für erste Menüebene Normalzustand benutzen
NO = 1
}
Die Seite sieht dann so aus …

Nun haben wir ein Menü erzeugt, das horizontal ist. Unser Menü soll aber vertikal werden, also sind noch weitere Schritte nötig.
MENU_OBEN = HMENU
MENU_OBEN {
special = directory
# ID eben dieser Seite, an der das Menü anfangen soll
special.value = 1
# erste Menüebene
1 = TMENU
1 {
# Menüelement im Normalzustand
NO = 1
# Jedes Menüelement mit li-Tag umschließen
NO.linkWrap = <li> | </li> Platzhalter ist der senkrechte Strich
}
Die Seite sieht dann so aus …

Ist ja nun schon wesentlich besser, aber nicht so wirklich schön ... also weiter geht's!
Unter NO.linkWrap den Befehl einfügen, damit die komplette Menüebene mit ul -Tag umschlossen wird:
Die Seite sieht dann so aus …

Viel besser, oder? Ich hoffe, Ihr kommt mit den angegebenen Schritten zurecht. Die mit
# gekennzeichneten Schriftzüge in den Befehlsanweisungen sind Kommentare und dienen nur zur Erklärung!
Um unser Menü links erscheinen zu lassen, benötigen wir den Befehl: entryLevel - int
Erklärung für diesen Befehl:
Gibt an, in welcher Ebene der rootline das Menü beginnen soll. Der Standardwert ist "0" (erste Seitenebene unter der Weltkugel),
was uns zu einem Menü mit den ersten Seiten der Website führt. Ist der Wert < 0, liegt entryLevel "hinter" der rootline. "-1" ist also ein Menü mit Einträgen aus der obersten Ebene,
"-2" ist die Ebene nach der obersten Ebene,...
Wir schreiben in Typo3:
MENU_LINKS = HMENU
MENU_LINKS {
entryLevel = 1
# erste Menüebene
1 = TMENU
1 {
# Menüebene im Normalzustand
NO = 1
}
}
Das Menü sieht dann so aus:

Wie ihr seht, ist das Menü oben erschienen, aber auf keinen Fall ist es so, wie es sein sollte. Also sind weitere Schritte notwendig!
Die komplette Menüebene muss durch einen Absatz umschlossen werden.
wrap = <p class "menublock"> | </p>

Schon viel besser, aber noch nicht perfekt, denn es stehen teilweise zwei Begriffe nebeneinander.
Also müssen wir nun hinter jedes Menüelement ein br-Tag setzen.
Jetzt sind wir fertig.
Der ganze Befehl stellt sich wie folgt dar:
MENU_LINKS {
entryLevel = 1
# erste Menüebene
1 = TMENU
1 {
# komplette Menüelebene mit p- Tag umschließen
wrap = <div class="menublock"> | </div>
# Menüelement im Normalzustand
NO = 1
# Hinter jedes Menüelement ein br -Tag
NO.linkWrap = | <span class="nav"/> | </span>
}
}
Unser Endprodukt sieht nun wie folgt aus ...

Dieses Template findet Ihr zur freien Verfügung im Netz.
Viel Spaß beim Basteln!
# Dieses Zeichen dient als Kommentar und wird in Typo3 als solches verwendet.
-
Reklame
-
-
- Fotobüchern
- Umrandung um Textfeld
- Kanten glätten bei meinem Bild oder Vektor?
- After Effects Ram-Vorschau - Problem mit Cache (aktualisert nicht)
- blender render stürzt ständig ab
- jQuery - Größe von einem Frameset ändern?
- [CS5] "Löschen-Mitteilung"
- Zerissenes Foto
- Biete Programmierung Ihres PSD-Designs
- Fehler beim Platzieren von Bildern
- Zeilenumbruch CS4
- Gestaltung eines Logos
- Kaufberatung Drucker
- Dynamische Auswahlliste: Name und ID übergeben
- Adobe Encore - Probleme Schaltflächen Unterbild
- 2 Fotos mit unterschiedlichem Schlagschatten in einer Datei
- Copyright-Frage - öffentliche Veranstaltung
- Photoshop auf Mini Lappi
- Link auf Anker - Firefox Problem
- Auftrag: Individuelle Flash-Gallerie
-
-
Aktuelles Commag
Anzeige
-
Anzeige


TK814
08.01.2011 - 20:11
Man hätte es besser erklären können.. Aber sonst ist es okay.
Endless_Breath
21.04.2010 - 16:50
werd ich gleich mal austesten, thx
mistab
09.02.2010 - 09:48
Kann meinen Vorrednern nur beipflichten... etwas mager geraten und auch ich hatte mir wesentlich mehr erwartet.
silvereye2000
17.11.2009 - 10:30
Ich hätte die HTML Vorlage auch eingefügt.
topmanager
10.11.2009 - 10:49
ja nicht schlecht,etwas mehr tiefe beim nächsten
chris3
21.10.2009 - 19:50
Nichts für Anfänger. Muss man sich sehr genau ansehen!
spaxi
18.10.2009 - 16:43
Naja, hatte mir ein wenig mehr Details erhofft...
leon23
17.10.2009 - 00:38
hmm habs nicht gelesen also mitte
wacko
17.10.2009 - 11:14
was soll das denn?! wieso dann überhaupt?!
Assigned1004
16.10.2009 - 06:06
Schade, hätte mehr erwartet..
Also für Typo 3 Anfänger leider nicht 100% geeignet das Tutorial :(
romihue
15.10.2009 - 19:26
Leicht verstndlich, hätte mir nur etwas audführlicher gewünscht. trotzdem Danke.
didib
15.10.2009 - 11:11
Und dafür hab ich jetzt wieder ein paar Punkte hier geopfert? .. schade.
Wenn Menüpunkte untereinander stehen, nennt man das sicher vertikal. Wenn Sie nebeneinander stehen nennt sich das horizontal. Irgendwie komm ich daher bei diesem Tut nicht ganz nach. Es scheint immer verdreht benannt zu sein.
Das Tut ist zudem völlig losgelöst vom Template und vom CSS. Es behandelt nur Typoscript. Ein netter Ansatz aber völlig unzureichend als Tut - vor allem für Typo3-Anfänger schwer nachzuvollziehen.
Zudem ist vergessen worden, dass hinter "special.value = " die ID einer Seite steht, auf die sich der Eintrag bei "entryLevel = 1" bezieht.
hier sind gute Tuts für Typo3: http://www.typo3.net/
und da ist auch die Erstellung von Menüs ausführlich dokumentiert (TS+CSS+HTML):
http://www.typo3.net/faq/div_aufgaben/menu_bulletlist/
Vielleicht sollte der Verfasser mal nachlegen und das Tut vervollständigen.
RaKa
15.10.2009 - 08:12
etwas sprunghaft und nichts für anfänger
wacko
15.10.2009 - 07:27
Verstehe nicht, warum das Tut "Template Vorlage in Typo3 einbinden (Version: Typo3)" heißt! Hier wird ja ein vertikales Menu gebaut, sonst nichts...
PS.: Vor "Platzhalter ist der senkrechte Strich" fehlt ein "#", denke ich.
elxand
12.10.2009 - 22:49
Super, alles inkl. Quelltext, leicht verfolgbar. Wie wär's mit nem Follow-Up für Submenüs? :)
snoopdog1971
12.10.2009 - 13:19
Danke für die ausführliche und einfache Beschreibung