---
title: "Superfishmenu einbauen"
url: "https://www.typo3.net/d/108267-superfishmenu-einbauen"
source: "typo3.net"
tags: ["TYPO3","Menüs","Frage"]
created: "2011-11-17"
last_reply: "2011-12-12"
replies: 10
solved: false
page: 1
pages: 1
lang: "de"
---

# Superfishmenu einbauen

TYPO3 › Menüs · 10 Antworten · gestartet 2011-11-17

## Eröffnungsbeitrag

**wmcig** · 2011-11-17 · [Beitrag #1](https://www.typo3.net/d/108267-superfishmenu-einbauen/1)

Ich habe bisher das Template von <http://luiszuno.com/blog/downloads/nova-html-template> in TemplaVoila gemappt und knabbere am mitgelieferten Hauptmenu (Superfish) herum.

Mein TS Code zum Menü ist derteit wie folgt:

```typoscript
lib.navigation = HMENU
lib.navigation {
    wrap = <ul id="nav" class="sf-menu">|</ul>
 
  1 = TMENU
  1 {
    expAll = 1
    noBlur = 1
    NO = 1
    NO.allWrap= <li>|</li>
 
    CUR = 1
    CUR.allWrap = <li class="current-menu-item">|</li>
 
  }
 
  2 = TMENU
  2 {
    expAll = 1
    noBlur = 1
    NO.wrapItemAndSub = <li>|</li>
 
    CUR = 1
    CUR.wrapItemAndSub = <li class="current-menu-item">|</li>
 
    ACT = 1
    ACT < .CUR
  }
 
  3 < .2
  3.wrap = <ul>|</ul>
}
```

Mein Quellcode sagt nun:

```html
<!-- Menu -->
			<div id="menu">
			
			
			
				<!-- ENDS menu-holder -->
				<div id="menu-holder">
					<!-- wrapper-menu -->

					<div class="wrapper"><ul id="nav" class="sf-menu"><li><a href="index.php?id=1004"  >Login</a></li><li><a href="index.php?id=1005"  >Registrieren</a></li></ul></div>
					<!-- wrapper-menu -->
				</div>
				<!-- ENDS menu-holder -->
			</div>
			<!-- ENDS Menu -->
```

Der Quellcode des Originals sagt:

```html
<!-- Menu -->
			<div id="menu">
			
			
			
				<!-- ENDS menu-holder -->
				<div id="menu-holder">
					<!-- wrapper-menu -->
					<div class="wrapper">
						<!-- Navigation -->
						<ul id="nav" class="sf-menu">

							<li class="current-menu-item"><a href="index.html">Home<span class="subheader">Welcome</span></a></li>
							<li><a href="features.html">Features<span class="subheader">Awesome options</span></a>
								<ul>
									
									<li><a href="features-columns.html"><span> Columns layout</span></a></li>
									<li><a href="features-accordion.html"><span> Accordion</span></a></li>

									<li><a href="features-toggle.html"><span> Toggle box</span></a></li>
									<li><a href="features-tabs.html"><span> Tabs</span></a></li>
									<li><a href="features-infobox.html"><span> Text box</span></a></li>
									<li><a href="features-monobox.html"><span> Icons</span></a></li>
								</ul>

							</li>
							<li><a href="blog.html">Blog<span class="subheader">Read our posts</span></a></li>
							<li><a href="portfolio.html">Portfolio <span class="subheader">Showcase work</span></a></li>
							<li><a href="gallery.html">Gallery<span class="subheader">Featured work</span></a>
								<ul>
									<li><a href="gallery.html"><span> Four columns</span></a></li>

									<li><a href="gallery-3.html"><span> Three columns </span></a></li>
									<li><a href="gallery-2.html"><span> Two columns </span></a></li>
									<li><a href="video-gallery.html"><span> Video gallery </span></a></li>
								</ul>
							</li>
							<li><a href="contact.html">Contact<span class="subheader">Get in touch</span></a></li>

						</ul>
						<!-- Navigation -->
					</div>
					<!-- wrapper-menu -->
				</div>
				<!-- ENDS menu-holder -->
			</div>
			<!-- ENDS Menu -->
```

Man sieht im Original-Quelltext noch span classes, die mit angegeben sind.

Bei meinem Menu, wenn ich dann mehrere Ebenen angebe, die dann ausgeklappt werden sollen, klappt dies nicht, sondern es werden alle (Seiten-) Links, die ich ausgeben will, auf der Seite verteilt angezeigt. Das Ausklappen funktioniert nicht.

Wer kann mir einen Tipp geben, wie ich das Original-Menü in Typo3 nun umsetzen kann?

Bin über jede Hilfe dankbar

## Antworten

### [#2](https://www.typo3.net/d/108267-superfishmenu-einbauen/2) · wmcig · 2011-12-05

Ich habe erst einmal das eigentliche HMENU abgebildet und gemerkt, dass ich schon bei der ersten Ebene des Menüs ins Stocken gerate.

Derzeitig sieht mein Quellcode in Etwa so aus:

```html
<div class="wrapper">
						<!-- Navigation -->
						<ul id="nav" class="sf-menu">

							<li class="current-menu-item"><a href="index.html">Home</a></li>
```

Allerdings sollte meine erste Ebene im Quell code so aussehen:

```html
<div class="wrapper">
						<!-- Navigation -->
						<ul id="nav" class="sf-menu">

							<li class="current-menu-item"><a href="index.html">Home<span class="subheader">Welcome</span></a></li>
```

Die span classes, die den Untertitel ausgeben sollen, bekomme ich nicht ins Menü. Ich weiß nicht wie ich es aufbauen soll, damit der Seitentitel und der Untertitel der Seite im Menü ausgegeben werden können.

Über Hilfe würde ich mich sehr freuen!

### [#3](https://www.typo3.net/d/108267-superfishmenu-einbauen/3) · wmcig · 2011-12-07

Ich habe jetzt im Internet mal herumgesucht und etwas zusammengebastelt, das evtl. noch angepasst werden muß:

```typoscript
lib.navigation = HMENU
lib.navigation {
  
  special = list
    special.value = 2, 227, 75, 74, 100,372
  
        1 = TMENU
        1 {
                #expAll =1
                wrap = <ul id="nav" class="sf-menu">|</ul>
                noBlur = 1

NO = 1
                NO {
                
                       ATagTitle.field = title
# add subtitle as span-tag
    after {
        wrap = <span class="subheader">|</span>
  field = subtitle
    }
          }

              
                ACT <.NO
                ACT {
                        # doNotLinkIt = 1
                        wrapItemAndSub = <li class="current-menu-item">|</li>

          }
          
          }

        # hier kommen die anderen ebenen        

}
```

Dies erzeugt das Menü und der erste menüpunkt wird sogar mit Untertitel angezeigt. Auf dem ersten Blick sieht der Quelltext auch gut aus. Aber die nachfolgenden Punkte sind nicht formatiert.

Wenn man genauer hinschaut, befindet sich die "span" Klasse hinter dem a-Tag. Allerdings soll die "span" Klasse im a-tag beginnen und auch enden.

Was muss ich im Code daran ändern, damit es auch mit dem funktionierenden Quellcode funktioniert?

### [#4](https://www.typo3.net/d/108267-superfishmenu-einbauen/4) · jank · 2011-12-07

Du wrapst ja auch after ;)

```typoscript
lib.navigation.1.NO.stdWrap.dataWrap = |<span class="subheader">{field:subtitle}</span>
```

### [#5](https://www.typo3.net/d/108267-superfishmenu-einbauen/5) · wmcig · 2011-12-07

> **jank schrieb:**
>
> Du wrapst ja auch after ;)
>
> ```typoscript
> lib.navigation.1.NO.stdWrap.dataWrap = |<span class="subheader">{field:subtitle}</span>
> ```

Hallo. Danke für Deine Hilfe.

Aber ich weiss im Moment nicht, wo ich es im gesamten Code platziere?! Kannst Du bitte den gesamten Code mit deiner Änderung angeben?

### [#6](https://www.typo3.net/d/108267-superfishmenu-einbauen/6) · wmcig · 2011-12-08

Ich habe das alles mal mit Hilfe von Google umgeschrieben. Ich würde mich sehr darüber freuen, wenn mal jemand schaut, ob es ne andere, saubere Lösung bezüglich des Typoscript-Codes gibt:

```typoscript
lib.navigation = COA
lib.navigation {
 10 = HTML
 10.value = <ul id="nav" class="sf-menu">
 20 = HMENU
 20 {
   special = list
   special.value = 2, 227, 75, 74, 100,372
   1 = TMENU
   1 {
     noBlur = 1
     NO = 1
     NO {
       ATagTitle.field = abstract // description // subtitle
       stdWrap.cObject = COA
       stdWrap.cObject {
         10 = TEXT
         10.field = title
         10.stdWrap.htmlSpecialChars = 1
         20 = TEXT
         20.field = subtitle
         20.stdWrap.htmlSpecialChars = 1
         20.wrap = <span class="subheader">|</span>
       }
       wrapItemAndSub = <li>|</li>
       wrapItemAndSub.insertData = 1
     }
     ACT = 1
     ACT < .NO
     ACT.wrapItemAndSub  = <li class="current-menu-item">|</li>
   }
 }
 30 = HTML
 30.value = </ul>
}
```

Vielleicht findet ja jemand noch eine Lösung, wie es anders geschrieben werden kann oder ob etwas überflüssig ist!

Was noch fehlt? Da es ein Dropdown sein soll, fehlt noch die Ausgabe der 2. Eebene. Hat dazu jemand einen Tipp?

### [#7](https://www.typo3.net/d/108267-superfishmenu-einbauen/7) · jank · 2011-12-09

Hallo wmcig,
habe mir dein ts angeschaut und etwas ausgedünnt.

```typoscript
lib.navigation = HMENU
lib.navigation {
	special = list
	special.value = 2, 227, 75, 74, 100,372
	1 = TMENU
	1 {
		expAll = 1
		noBlur = 1
		wrap = <ul id="nav" class="sf-menu">|</ul>
		NO = 1
		NO {
			ATagTitle.field = abstract // description // subtitle
			stdWrap.dataWrap = |<span class="subheader">{field:subtitle}</span>
			wrapItemAndSub = <li>|</li>
		}
		ACT < .NO
		ACT.wrapItemAndSub  = <li class="current-menu-item">|</li>
	}
	2 < .1
	2.wrap = <ul>|</ul>
}
```

Zur Erklärung:
Wenn ein Objekt ein wrap unterstützt z.B. das [HMENU](https://docs.typo3.org/m/typo3/reference-typoscript/main/en-us/ContentObjects/Index.html) dann am besten auch verwenden.

```typoscript
expAll = 1
```

brauchst du damit alle Menü-Einträge unabhängig von der geöffneten Seite ausgegeben werden. Siehe hierzu [TMENU](https://docs.typo3.org/m/typo3/reference-typoscript/main/en-us/ContentObjects/Hmenu/Tmenu/Index.html)

Ansonsten fehlt dir ja noch die nächste Menüebene (2).

Als Tip: wenn du dich mal durch die [TSREF](https://docs.typo3.org/m/typo3/reference-typoscript/main/en-us/Index.html) gequält hast und die leider etwas komplizierte und manchmal auch umständliche Umsätzung verstanden hast, hilft dir diese beim schreiben deines TS Templates.

### [#8](https://www.typo3.net/d/108267-superfishmenu-einbauen/8) · wmcig · 2011-12-09

Danke Dir für die bihserige Hilfe. Das hat mich echt weitergebracht!

Ich habe für die zweite Ebene folgenden Code ins TS geschrieben:

```typoscript
# 2. Ebene
  2 = TMENU
  2.expAll = 1
  2.noBlur = 1
  2.wrap = <ul>|</ul>
  2.NO.allWrap = <li>|</li>
  2.ATagTitle.field = abstract // description // title
  2.stdWrap.dataWrap = |<span>{field:title}</span>
```

Das ergibt zum Beispiel den folgenden HTML-Code:

```html
<ul><li><a href="index.php?id=1004"  >Login</a></li>...</ul>
```

Allerdings soll der "Login" (-Titel) von "<span></span>" umschlossen sein. Was fehlt denn da noch oder was ist falsch?

### [#9](https://www.typo3.net/d/108267-superfishmenu-einbauen/9) · jank · 2011-12-09

Da sich die Erste und 2. Ebene meist sehr ähneln würden ich die 1. Ebene in die 2. !per TypoScript! kopieren und danach die Änderungen zur 1. Ebene definieren:

```typoscript
# 1. Ebene in 2. kopieren
2 < .1
2 {
	# wrap der Ebene ändern
	wrap = <ul>|</ul>
	# datawrap löschen
	stdWrap.dataWrap >
	# Inhalt mit span umschließen
	stdWrap.wrap = <span>|</span>
}
```

### [#10](https://www.typo3.net/d/108267-superfishmenu-einbauen/10) · wmcig · 2011-12-10

> **jank schrieb:**
>
> Da sich die Erste und 2. Ebene meist sehr ähneln würden ich die 1. Ebene in die 2. !per TypoScript! kopieren und danach die Änderungen zur 1. Ebene definieren:
>
> ```typoscript
> # 1. Ebene in 2. kopieren
> 2 < .1
> 2 {
> 	# wrap der Ebene ändern
> 	wrap = <ul>|</ul>
> 	# datawrap löschen
> 	stdWrap.dataWrap >
> 	# Inhalt mit span umschließen
> 	stdWrap.wrap = <span>|</span>
> }
> ```

Das hat gewirkt. Ich danke Dir sehr für die Hilfe!:p#giggle#

### [#11](https://www.typo3.net/d/108267-superfishmenu-einbauen/11) · jank · 2011-12-12

gerne! 8-)
Wenn du Lust hast kannst mir auch ein
[Bier kaufen](http://wiki.t3easy.de/diese-seite-unterstuetzen/spenden.html)
;)

---

Quelle: „Superfishmenu einbauen“, typo3.net, https://www.typo3.net/d/108267-superfishmenu-einbauen
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.