---
title: "\"gtmenu\" mit eigenen vorlagen"
url: "https://www.typo3.net/d/82623-gtmenu-mit-eigenen-vorlagen"
source: "typo3.net"
tags: ["TYPO3","Menüs","Frage"]
created: "2008-10-09"
last_reply: "2008-10-09"
replies: 0
solved: false
page: 1
pages: 1
lang: "de"
---

# "gtmenu" mit eigenen vorlagen

TYPO3 › Menüs · 0 Antworten · gestartet 2008-10-09

## Eröffnungsbeitrag

**Tektol** · 2008-10-09 · [Beitrag #1](https://www.typo3.net/d/82623-gtmenu-mit-eigenen-vorlagen/1)

Hallo allerseits,

folgendes sehr tolle Script möchte ich gerne für mich verwenden.
Es ist die perfekte Ablösung für das althergebrachte GMENU, das nun wirklich hässlichen Code produziert.
Die dahinter liegende CSS Technik lautet "Image Replacement", und ist ein Verfahren, um eine bessere Qualität in der Suchmaschinenoptimierung zu erzielen, da hier auch semantisch korrekt ausgeschriebener Text für jeden Menüeintrag vorhanden ist, der einfach über CSS aus dem sichtbaren Bereich geschoben wird, so daß das dahinterliegende Hintergrundbild sichtbar bleibt. Ausserdem kommt hier auch das sogenannte "CSS Sprite" Verfahren zum Einsatz, das zudem die Ladezeit verkürzt, da alle Zustände in einem Bild liegen und durch hin und herschieben zum Vorschein gebracht werden. AUSSERDEM ;) verzichtet es auf Javascript.

So weit des Lobes =)

Leider ist es, was Typoscript angeht, ein sehr fortgeschrittenes Level ;)
Im Grunde möchte ich das Ding mit meinen Vorlagengrafiken für NO, ACT usw. ausstatten.
So wie mit dem klassischen GMENU, bei dem ich ja einfach zb.

```typoscript
5 = IMAGE
```

```typoscript
5.file = bildpfad
```

schreibe.

Aber hier? Irgendwer eine Idee?

Danke schonmal,
Tektol

```typoscript
lib.gtmenu = HMENU
lib.gtmenu {
  1 = TMENU
  1 {
    wrap = <ul id="navi">|</ul>
    NO.doNotLinkIt = 1
    NO.wrapItemAndSub = <li>|</li>
    NO.stdWrap.cObject = COA
    NO.stdWrap.cObject {
      10 = TEXT
      10 {
        field = title
          typolink {
          parameter.field = uid

          ATagParams.cObject = COA
          ATagParams.cObject {

            10 = IMG_RESOURCE
            10.file = GIFBUILDER
            10.file {
              XY = [10.w]+[20.w]+10,70
              transparentColor = #ffffff
              10 = TEXT
              10 {
                text.field = subtitle//title
                fontSize = 14
                fontFile=fileadmin/fonts/DINPro-Bold.otf
                offset = 5,20
                fontColor = #787879
                }

              20 = BOX
              20.dimensions = 0,30,[10.w]+[20.w]+10,30
              20.color = #e53827

              30 = TEXT
              30 < .10
              30 {
                offset = 5,50
                fontColor = #ffffff
                }
              }
              10.stdWrap.dataWrap = style="width:{TSFE:lastImgResourceInfo|0}px; background-image: url('/|');"
            }
          }
        }
      }
    }
  }
```

Das dazugehörige CSS:

```typoscript
ul#navi {list-style: none;}
ul#navi li {float: left;}
ul#navi li a {background-repeat:no-repeat; display:block; overflow:hidden;text-indent: 999em; white-space:nowrap; height:30px;}
ul#navi li a:hover, ul#navi li.current a,ul#navi li.over a {background-position:0px -30px;}
```

---

Quelle: „"gtmenu" mit eigenen vorlagen“, typo3.net, https://www.typo3.net/d/82623-gtmenu-mit-eigenen-vorlagen
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.