Dynamická stránka s PHP include (pre absolútnych začiatočníkov s PHP)

Každého z nás, ktorí robíme webové stránky, a hlavne tých z nás, ktorí začali len nedávno, určite zaujíma, či sa obyčajná statická stránka v HTML dá nejak vylepšiť tak, aby s ňou nebolo toľko roboty (zmena rovnakých údajov na mnohých stránkach...).

Úvod

Každého z nás, ktorí robíme webové stránky, a hlavne tých z nás, ktorí začali len nedávno, určite zaujíma, či sa obyčajná statická stránka v HTML dá nejak vylepšiť tak, aby s ňou nebolo toľko roboty (zmena rovnakých údajov na mnohých stránkach...). Je vhodné robiť statické stránky do tých, povedzme 5 podstránok. Tých 5 podstránok je vhodných preto, že keď si napr. dáte nejakých 10 linkov na jednu a potom zistíte, že by ste ich radi mali aj na ostatných piatich, je dosť možné, že pri úprave piatich podstránok si ešte nevytrháte vlasy a hravo to zvládnete. Predstavte si ale, že by ste takto mali pridať tie isté odkazy na 20 stránok, čo potom? Potom už radšej prejdete na dynamický web, avšak, existuje mnoho stránok, ktoré aj pri takýchto, ba možno aj vyšších počtoch stránok stále fungujú staticky.

Už dlhú dobu je tu pre nás PHP, ktoré nám poskytuje možnosti, ktorými je možné robiť naše stránky dynamickými, no a preto si dnes o jednom zo spôsobov, ako urobiť svoju statickú stránku dynamickou, povieme.

PHP include

Z angličtiny vieme, že slovo „include“ v slovenčine znamená zahŕňať, obsahovať atď., čiže tento kód v podstate do stránky, v ktorej je vložený zahrnie obsah určitého súboru. Lepšie však bude, keď si funkciu PHP include vysvetlíme na nejakom praktickom príklade.

Máme vytvorený súbor index.php, ktorý má nejakú hlavičku, menu, sidebar a footer.

<div id="header">
    <h1>Nadpis stránky</h1>
</div>
    <ul id="navigation">
        <li><a href="#">Nav link 1</a></li>
        <li><a href="#">Nav link 2</a></li>
        <li><a href="#">Nav link 3</a></li>
    </ul>
<div id="content">
    <p>Obsah stránky</p>
</div>
<div id="sidebar">
    <ul id="partners">
        <li><a href="#">Partner 1</a></li>
        <li><a href="#">Partner 2</a></li>
        <li><a href="#">Partner 3</a></li>
    </ul>
</div>
<div id="footer">
<p>
    Copyright © 2009 - 2011 Firma s.r.o.
</p>
</div>

My potrebujeme, aby sme mali na každej stránke rovnaké menu, sidebar a footer. Najprv si musíme vytvoriť tri súbory, osobitne pre každú časť stránky, ktorú chceme includovať. Vytvoríme si teda súbory navigation.php, sidebar.php a footer.php.

Začnime navigáciou. Potrebujeme, aby sa nám linky nášho menu zobrazovali medzi značkami elementu ul, čiže všetkých potomkov (li elementy a ich priamich potomkov a elementy) skopírujeme do súboru navigation.php, ktorý by teraz mal obsahovať toto:

<li><a href="#">Nav link 1</a></li>
<li><a href="#">Nav link 2</a></li>
<li><a href="#">Nav link 3</a></li>

A teraz miesto elementov li a a do elementu ul vložíme náš php include kód v tomto tvare:
<?php include('navigation.php'); ?>.

Náš kód by mal teraz vyzerať nasledovne:

<ul id="navigation">
    <?php include('navigation.php'); ?>
</ul>

Po uložení a spustení súboru vidíme ako nám PHP-čko pekne naincludovalo naše menu linky do úvodnej stránky (index.php).

A teraz si týmto istým spôsobom naincludujeme aj ostatné časti stránky, ktkoré potrebujeme mať dynamické. Postup by vám už mal byť známy, ale pre istotu pridávam kód pre všetky časti stránky.

Include pre sidebar

V našom prípade máme v sidebar-e vložený jeden netriedený zoznam, ktorý je potomkom elementu div s id sidebar, ktorý drží celý náš bočný panel pokope. Čiže, vytvoríme si subor sidebar.php, do ktorého teraz nevložíme len li elementy z netriedeného zoznamu, ale celý netriedený zoznam! Možno sa niekto pýta prečo? Lebo keby sme tam element ul nechali a potom doň náš php include vložili, celý obsah súboru sidebar.php by sa includoval medzi tagy elementu ul, čiže celý sidebar by bol jeden netriedený zoznam a to my nechceme. Teraz by náš kód v súbore index.php mal vyzerať nasledovne:

<div id="sidebar">
    <?php include('navigation.php'); ?>
</div>

Teraz, keď máme v našom navigation.php súbore vložený náš netriedený zoznam, skúsme si tam pridať ešte nejaký div s textom a triedený zoznam ol. A po stustení nám to PHP-čko znova pekne naincluduje do stránky.

No a nakoniec, týmto istým spôsobom vytvoríme aj include pre footer:

<div id="footer">
    <p><?php include('footer.php'); ?></p>
</div>

Keď máme toto všetko hotové a všetko nám funguje ako má, skúste vytvoriť ďalšiu stránku, napr. navlink2.php a v súbore navigation.php na ňu do druhého linku pridajte odkaz. Čo sa stalo? Odkaz na súbor navlink2.php teraz nájdete na každej stránke, ktorá ma includovaný súbor navigation.php ako menu. Tým pádom sme sa dopracovali k výsledku tohto tutoriálu, či si už vytvoríte takto stránku s dvomi alebo dvadsiatimi podstránkami, veci, ktoré máte v každej z nich includované pomocou PHP, budete meniť v požadovanom súbore už LEN RAZ, o zvyšok sa postará dynamika :).

Nakoniec ešte jeden screencast ako to celé funguje. Toto video je môj prvý screencast vôbec, tak aj vyzerá (berte to s rezervou :))