Rullgardinsmeny - drop down (ej responsiv sida)

Det är möjligt att få till, men det kräver en hel del pyssel. Mer om det är en responsiv sida med responsiv meny. (detta är för om du INTE har ett annat utseende på din meny när du tittar på sidan i mobilen)

Steg 1 är att kopiera meny-koden öppna med fördel anteckningar och lägg informationen där. 

Högerklicka på din sida, ta visa källa eller visa sidkälla. I chrome fungerar även ctrl+U. 

Väl där letar du upp 

<ul id="nav"> ... </ul><br>

Kopiera och spara undan allting som står där. 

Justera adresserna så att det i stället för www.dinadress.se/ blir ##home_url##

<ul id="nav">
	<li id="active"><a>Hem</a></li>
	<li><a href="##home_url##sida1">Sida 1</a></li>
	<li><a href="##home_url##sida2">Sida 2</a></li>
	<li><a href="##home_url##sida3">Sida 3</a></li>
	<li><a href="##home_url##kontakt">Kontakt</a></li>
</ul>

Därefter ska vi justera första hem-länken. 

<ul id="nav">
	<li><a href="##home_url##">Hem</a></li>
	<li><a href="##home_url##sida1">Sida 1</a></li>
	<li><a href="##home_url##sida2">Sida 2</a></li>
	<li><a href="##home_url##sida3">Sida 3</a></li>
	<li><a href="##home_url##kontakt">Kontakt</a></li>
</ul>

Justeringen görs genom att ta bort " id="active"" och lägga till " href="##home_url##""

Därefter går du till egen mall (var i menyn den ligger beror på när du skapade din sida. 

https://www.username.n.nu/admin/custom-template.php

Se efter så att du * inte* har koden "##responsive_navigation##" i din mall, har du det behöver ytterligare saker fixas. 

För att kunna se vilken sida besökare är på i menyn behöver följande läggas ovan "##statistics##"
<script>
var currentURL = window.location.href;
var menu = document.getElementById('nav');
menuLi = menu.getElementsByTagName('li');
recursiveElements(menuLi, currentURL);
function recursiveElements(menu, uri) {
  if (menu.length > 0) {
    for (var i = 0; i < menu.length; i++) {
      link = menu[i].getElementsByTagName('a');
      if (link.length > 0) {
        if (link[0].href == uri) {
          menu[i].id = "active";
        } else {
          recursiveElements(menu[i], uri);
        }
      }
    }
  }
}
</script>
##statistics##
Sådär, nu har du en meny som fungerar som den gjorde nyss. 
Underlänkar läggs till genom att skapa nya listor innanför <li></li>. 

Såhär: 

Du måste sätta ner förälderns </li> och lägga den nya listan däremellan:

<ul id="nav">
	<li><a href="##home_url##">Hem</a></li>
	<li><a href="##home_url##sida1">Sida 1</a></li>
	<li><a href="##home_url##sida2">Sida 2 med drop down</a>
	<ul>
		<li><a href="##home_url##undersida1">UnderSida 1</a>
		<li><a href="##home_url##undersida2">UnderSida 2</a>
		<li><a href="##home_url##undersida3">UnderSida 3</a>
	</ul>
	</li>
	<li><a href="##home_url##sida3">Sida 3</a></li>
	<li><a href="##home_url##kontakt">Kontakt</a></li>
</ul><br>

Detta kommer att skapa en undermeny. Beroende på vilken mall du har kan den se helt OK ut, eller bli katastrof. Blir det katastrof kan Support hjälpa dig med det. Det finns för många mallar för 

Se till att alla sidor du länkar till finns (eller skapas) som sidor i "extra undersidor". 

Behöver du fortfarande hjälp? Kontakta oss Kontakta oss