Een fotoalbum op maat

We gaan nu ons eigen fotoalbum, volledig op maat maken. We hebben hiervoor volgende onderdelen nodig:

·      Views

·      Eva: http://drupal.org/project/eva

·      Node reference url widget: http://drupal.org/project/nodereference_url

·      Colorbox

Normaal gezien hebben we alle modules reeds geactiveerd. Alleen Eva en Node reference url widget zijn nieuwe modules die geďnstalleerd en gedownload moeten worden.

We zullen albums maken die foto’s kunnen bevatten. We moeten dus twee inhoudstypen maken en twee views. De foto’s worden gekoppeld aan een album via de twee nieuwe modules: eva en reference.

Afbeeldingsstijlen

We zullen nu eerst instellen welke verkleiningen we wensen van foto’s.

Ga naar Instellingen – Afbeeldingsstijlen.
Kies voor Stijl toevoegen.
We maken een stijl 400x100 aan, met als instellingen Schalen en Bijsnijden, 400px x 100px.

Deze afbeeldingstijl kiezen we voor onze albums.

We gaan twee nieuwe inhoudstypen maken die we vervolgens aan mekaar linken in views. Zo gaat een album meerdere foto’s kunnen bevatten.


Inhoudstypen

Maak een eerste nieuw inhoudstypen: album.

Geen voorbeeldweergave, niet op de homepage, geen menu, geen auteur/datum tonen, gesloten reacties.

Sla op en ga naar velden beheren.

Voeg een nieuw veld “cover” toe.

Maak er een verplicht veld van en sla op met de standaardinstellingen.

Je kan de velden nog herschikken:

We maken nu een tweede inhoudstype aan: foto.

Geen voorbeeldweergave, niet op de homepage, geen menu, geen auteur/datum tonen, gesloten reacties.

Sla op en ga naar velden beheren.

Voeg een nieuw veld “foto” toe.

Maak er een verplicht veld van en sla op met de standaardinstellingen.

Voeg een nieuw veld “album” toe. Dit is een speciaal veld. Hier moet men een album kunnen kiezen dat reeds aangemaakt werd. Dit wordt mogelijk gemaakt via de module Node reference url widget.

Je moet nu het inhoudstype aanvinken waarnaar gerefereerd wordt: album!

Maak er een verplicht veld van!

Sla op.

Je kan nu albums aanmaken en foto’s toevoegen!

Werken met Views

We moeten nu onze albums kunnen tonen. Hiervoor maken we een view.

Een view “albums” maken

Ga naar Structuur - Views en kies voor Add new view.

Geef de naam album.
We maken een pagina met titel en pad Albums.
Als display kiezen we voor grid of fields.
We maken een menu link, naar een menu naar keuze en knop Albums.

Kies voor Continue & edit.


We voegen het veld cover toe.

Kies de formatter afbeelding, afbeeldingsstijl cover en link naar inhoud.

We voegen de filter Inhoud: Type = album toe.

We voegen een sort criteria toe op Inhoud: Post date (desc).

We checken dat we een full pager als navigatie hebben en een 10-tal items per pagina.

Kies voor Opslaan.

Je kan de albums nu reeds bekijken.

View Fotos

We maken nu een view fotos aan, waarmee we alle foto’s kunnen bekijken.

Ga naar Structuur - Views en kies voor Add new view.

Geef de naam fotos.
We maken een pagina met titel en pad fotos.
Als display kiezen we voor grid of fields.
We maken geen menu link.

Kies voor Continue & edit.

Klik bovenaan op + Add -> entity content. Dit wordt mogelijk gemaakt door de module Eva. Het zorgt dat je de foto’s toont op de albumpagina.

Voeg het veld Inhoud: foto toe. Dit moet het colorbox-effect krijgen.

Voeg een filter Inhoud: Type (foto) toe.

Voeg de sort criteria Inhoud: Post date (desc) toe.

Ga bij Geavanceerd.

Kies bij Entity Type voor Node

Kies bij Bundles voor Album.

Maak een contextual filter op inhoud: Album.

Kies voor Display contents of “No results found”.

Deze contextuele filter zorgt ervoor dat de juiste foto’s bij het juiste album getoond worden.

Sla de view op.

De toepassing is nu klaar! De foto’s verschijnen in het juiste album. Alleen… staat de foto van het album nogal vrij groot bovenaan.

Ga naar inhoudstypen en kies naast album voor weergave beheren.

Zet alle labels op verborgen. Zet de cover op verborgen.

Om nu ook een gewone bezoeker toegang te geven, moet je de toegangsrechten nog aanpassen!

Ga naar Personen. Kies voor Toegangsrechten.

 
 Drupal 7, deel 2- CMS | pagina laatst gewijzigd op 17/07/2011 | Onze cursussen vallen onder copyright!
Zelfstudie.be - gratis cursussen internet, dreamweaver, fireworks, flash, enz. Terug naar vorige pagina