Dreamweaver - CS3

Les 51: Sjablonen (6)

51/58 Lessen 

Herhalingsgebied (2)

In de vorige les hebben we gezien hoe we een herhalingsgebied toevoegden aan een sjabloon.

In deze les ga ik je uitleggen hoe we de verschillende artikelen gaan toevoegen aan een nieuwe pagina die is gekoppeld aan dit sjabloon.

Hoe we een sjabloon koppelen aan een nieuwe pagina hadden we reeds gezien in les 47.
In dit voorbeeld laat ik je zien hoe het ook anders kan.

In het deelvenster “Bestanden” selecteer je het tabblad “Middelen”. In de menubalk aan de linkerzijde klik je de knop “Sjablonen”.
Dit geeft een lijstje met alle sjablonen die we reeds hadden gemaakt.

Rechtsklik het sjabloon “producten”, en kies “Nieuw van sjabloon” in het drop-downmenu.

Dit geeft ons een nieuwe pagina die voorzien is van het sjabloon “producten”.
Ik sla deze pagina op onder de naam catalogusNieuw.html

Zoals je kunt zien in onderstaande afbeelding hebben we bovenaan het herhalingsgebied een aantal knoppen. We hebben het plusteken, het minteken, en we hebben het naar onderwijzend en bovenwijzend pijltje.
Het plusteken dient om rijen (lees producten) toe te voegen.
Het minteken dient om tabellen te verwijderen.
Met de pijltjestoetsen kunnen we de volgorde van de verschillende rijen (lees producten) wijzigen.

OK, we gaan wat artikelen toevoegen.
In de verschillende “bewerkbare gebieden”, titelProduct, prijsProduct, en omschrijvingProduct, typ je de gegevens van het artikel.
De foto is in dit geval juist, dus klik ik het plusteken om een volgend artikel toe te voegen.

Voor het volgende artikel typ ik terug de verschillende “bewerkbare gebieden” in, maar hier moeten we ook de foto aanpassen.
Selecteer hiervoor eerst de foto, en klik dan de knop “zoeken naar bestand” in het eigenschappenvenster. Navigeer en selecteer de foto die toehoort aan het artikel, en klik de knop OK.

Dit wijzigt de foto.

Als alle artikelen zijn ingevoegd bekijk je het resultaat in de Browser.

Dit even terzijde, voor ik het resultaat bekeek in de Browser had ik de opmaak van het sjabloon “product” nog wat gewijzigd. Bovenste rij lichtjes donkerder, en de prijzen rechts uitgelijnd.
In de volgende les gaan we eens zien wat we kunnen doen aan pagina’s die zijn verbonden met het sjabloon “product”, maar waarin we toch niet de zojuist ingegeven artikelen willen weergeven.

Opgelet!
Vergeet niet de weergave van de knop “Catalogus” in de navigatiebalk aan te passen voor deze nieuwe pagina. Als ik de afbeelding hierboven bekijk, ben ik dit blijkbaar vergeten.
Mocht je niet meer weten hoe je dit doet, lees dan even les 49 opnieuw.

Formidabel U hebt Les 51 voltooid START VOLGENDE LES