Tutoriál PHP: Ako si vytvoriť jednoduchú navigáciu pre dynamickú webovú stránku

Tutoriál PHP: Ako si vytvoriť jednoduchú navigáciu pre dynamickú webovú stránku

Pri statických webových stránkach (HTML/CSS) sa pri prekliknutí na podstránku vymení podstránka s hlavnou stránkou. Nejde o nič výnimočné. Problém nastáva vtedy, keď je potrebné niečo na stránku doplniť alebo pozmeniť. Predstavme si situáciu, že máme webové stránky, kde okrem hlavnej stránky je niekoľko podstránok. Aby sa dalo z každej podstránky dostať na hlavnú stránku, aby sme sa vedeli preklikávať medzi jednotlivými podstránkami, musíme mať umiestnené navigačné menu s odkazmi okrem hlavnej stránky aj na všetkých podstránkach. Ak by sme chceli doplniť ďalšiu podstránku, okrem jej zhotovenia je potrebné vytvoriť na túto podstránku príslušný odkaz - link a umiestniť ho ako na hlavnú stránku, tak aj na všetky podstránky. Dosť veľa práce.

Preto si v tomto článku ukážeme jednoduchý navigačný systém, pri ktorom využijeme konštrukciu switch() na zabezpečenie preklikávania obsahu podstránok, ktorý sa externe načíta pomocou príkazu "include".
Potrebujeme si pripraviť nasledujúce súbory a zložku:
1) index.php
- hlavná stránka, obsahuje doctype, meta značky, hlavičku a telo webovej stránky. Bude obsahovať navigačné menu s troma odkazmi a priestor, kde sa bude pomocou konštrukcie switch() meniť obsah podstránok
2) adresár s názvom podstranky - bude obsahovať tri podstránky:
- kontakty.php
- ponuka.php
- default.php

Kód v súbore index.php vyzerá takto:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Hlavná stránka</title>
</head>
<body>

<!--hlavné menu www stránky-->
<header>
	<nav>
    	<a href="index.php?id=default">domov</a>
        <a href="index.php?id=ponuka">ponuka</a>
        <a href="index.php?id=kontakty">kontakty</a>
    </nav>
</header>

<?php
	switch ($_GET['id'])
	   {
		   default:
		   include "podstranky/default.php";
		   break;

		   case "ponuka":
		   include "podstranky/ponuka.php";
		   break;

		   case "kontakty":
		   include "podstranky/kontakty.php";
		   break;
		   
	   }

?>
</body>
</html>

Ako to funguje?
V prvom rade si všimnime ako je tvorený odkaz. Ten má tvar <a href="index.php?id=ponuka">ponuka</a>. Cesta v atribúte href je tvorená stránkou, prostredníctvom ktorej sa bude externý obsah načítavať, čiže index.php. Nasleduje otáznik a za otáznikom nasleduje tzv. identifikátor - id. Ten je v každom odkaze rovný inej hodnote. Hodnota je vlastne názov odkazu bez diakritiky. Ale môže tam by vlastne čokoľvek. Prostredníctvom identifikátoru v odkaze bude konštrukcia switch() vedieť, akú podstránku má zobraziť. Po kliknutí na odkaz v menu sa do URL adresy v prehliadači zobrazí celá adresa atribútu href. Pomocou metódy na prenos informácií $_GET[ ] sa hodnota identifikátora id dostane do konštrukcie switch (), kde sa otestuje a podľa hodnoty identifikátora id switch nájde príslušnú vetvu case, ktorej názov sa zhoduje s názvom id, ktorý sa momentálne nachádza v $_GET[ ]. Každá vetva obsahuje príkaz include, pomocou ktorej sa načíta obsah externého súboru, čo je v našom prípade konkrétna podstránka.
Ešte je dôležité zdôrazniť skutočnosť, že príkaz include pripája kompletný obsah podstránok. Preto by podstránky nemali obsahovať doktype, hlavičku ani telo. To je už obsiahnuté v hlavnej stránke index.php a po načítaní podstránky by sa zobrazili dvakrát.
Súčasťou tohto článku je príloha so zdrojovými kódmi tohto príkladu.

Rubriky: