Navigatiemenu

[FredK]

Ik ben van plan om een website te maken die zou kunnen uitgroeien naar > 50 pagina's. Er moet ook een navigatiemenu komen, die uit rond de 25 items gaat bestaan. Vroeger heb ik wel eens gespeeld met frames en dan stond het menu in een frame en de tekstpagina in het andere frame. Voordeel is dat wijzigingen in het navigatiemenu één keer gemaakt hoeven te worden. Mijn vraag is: kan dat eigenlijk ook anders? Maar dus niet zo dat het menu op elke pagina komt te staan, want dan moet elke wijziging in het menu op elke pagina aangebracht worden. Kan dit met bijv. css?

[leroy]

Je gaat dan echt iets moeten gebruiken zoals PHP.

Er zijn heel veel opties om wat jij wilt te kunnen maken. De meest simpele optie is om een menu.html bestand te maken met daar het hele menu in.

Op elke pagina waar het menu moet komen kun je dan in PHP de volgende regel plaatsen:

<?php require_once("menu.php"); ?>

Met bovenstaande PHP code kun je het bestand inladen. Zo hoef je maar 1x het menu te maken. Pas je het menu aan, dan past het overal aan waar je die code neer zet.

Om die code heen kun je nog van allerlei andere HTML code plaatsen zoals je header bijvoorbeeld

<div class="header">
</div>
<?php require_once("menu.html"); ?>
<div class="website">
</div>

Je kunt natuurlijk ook de header in een header.html pagina plaatsen en dit ook daar mee doen

<?php require_once("header.html"); ?>
<?php require_once("menu.html"); ?>
<div class="website">
</div>

Een andere optie (en misschien wel het beste) is om een CMS systeem te gebruiken zoals wordpress, drupal, joomla, etc. Mijn voorkeur gaat uit naar wordpress omdat het vrij makkelijk in gebruik is.

Je kunt een template (layout) downloaden welke jij denkt dat geschikt is, en deze desnoods wat aanpassen. Aanpassen kan vaak ook gewoon in wordpress zelf zonder aan de html, css of php code te komen. Denk dan aan bijvoorbeeld het verplaatsen van menu's of secties van een pagina, etc.

Wil je lekker knutselen en meer van PHP te weten komen zou ik kiezen voor de eerste optie, dat is zeker goed om te leren. Voor meer informatie over die functie die ik gebruik (require_once) kun je terecht op php.net

Alle andere functies en code worden daar ook netjes uitgelegd.

17 september 2014 aangepast door leroy

[FredK]

Leroy, zeer bedankt. Ik ga hiermee aan de slag. Ik wil me meer in css en nu ook php verdiepen dus kies ik voor de eerste optie.

[leroy]

Mocht je nou nog meer over PHP en CSS willen opdoen zou ik ook eens kijken naar w3schools.

Uiteindelijk als je meer van PHP af weet, merk je dat je vaak dingen elke keer opnieuw moet gebruiken of maken. Je gaat dan een soort eigen framework maken. Niet aan beginnen! Er zijn hele goede frameworks om mee te werken. Een aantal frameworks zal ik hier opsommen:

FatFreeFramework (F3)

Makkelijk framework voor kleine projecten. Je moet veel eigen code schrijven, maar logica kan je in het framework programmeren zoals de Navigatie van je URL: /blog/{category}/{item}

CodeIgniter

Wat moeilijker framework voor middel tot grote projecten. Gebasseerd op MVC (Model, View, Controller). Je moet minder eigen code schrijven en er zijn veel helper functies om bijv. een plaatje of een link te maken: site_url("/blog/nieuws/3", "Dit is de overschreven titel")

Symfony2

Geavanceerd framework voor alle soorten projecten. Veel functies en hulpmiddelen om héél snel te programmeren. Dit is ook een MVC structuur, maar dan erg geavanceerd. Je maakt hierbij gebruik van allerlei vendor bundels (een soort plugins) zoals bijvoorbeeld:

- doctrine2 bundel (voor databases)

- twig bundel (voor HTML elementen snel op te maken)

- FOSUserBundel (voor in te kunnen loggen)

- BootstrapBundel (om bootstrap te kunnen gebruiken)

- etc. etc.

Mijn mening:

Ik zou beginnen met zelf code te schrijven om het te leren. Begin bijvoorbeeld met het maken van een eigen gastenboek met als opslag een tekstbestand (zo ben ik ook begonnen). Maar ik zou zeker niet lang wachten om framework(s) te gebruiken. Dit maakt het programmeren echt makkelijker. Waar ik voorheen 1.000 regels code gebruikte gebruik ik er nu nog maar 200.

Ik ben zelf begonnen om in codeigniter te programmeren, maar dat was voor mij niet toereikend genoeg. Veel te veel eigen code, en problemen zijn niet goed op te sporen naar mijn mening (maar dat was een aantal jaar terug).

Daarna ben ik gaan kijken om kleine projecten in FatFreeFramework te maken, dit is een erg simpel en goed framework voor kleine dingen. En voor grotere projecten gebruik ik nu Symfony2 in combinatie met allerlei bundels. Als voorbeeld:

Ik ben begonnen in codeigniter met een project dat duurde zeker een half jaar voordat ik eindelijk iets fatsoenlijks had. In Symfony2 duurde dit 2 tot 3 weken en het was vele malen veiliger en beter om code terug te vinden.

Voor gewone websites die informatie moeten verschaffen gebruik ik gewoon het wordpress CMS. Als je gewone websites moet maken in een framework ben je gewoon veel te lang bezig. Want je moet ook een stuk content management gaan programmeren. Een CMS doet dat al voor je (Content Management System).

[FredK]

Mijn plan is om een vrij simpele website te maken, met links het menu en rechts de content. Van de meeste pagina's heb ik de content al wel. Ook het menu heb ik nu wel ongeveer. Html ken ik en dan is het toch een kwestie van css toepassen om de lay-out voor elkaar te krijgen? De indeling heb ik wel in mijn hoofd. De term framework(s) is nieuw voor mij, ik heb gekeken bij Symfonie maar het is me toch niet duidelijk wat een dergelijk programma precies doet en dus toevoegt.

[leroy]

Een framework voegt heel veel functionaliteiten toe als het gaat om dingen te programmeren, maar omdat je daar nog niet bent zou ik me daar nu nog niet veel druk om maken. Vandaar ook hetgeen wat ik erbij vertelde:

Ik zou beginnen met zelf code te schrijven [...] Maar ik zou zeker niet lang wachten om framework(s) te gebruiken

Als je naar PHP code gaat kijken ga je in je website een stukje kennis plaatsen. Net zoals bijvoorbeeld dit forum.

Een framework kan allerlei handigheidjes toevoegen. Als je voorheen een linkje maakte moest je bijv. dit typen:

<a href="http://www.google.be" target="_blank" rel="google">Google</a>

met een framework zou je dit kunnen inkorten naar:

<?php echo link("http://www.google.be", "Google") ?>

Dit is maar één van de mogelijkheden natuurlijk. Een framework houdt zich ook aan soms wat best practices waardoor je daar niet meer over hoeft na te denken, bijv. de beveiliging van je website (voor het inloggen).

Maar nogmaals. ik zou me nog niet al te veel druk maken om frameworks, het was even om aan te tonen als je verder gevorderd bent met programmeren wat je allemaal zou kunnen doen.

[FredK]

Leroy weer bedankt. Ik hou me voorlopig inderdaad bij het werken met html en css. Het inpassen van het html.php bestand is prima gelukt, maar ben ik nu bezig om de 2 div's (die met het menu en die met de eigenlijke content) binnen 1 div te krijgen, die ik dan gecentreerd op het scherm wil krijgen. Dat lukt nog niet, maar het is een leerproces, dus met wat uitproberen moet het uiteindelijk wel gaan lukken. Dat hoop ik tenminste.

[leroy]

Zoiets?

<html>
<head>
<style>
	body{ margin:0; padding:0 }
	#website{ 
		width: 960px;
		margin: 0 auto;
	}
	#menu{
		float:left;
		width:150px;
		background: #CCC;
	}
	#content{
		float:left;
		background: #9a0000;
		width: 810px;
	}
</style>
</head>
<body>
<div id="website">
	<div id="menu">menu</div>
	<div id="content">content</div>
</div>
</body>
</html>

Je kan het ook nog makkelijker doen door gebruik van een CSS "grid systeem" zoals deze: 960 Grid System

Je kunt hiermee door gebruik te maken van classes de breedte bepalen van je div's en naast elkaar zetten etc.

[FredK]

Ja, inderdaad, zoiets....Ik had wel wat geprobeerd, maar was er nog niet uit. Dit is wat ik bedoelde en hier kan ik verder mee. Zeer bedankt.

[FredK]

Inmiddels ben ik aardig op weg, wel heb ik nu nog een vraag. Ik heb nu in feite 2 pagina's (navigatiemenu en de content) binnen één pagina. Elk van deze 2 pagina's heeft een eigen titel. Normaal heeft elke pagina een GTML tag (document type)? Waar plaats ik die nu? Eén bij elke pagina of is één keer in hoofdpagina voldoende?