D1 les 04

Afbeeldingen

In een eerste gedeelte gaan we de presentatie van afbeeldingen op de site verbeteren. Daarna zullen we het administrator gedeelte gebruiksvriendelijker maken.

Site gedeelte

Colorbox

Ik zoek naar colorbox. Een tooltje om een foto als miniatuur voor te stellen en als lightbox te laten vergroten.

Gevonden. Deze modules zijn wat bij Joomla extensies zijn.

Als ik wil inschakelen wordt ik tegengehouden door de melding dat er iets ontbreekt. Libraries. Ok. Op zoek naar libraries in deze modulepool.

Gevonden.

Ik installeer en activeer.

Nu moet ik nog de software gaan halen. De colorbox leidt mij naar deze site.

Deze inhoud moet ik unzippen en in een juiste map deponeren. Ik moet zelf nog sommige mappen aanmaken.

Vanaf nu kan ik bij de inhoudstypes, hier artikel. Het afbeeldingsveld instellen als Colorbox.

Ik kan zelf bepalen hoe groot het getoonde afbeeldingske en hoe groot de popup moet worden.

We testen het uit.De lightbox heeft ook verschillende instellingen....

Nu gaan we onze Drupal wat gebruiksvriendelijker instellen om als administrator met afbeeldingen te werken.

Admin gedeelte

Dit gedeelte is drastisch gewijzigd ten opzichte van een paar maanden geleden... De media module is zo gewijzigd dat ondergetekende er zowat een dag aan besteed heeft om de vernieuwingen en bugs!!  te bestuderen. Gebruik in geen geval meer de IMCE plupload. Het stoort zowat alles.. Op  zulke momenten benijd ik mijn neef. Hij geeft Latijn... Die gasten geven al 2000 jaar hetzelfde..

Bij het installeren van MD foto features hebben we tal van modules moeten installeren... Media was er één van. Een belangrijke tool. We bekijken ze nu eens in detail.

Als we de nieuwste versie belijken dan zien we dat er veel mogelijkheden werden gecreëerd. We zetten voorlopig enkel Media actief.

Als we nu via Inhoud=> Bestanden=>Thumbnails kijken, dan kunnen we mooi alle bestanden zien. Als je eerst de thumbnails als grijze symbolen ziet, dan moet je wachten tot de volgende cron. Alles komt goed..

Media (= bestanden) toont alle mediabestanden (jpg, gif, png,..) die in de rootmap en hun submappen voorkomen. De submappen worden echter niet als mappen getoond! De map reisfotos komt dus niet voor in het overzichtje, wel wat er in zit.

Deze Media module heeft ook een interface om vanaf nu in een inhoudstype, media te integreren. Merk op dat 'Media browser' als widget ingesteld staat.

Zo ziet de widget er uit:

Men kan in media kiezen en invoegen (vergeet niet tot onderaan te gaan om de submit knop te zien);

Tot hier toe konden we enkel één bestand tegelijk uploaden... Drupal heeft ook een mogelijkheid om meervoudige bestanden up te loaden. Installer deze modules. Ze zorgen er voor dat je met dezelfde uploadwidget, nu meervoudig kunt selecteren.

Schakel de widget in voor het inhoudstype.

Proberen maar...

Afbeeldingsgalerijen

We gaan 2 galerijen bespreken. Een eerste populiare galerij voorstelling is Juicebox.

Het geeft een mooi beeld van de afbeeldingen. Merk ook de mogelijkheden op om te vergroten enz..

Na installatie moet je eerst hun gerief in de libraries steken. Lees dit eerst...

Het resultaat:

Dan pas activeren. Als je dat eerst had gedaan moet je de cash flushen. Je kunt ook de flash kussen, maar dat helpt niet.

De mogelijkheden bij de instellingen zijn enorm. Er zijn geen algemene instellingen. Ze staan bij de inhoudstypes bij het veld van je afbeeldingen.

Een voorbeeldje:

Tenslotte... er is ook nog een andere populaire module: Gallery formatter. Probeer deze eens uit. Ze heeft geen third party afhankelijkheden.

 

Project vierde les

In deze vierde les gaan we aandacht schenken aan afbeeldingen en de manier waarop we ze voorstellen. We zijn al in staat om een afbeeldingstijl in te stellen, maar als er meerdere afbeeldingen in een veld voorkomen zijn er wel mooiere manieren om dit te presenteren. We gaan gebruik maken van Colorbox en Juicebox om de afbeeldingen voor te stellen en van een multiupload mogelijkheid om de verschillende foto's tegelijkertijd op onze server te brengen. Tevens gaan we een soort verkenner voor onze afbeeldingen installeren (Media) om van daaruit beter onze afbeeldingen beheren.

We komen ook voor de eerste keer in contact met modules die 'third party' zijn. Dit wil zeggen dat er na installatie ook nog via een FTP programma (vb Filezilla) extra mappen en bestanden moeten worden op de server gebracht worden.

We installeren eerst Multiupload field en Multiupload widget. We kunnen hiermee meerdere afbeeldingen tegelijkertijd in een veld aanbrengen. Installeer en activeer.

Maak nu een inhoudstype 'recepties' met een body en een afbeeldingsveld (zet op meerdere afbeeldingen)

Vanaf nu kan je met CTRL of met SHIFT, meerdere bestanden selecteren en uploaden. (ze moeten wel in een veld zitten. Via IMCE gaat dit niet). Voeg een tweetal recepties toe en maak met views een overzichtje en een menulink.

Nu gaan we de colorbox installeren.

Als ik wil inschakelen wordt ik tegengehouden door de melding dat er iets ontbreekt. Libraries. Ok.

Ik installeer en activeer. Nu moet ik nog de software gaan halen. De colorbox leidt mij naar deze site.

Deze inhoud moet ik unzippen en in een juiste map deponeren. Ik moet zelf nog sommige mappen aanmaken. Het moet dus in de map sites/all/libraries/colorbox komen. Als deze laatste map niet aanwezig is, moet je die aanmaken.

Vanaf nu kan ik bij de inhoudstypes, hier artikel. Het afbeeldingsveld instellen als Colorbox.

Ik kan zelf bepalen hoe groot de getoonde afbeelding en hoe groot de popup moet worden.

Het resultaat:

Installeer nu de module 'Media'. Je ziet dat er nu bij inhoud dit verschijnt:

Wat resulteert in: (soms moet je een beetje waxchten tot de cache bijgewerkt werd.)

Via deze interface kan je de bestanden beheren (verwijderen, bijwerken,..)

Maak nu een nieuw inhoudstype aan: 'feesten', gelijkaardig aan 'recepties' qua input.

Installeer juicebox. En laad de third party bestanden en mappen op.

Het geeft een mooi beeld van de afbeeldingen. Merk ook de mogelijkheden op om te vergroten enz..

Na installatie moet je eerst hun gerief in de libraries steken. Lees dit eerst...

Ik vertaal...

1. Libraries hebben we al.

2. Ga naar hun site en pak uit.

3. Gebruik enkel de map jbcore en zet die over via FTP. (kijk in welke map)

4. Activeer

Het resultaat:

Dan pas activeren. Als je dat eerst had gedaan moet je de cash flushen. Je kunt ook de flash kussen, maar dat helpt niet.

Nu kan je de galerij bij de weergave instellen:

Later gaan we nog andere galerijen voorstellen..

Nu je kunt werken met FTP kan je ook je afbeeldingen vervangen in de map van het best responsive theme. Doe dit thuis... Het zal toch regenen deze week. Let op dat je in je eigen map bezig bent!