Typo3 - Spacer Page

Aus Wikizone
Version vom 9. Januar 2008, 07:27 Uhr von 91.32.69.46 (Diskussion) (→‎Der Seitentyp Spacer oder Abstand)
(Unterschied) ← Nächstältere Version | Aktuelle Version (Unterschied) | Nächstjüngere Version → (Unterschied)
Wechseln zu: Navigation, Suche

Der Seitentyp Spacer oder Abstand (Trenner, Divider)[Bearbeiten]

aus http://www.mcuniverse.com/05/TYPO3.31.0.html

12.8.2006 14:00

Spacer Page Code

For my direct mail tutorial I was forced to use the Spacer Page Type to break up the leftside navigation into sections. It took a bit of searching on how to use it so I decided to add it to my Code Snippet Section.

To see how it is integrated in with the regular menu, check out the Left Vertical Menu Snippet. What is a Spacer Page?

This is how the Spacer Page looks in the Directory Tree in Typo3 Datei:Spacerpage1.gif

This is how the Spacer Page looks in the Navigation on the website Datei:Spacerpage.gif The Spacer page is a page that shows up in the navigation, but does not have a link associated with it.

Typo3 has to be told how to use the Spacer page. This is done in the Setup section of the Typo3 template.

First you have to decide at which level of the navigation tree the Spacer page has to show up. In my example it is on Level 3 of the left side navigation and does not show up as a link and does not link to anything. The look of the text is defined by a class in the style sheet.

Typo3 Template Spacer Code

# Spacer Code Level 2
   temp.leftmenu.2.SPC = 1
   temp.leftmenu.2.SPC < subparts.leftmenu
   temp.leftmenu.2.SPC.doNotShowLink = 0 
   temp.leftmenu.2.SPC.doNotLinkIt = 1
   temp.leftmenu.2.SPC.allWrap =  
   <DIV class="leftnavspc">«  |  »</DIV>
   Note:
   The last to lines of code should all be on the same line. I had to split it into two to fit on the page.

Stylesheet Spacer Class

/* Left Navigation SubMenu Spacer */
.leftnavspc {  
   font-family: Verdana, sans-serif;
   font-size: 11px;
   font-variant: small-caps;
   font-weight: bolder;
   color: #003366;   /* dark blue */
   text-decoration: none;
   padding: 2px;
   margin-left: 15px; 
   background-color: #FFFFFF;  /* white */
   border-bottom: thin dotted #9B193D;   /* burgundy */
}