Navigationspunkte NICHT verlinken

[Tholke]

Hallo Community

Ich hab ne frage zur Navigation. Es geht um eine solche Struktur:

• Handel
  • DigiCam
  • Analog
  • FireWire
• Roboter
• Cams

Ich will nun, dass der Punkt Handel nicht verlinkt ist. Sprich keine eigene Seite hat, und die unterpunkte nur angezeigt werden wenn die maus drüber kommt.

Den Hovereffekt hab ich und alles. Es geht lediglich noch darum wie ich den link für den Hauptpunkt deaktivieren kann.

So ich hoffe ich konnte mein Problem gut erläutern, und hoffe auf Antworten.

Grüsse Tholke

[Fryd]

Du musst den Typ der Seite "Handel" von "reguläre Seite" in "interne Weiterleitung" ändern. Dort gibst du dann die Seite an, die angezeigt werden soll.

Grüße
Fryd

[stefan-at-work]

Du musst den Typ der Seite "Handel" von "reguläre Seite" in "interne Weiterleitung" ändern. Dort gibst du dann die Seite an, die angezeigt werden soll.

dann "handelt" es sich aber immer noch um einen Link

[Fryd]

... hat aber zumindest keine eigene Seite ...

[lucina]

Nette Idee, aber ...

Den Hovereffekt hab ich und alles. Es geht lediglich noch darum wie ich den link für den Hauptpunkt deaktivieren kann.

... das wird nicht einfach so mit einem der Standard-Navigationsmodule gehen, sondern nur mit Hilfe von CSS.

'Hover' zu nutzen, wenn kein Link vorhanden ist halte ich auch nicht für zielführend, weil dann die Frage ist, wie Du an die Unterpunkte kommst (okay, heftigstes DOM -Scripting, aber das willst Du nicht wirklich ...).

Du könntest als Alternative eine Seite mit Weiterleitung auf sich selbst anlegen und per CSS 'a[title] den allfälligen Link so ausschauen lassen wie eben kein Link. Für das Einblenden der Untermenuswürde ich in diesem Fall an die Mootools-Navigation von Andreas denken.

Ich finde Deine Idee allerdings im Sinne der Usability nicht unbedingt gut. Ich persönlich würde davon ausgehen, dass Userinnen und Iser innerhalb einer Navigation immer erwarten, irgendwohin navigieren zu können. Die Lösung, auf eine der Unterseiten zu verlinken halte ich in diesem Sinne für die Besser. Oder mal zu überlegen, ob Du die Seitenstruktur richtig bedacht hast - in meiner Logik sind Menupunkte immer Oberbegriffe zu den enthaltenen Unterseiten.

MfG,
Carolina.

EDIT: Es gäbe da sicher noch Alternativen mit eigenem HTML, Insert-Tags, einem ausgeblendeten Submenu und dem einblenden mit 'hover' (das ja nun nicht an Links gebunden ist), aber das ist Dir sicher zu frickelig ...

[xtra]

Template nav_default kopieren, einen neuen Namen geben wie z.B. nav_partiallinked

<ul class="<?php echo $this->level; ?>">
<?php foreach ($this->items as $item): ?>
<?php if ($item['isActive']): ?>
<li class="active<?php if ($item['class']): ?> <?php echo $item['class']; ?><?php endif; ?>"><span class="active<?php if ($item['class']): ?> <?php echo $item['class']; ?><?php endif; ?>"><?php echo $item['link']; ?></span><?php echo $item['subitems']; ?></li>
<?php else: ?>
<li<?php if ($item['class']): ?> class="<?php echo $item['class']; ?>"<?php endif; ?>><?php if(strpos($item['class'], 'nonavlink')===false):?> <a href="<?php echo $item['href']; ?>" title="<?php echo $item['pageTitle'] ? $item['pageTitle'] : $item['title']; ?>"<?php if ($item['class']): ?> class="<?php echo $item['class']; ?>"<?php endif; ?><?php if ($item['accesskey'] != ''): ?> accesskey="<?php echo $item['accesskey']; ?>"<?php endif; ?><?php if ($item['tabindex']): ?> tabindex="<?php echo $item['tabindex']; ?>"<?php endif; ?><?php if ($item['nofollow']): ?> rel="nofollow"<?php endif; ?><?php if ($item['target']): ?> onclick="<?php echo $item['target']; ?>"<?php endif; ?>><?php endif; ?><?php echo $item['link']; ?><?php if(strpos($item['class'], 'nonavlink')===false):?></a><?php endif; ?><?php echo $item['subitems']; ?></li>
<?php endif; ?>
<?php endforeach; ?>
</ul>

Anschliessend den Seiten, welche nicht verlinkt werden sollen die Klasse "nonavlink" hinzufuegen und es sollte funktionieren.
Oder sollte ich die Frage missverstanden haben?

[Sarvo]

funktioniert damit bei einer mootools navi noch der MouseOver bei einer nonavlink Seite ?

danke für den code

[xtra]

funktioniert damit bei einer mootools navi noch der MouseOver bei einer nonavlink Seite ?

Da ich nicht weiss nach welchem Konzept die mootools navi vorgeht kann ich dies leider nicht beantworten.
Mein Code entfernt bei betroffenen Seiten das komplette <a></a> Tag und laesst nur dessen Inhalt ueber.

danke für den code

Kein Problem

[Tholke]

Danke für die Vielen Antworten.

War über WE und bis jetzt leider nicht mehr dran.

Danke für den Code, ich denke ich werde ihn gleich einfügen.

Zu den Beweggründen warum ich dies so haben möchte, bzw. der Marketinfuzzi

@lucina

ich teile dein Verständnis, von Überpunkten, die eine Beschreibung bzw. Zusammenfassung der Untermenüs sein soll. Bedenke jedoch:

Wenn man in den Unterpunkten von "Unternehmen" 9 verschiedene Einträge hat und diese die gesamte Firmengeschichte aufrollen und und und... (halt alles was dazugehört) so ist es aus meiner Sicht unsinnig wenn man den Hauptpunkt auch noch verlinkt, weil man dann höchstens redundanzen erzeugen würde. Er ist jedoch nötig, damit man nicht eine Monsternavigation erhält.

Es handelt sich immerhin um eine Seite, die etwa 40 Seiten und das in Deutsch, französisch und Englisch hat. Da kommt es durchaus drauf an ob man nochmal 10-20 mehr gestalten muss.

Nochmals Danke und Grüsse
Tholke

Edit: Funktioniert Super!!! Vielen Dank

[Typodry]

Hallo!

Template nav_default kopieren,

Mal ne doofe Frage von mir: wie kopiert man diese tpl-Datei? Ich finde sie nirgends in der Typolight-Installation (habe mir gerade einen Wolf gesucht!).

Liebe Grüße,

Typodry

[Sarvo]

Du gehst im Backend auf :
Template -> neues Template -> dann ist der Liste das gewünschte Template auswählen -> mit anderem Namen abspeichern und wie gewünscht abändern.

Das neue Template ist nun im Template Ordner gespeichert und wird bei gleichen Namen wie das StandartTemplate dem Standart vorgezogen.

Dann bei der Navi als Template auswählen und fertig.

Das nächste mal genügt auch ein Blick in die Suche

[Typodry]

Danke für die Antwort!

[esjot]

Gut und schön und funktional zugleich, aaaber ich hätte da noch ein Frägelein:

Wenn ich der Seite bereits eine eigene CSS Klasse zugewiesen habe, wie schaffe ich es dass die dann auch noch die Klasse (wie im Beispiel) "nonavlink" schluckt?

[xtra]

Gib ihr zwei Klassen, durch Leerzeichen getrennt.
z.B.: "deineklasse nonavlink"

[esjot]

Gib ihr zwei Klassen, durch Leerzeichen getrennt.
z.B.: "deineklasse nonavlink"

Ahh, zu einfach. Darauf hätte ich auch kommen können.
Muss ich wohl im Handbuch überlesen haben.
Danke. Vielen Dank.

[ribery]

Hi xtra,

habe noch eine Frage dazu:

Template nav_default kopieren, einen neuen Namen geben wie z.B. nav_partiallinked

<ul class="<?php echo $this->level; ?>">
<?php foreach ($this->items as $item): ?>
<?php if ($item['isActive']): ?>
<li class="active<?php if ($item['class']): ?> <?php echo $item['class']; ?><?php endif; ?>"><span class="active<?php if ($item['class']): ?> <?php echo $item['class']; ?><?php endif; ?>"><?php echo $item['link']; ?></span><?php echo $item['subitems']; ?></li>
<?php else: ?>
<li<?php if ($item['class']): ?> class="<?php echo $item['class']; ?>"<?php endif; ?>><?php if(strpos($item['class'], 'nonavlink')===false):?> <a href="<?php echo $item['href']; ?>" title="<?php echo $item['pageTitle'] ? $item['pageTitle'] : $item['title']; ?>"<?php if ($item['class']): ?> class="<?php echo $item['class']; ?>"<?php endif; ?><?php if ($item['accesskey'] != ''): ?> accesskey="<?php echo $item['accesskey']; ?>"<?php endif; ?><?php if ($item['tabindex']): ?> tabindex="<?php echo $item['tabindex']; ?>"<?php endif; ?><?php if ($item['nofollow']): ?> rel="nofollow"<?php endif; ?><?php if ($item['target']): ?> onclick="<?php echo $item['target']; ?>"<?php endif; ?>><?php endif; ?><?php echo $item['link']; ?><?php if(strpos($item['class'], 'nonavlink')===false):?></a><?php endif; ?><?php echo $item['subitems']; ?></li>
<?php endif; ?>
<?php endforeach; ?>
</ul>

Anschliessend den Seiten, welche nicht verlinkt werden sollen die Klasse "nonavlink" hinzufuegen und es sollte funktionieren.
Oder sollte ich die Frage missverstanden haben?

Ich habe das brav gemacht und der besagten Seite auch die besagte Klasse zugewiesen, aber der Link existiert leider immer noch

Frage: Ist mein Kopie von "nav_default" gleich aktiv oder muss ich Typolight noch beibringen, dass es bitte nun meine Kopie hier einsetzen soll? Muss ich evtl. ein neues Seitentemplate generieren und meine Kopie hier integrieren?

Vieel Grüße

[xchs]

Natürlich musst Du für Dein Modul "Navigationsmenü" auch das neue, von Dir angelegte Template auswählen, sonst wird es ja nicht geparst und zeigt somit auch keine Wirkung...

[ribery]

Ok, und habe ich es richtig verstanden, dass ich dann eine Kopie von "fe_page.tpl" anlegen muss und dann hier mein kopiertes "nav_default" einklinken muss?

Falls ja, so hätte ich noch einen Tipp (ich weiß, dass ist sciherlich eine Newbie-Frage!), wie ich hier coden muss, um mein kopiertes "nav_default" einzubinden?

1000 Dank schon mal im voraus!!

[xchs]

Ok, und habe ich es richtig verstanden, dass ich dann eine Kopie von "fe_page.tpl" anlegen muss und dann hier mein kopiertes "nav_default" einklinken muss?

Nein, absolut nicht! Wie kommst Du auf die Idee?

Bitte probiere mal zurerst, was ich Dir vorhin geschrieben habe, sprich Dein erstelltes "nav_..."-Template aus dem Template-Ordner ("[TL_ROOT]/templates/") im Modul "Navigationsmenü" aus der DropDown-Liste auswählen - nichts weiter!

[ribery]

Bing

Alles bestens und schon wieder etwas gelernt! Vielen Dank nochmal!

[heiko]

Hallo,

ich bin dem Tip von xtra gefolgt und es funktioniert so auch (erstmal nur bei dem Button "Land & Kultur). Aber, jetzt hat der Internet Explorer Probleme (siehe Screenshot). Hmmm.

heiko

[heiko]

Ich habe das Ganze jetzt mal wieder rückgängig gemacht, weil ich ja so für die aktive Seite keinen span auf einen a-Tag bekam. Für die Seiten, die eigentlich nicht klickbar sein sollten, habe ich einfach mal per css visuell den Eindruck geschaffen, daß hier nichts zu klicken ist. Also farblich abgesetzt, kein Rollover, einen Hinweispfeil und den Cursor verändert.

http://vietnam-kompakt.de/

heiko

[xchs]

Für die Seiten, die eigentlich nicht klickbar sein sollten, habe ich einfach mal per css visuell den Eindruck geschaffen, daß hier nichts zu klicken ist. Also farblich abgesetzt, kein Rollover, einen Hinweispfeil und den Cursor verändert.

Aber solltest Du dann nicht wenigstens für die betreffenden Seiten im Hauptmenü eine Weiterleitung z.B.auf die erste Seite im Untermenü anlegen. Denn, wenn trotzdem mal einer auf die Idee kommt, den Hauptmenüpunkt anzuklicken, dann wird ihm nur eine leere Seite angezeigt.

[heiko]

Habe ich jetzt gemacht. Aber irgendwie ist alles nicht so ideal. Es sei denn man könnte PHP programmieren.

heiko

[xchs]

Habe ich jetzt gemacht.

Aber noch nicht für alle Menüpunkte oder?

[heiko]

Hallo, jetzt ja. Irgendwie habe ich aber noch einen CSS-Fehler. Das sieht man, wenn man z.Bsp. unter "Land & Kultur" auf "Vietnamesisch-chinesische Beziehungen" klickt und dann nochmal das Menü 2. Level aufklappen lässt.

Hier das Navi-CSS:

.navi2 ul
{
	width:100%;
	list-style-type:none;
	z-index: 20000;
}
.navi2 li
{
	width:100px;
	float:left;
}
.navi2 a,
.navi2 span
{
	width:auto;
	display:block;
	padding:5px 0;
	text-align:center;
	border-right:1px dotted #FFFFFF;
	text-decoration:none;
	color:#FFFFFF;
	font: normal 12px Arial, Helvetica, sans-serif;
	background: #006600;
}
.navi2 a:hover
{
	background-color:#613737;
	color:#fcfcfc;
}
.navi2 li li
{
	width:auto;
	float:none;
	margin-left:-40px;
}
.navi2 li li a
{
	width:auto;
	padding-left:20px;
	text-align:left;
	border-bottom:1px dotted #FFFFFF;
	color:#fff;
	background: #36783f;
}
.navi2 ul li ul
{
	left:-9999px;
	position:absolute;
}
.navi2 li:hover ul
{
	width:150px;
	left:auto;
	position:absolute;
	margin:0;
	border-bottom:8px solid #d12148;
}
.navi2 a#last_border
{
	border:5px solid #fcfcfc;
}
.navi2 ul li ul li ul li a
{
	width:auto;
	color:#000000;
	background: #66CCFF;
}
.navi2 ul li ul li ul
{
	width:auto;
	position:absolute;
	display:none;
}
.navi2 ul li ul li:hover ul
{
	width:200px;
	left:190px;
	position:absolute;
	display:block;
	margin-top:-26px;
}
.navi2 a.nolink:link,
.navi2 a.nolink:visited,
.navi2 a.nolink:hover,
.navi2 a.nolink:active
{
	width:auto;
	display:block;
	padding:5px 0;
	text-align:center;
	text-decoration:none;
	color:#FFFFFF;
	font: normal 12px Arial, Helvetica, sans-serif;
	background: #006600;
	cursor: default;
}
.navi2 li li a.nolink:link,
.navi2 li li a.nolink:visited,
.navi2 li li a.nolink:hover,
.navi2 li li a.nolink:active
{
	width:auto;
	display:block;
	padding:5px 0 5px 20px;
	text-align:left;
	background:#36783f url("tl_files/template/arrow2.png") right center no-repeat;
	text-decoration:none;
	color:#FFFFFF;
	font: normal 12px Arial, Helvetica, sans-serif;
	cursor: default;
}

[xchs]

Fein wär halt noch, wenn Du auch schreiben würdest, was Dich daran stört bzw. wie es Deiner Meinung nach aussehen soll. Stört Dich, dass der Menüpunkt zentriert erscheint?

[heiko]

Hallo xchs, ja, das und background soll sich nicht ändern. Irgendwie ist's wie a:visited. Sieht man auch, wenn man in Level 3 auf einen Menüpunkt klickt. Da gibts dann auch einen visited-Link. Soll nicht sein. Wahrscheinlich durch die Klasse "nolink". Muss ich mir später nochmal anschaun.

heiko

[xchs]

Der aktive Menüpunkt erhält ja die Klasse "active" zugewiesen. Über diese Klasse kannst Du dann diesen Menüeintrag nach Belieben stylen...

[heiko]

Ja danke xchs, ich denke das sollte ich hinbekommen. Vielen Dank für die Unterstützung. Voraussichtlich morgen kann ich das erledigen.

[Sleepers]

Template nav_default kopieren, einen neuen Namen geben wie z.B. nav_partiallinked

<ul class="<?php echo $this->level; ?>">
<?php foreach ($this->items as $item): ?>
<?php if ($item['isActive']): ?>
<li class="active<?php if ($item['class']): ?> <?php echo $item['class']; ?><?php endif; ?>"><span class="active<?php if ($item['class']): ?> <?php echo $item['class']; ?><?php endif; ?>"><?php echo $item['link']; ?></span><?php echo $item['subitems']; ?></li>
<?php else: ?>
<li<?php if ($item['class']): ?> class="<?php echo $item['class']; ?>"<?php endif; ?>><?php if(strpos($item['class'], 'nonavlink')===false):?> <a href="<?php echo $item['href']; ?>" title="<?php echo $item['pageTitle'] ? $item['pageTitle'] : $item['title']; ?>"<?php if ($item['class']): ?> class="<?php echo $item['class']; ?>"<?php endif; ?><?php if ($item['accesskey'] != ''): ?> accesskey="<?php echo $item['accesskey']; ?>"<?php endif; ?><?php if ($item['tabindex']): ?> tabindex="<?php echo $item['tabindex']; ?>"<?php endif; ?><?php if ($item['nofollow']): ?> rel="nofollow"<?php endif; ?><?php if ($item['target']): ?> onclick="<?php echo $item['target']; ?>"<?php endif; ?>><?php endif; ?><?php echo $item['link']; ?><?php if(strpos($item['class'], 'nonavlink')===false):?></a><?php endif; ?><?php echo $item['subitems']; ?></li>
<?php endif; ?>
<?php endforeach; ?>
</ul>

Das funktioniert schon mal super! Nur brauche ich die <a></a> unbedingt zur Formatierung. Habe jetzt schon ewig mit "else" Anweisungen rum probiert, aber bekomme es nicht hin.
Der nicht klickbare Link soll ein <a></a> bekommen nur halt kein href.

Kann mir da jemand helfen? Ich steige da nicht mehr durch.
Danke.

[xtra]

Warum brauchst du da ein <a>?
Das macht aus semantischer Sicht doch gar keinen Sinn und ich bezweifle dass ein <a> ohne href und ohne name durch die Vaidierung durch kommen wird.

Mit else sieht das dann so aus (ungetestet, sollte aber passen):

<ul class="<?php echo $this->level; ?>">
<?php foreach ($this->items as $item): ?>
<?php if ($item['isActive']): ?>
<li class="active<?php if ($item['class']): ?> <?php echo $item['class']; ?><?php endif; ?>"><span class="active<?php if ($item['class']): ?> <?php echo $item['class']; ?><?php endif; ?>"><?php echo $item['link']; ?></span><?php echo $item['subitems']; ?></li>
<?php else: ?>
<li<?php if ($item['class']): ?> class="<?php echo $item['class']; ?>"<?php endif; ?>><?php if(strpos($item['class'], 'nonavlink')):?> <span <?php if ($item['class']): ?> class="<?php echo $item['class']; ?>"><?php else: ?> <a href="<?php echo $item['href']; ?>" title="<?php echo $item['pageTitle'] ? $item['pageTitle'] : $item['title']; ?>"<?php if ($item['class']): ?> class="<?php echo $item['class']; ?>"<?php endif; ?><?php if ($item['accesskey'] != ''): ?> accesskey="<?php echo $item['accesskey']; ?>"<?php endif; ?><?php if ($item['tabindex']): ?> tabindex="<?php echo $item['tabindex']; ?>"<?php endif; ?><?php if ($item['nofollow']): ?> rel="nofollow"<?php endif; ?><?php if ($item['target']): ?> onclick="<?php echo $item['target']; ?>"<?php endif; ?>><?php endif; ?><?php echo $item['link']; ?><?php if(strpos($item['class'], 'nonavlink')): ?></span><?php else: ?></a><?php endif; ?><?php echo $item['subitems']; ?></li><?php endif; ?>
<?php endforeach; ?>
</ul>

Dann musst du nur per CSS die spans anfahren

[Sleepers]

ok, mit dem <a> hast du wohl recht, da macht ein span semantisch wohl mehr Sinn.
Wobei ich bis jetzt immer ein <a> verwendet habe um im css nicht extra das span gestalten zu müssen.
Werde es in zukunft aber auch mit dem <span> machen.

Dein Code funktioniert leider nicht. Da wird nur der erste Menupunkt angezeigt.
Ich starre da jetzt seit 2 Std drauf und werde irgendwie nicht schlau draus.

Ich brauche halt zwingend ein weiteres element was sich im <li> befindet.
Da <span> ja semantisch korrekt ist, müßte es genauso sein wie bei einem aktiven Link, nur eben mit nonavlink.
Sprich, wenn Klasse 'nonavlink' dann mach aus dem <a> ein <span>.

Es wäre echt super wenn du mir da nochmal helfen könntest.

[psren]

Vielleicht hilft das Wiki (Navigationspunkte nicht verlinken) weiter?

[Sleepers]

Perfekt!

Das ist genau das was ich gesucht habe! Vielen Dank!!!

Frage mich nur warum ich das nicht gefunden habe

Wie war das, "man muss nicht alles wissen, man muss nur wissen wo es steht"

[psren]

Das stimmt!
In Zeiten des Internets ist es nicht mehr so wie früher, dass man die Fachbücher kennen und das wissen muss. Dafür gibt es Google...

Aber keine Sorge ich habs auch erst bei der dritten Suchanfrage gefunden

[Monic49]

Hallo Contao-Freunde,
ich habe selbiges Problem bei MenuMatic, dass das Template nav_MenuMatic.tpl nutzt. Hat jemand schon dieses Template erfolgreich geändert? Leider kenne ich mich in php nicht aus :-(
Gesucht habe ich auch, aber nichts gefunden... puh..
Freue mich über Hilfe sehr.

Gruß Monic49

[MacKP]

Hallo Monic49,
da gibts dann direkt das nächste Tutorial: http://de.contaowiki.org/Navigations...icht_verlinken

Aber: da wirst du sicher einiges am CSS und eventuell auch JS abändern müssen, damit das MenuMatic noch funktioniert.

Viele Grüße

[Monic49]

Hallo Monic49,
da gibts dann direkt das nächste Tutorial: http://de.contaowiki.org/Navigations...icht_verlinken

Aber: da wirst du sicher einiges am CSS und eventuell auch JS abändern müssen, damit das MenuMatic noch funktioniert.

Viele Grüße

genau! dieser Link bezieht sich ja auf das Original-Template nav_default.tpl, was ja für das MenuMatic bereits geändert vorliegt.
Schade..

Vielen Dank MacKP

[MacKP]

Ja, dann brauchst du das ja nur zusammen mischen.
Einfacher wirds für dich glaube ich, wenn du das Template von 'Navigationspunkt nicht verlinken' nimmst und dann anpasst.

Beim MenuMatic wird nur bei dem ersten ul das hier gemacht:

<ul <?php if ($this->level == 'level_1'): ?>id="nav"<?php endif; ?> class="vlist <?php echo $this->level; ?>">

Dadurch bekommt die erste Ebene die ID 'nav'

Nach dem <?php else: ?> von Aktiven Links wird einfach noch mal alles von aktiven Links genommen, damit auch inaktive Links verlinkt sind...

Mehr macht das nicht. Du brauchst also das Template nur so anpassen, das du den Teil mit <span> genau so aussehen lässt wie den Link davor.

Viele Grüße