logoEen project van Gert Uphoff.

Ignite handleiding versie 1.6

Artikelindex

Waarom Ignite Gallery ?

N.B.: Dit is versie 1.6 van de handleiding. Voor opmerkingen of vragen kunt u altijd even Dit e-mailadres wordt beveiligd tegen spambots. JavaScript dient ingeschakeld te zijn om het te bekijken..

Tot nu toe werd gebruik gemaakt van RokGallery. Nadat Adobe besloot om Flash niet langer te ondersteunen moesten de meeste Browsers stoppen met het ondersteunen van Flash. In 2021 zal dat gebeuren. Daarnaast is het voor een extensie als RokGallery noodzakelijk om afbeeldingen te laden en slices te genereren via Flash. Kortom, RokGallery is niet langer in staat foto's te laden. Een goede aanvulling is Ignite Gallery die voor Korenonline is aangeschaft en op de sites van de abonnees geïnstalleerd kan worden. Een dergelijke installatie zal worden voorzien van een categorie, een aantal belangrijke profielen, bijgewerkte Nederlandse taal bestanden, een font voor watermerken en wat demo fotomateriaal. In overleg kan een "koor-eigen" set foto's ingebracht worden.
Daarnaast wordt deze handleiding beschikbaar gesteld.

N.B.: Dit betekent niet dat RokGallery verwijderd dient te worden. Al de huidige functionaliteit kan, zolang u geen nieuwe afbeeldingen hoeft te laden, gebruikt worden en blijven. Ignite Gallery is dus bedoeld om nieuwe galerijen te maken met nieuw materiaal of galerijen te vervangen omdat ze moeten worden aangevuld.

Een Nederlandse taal bestand is aanwezig; sommige vertalingen waren belabberd c.q. hanteerden geen voor Joomla! gebruikelijke termen. Ik heb die zo goed mogelijk aangepast.
Een toelichting op diverse gebruikte terminologie:

  • Lightbox: met lightbox wordt de pop-up bedoeld die opent als u op een bepaalde afdeling klikt. De pop-up bedekt de oorspronkelijke pagina.
  • Menu: Met het samenstellen van een menu - bestaande al dan niet uit een grote afbeelding met al dan niet dia afbeeldingen - kunt u de pop-up afbeeldingen bereiken. Klik op zo'n dia om de pop-up op te roepen. Ook de lightbox pagina kan voorzien worden van een menu met dia's. U kunt ook een galerij maken zonder lightbox. Daarnaast kan ook een klein menu rechtsboven in een afbeelding ingesteld worden.
  • Lazy loading: is een instelling die ervoor zorgt dat de afbeeldingen op een website pas laden zodra deze “in beeld moeten zijn”.
  • Label: met Label wordt Tag bedoeld. U kunt aan een afbeelding een of meerdere tags toevoegen die op zich indien toegevoegd aan een profile als menu kunnen dienen.
  • Categorie: Categorie wordt gebruikt i.p.v. Galerij.
  • Thumbnail: Spreek uit als: tump-neel. Een verkleinde weergave (miniatuurafbeelding / dia) van een afbeelding. Aan de hand van die dia (de term die in deze handleiding wordt gehanteerd) kunt u snel zien om welk bestand het gaat. 

Inleiding

Voor het maken van b.v. een fotoalbum zijn 3 stappen noodzakelijk. Dit is hetgeen dat in hoofdlijnen moet gebeuren.

  1. Eerst dient u een profiel aan te maken. Op de website van Ignite Gallery staan diverse video's die de mogelijke instellingen toelichten. Deze zijn deels vertaald in deze handleiding opgenomen.

    N.B.: Tip: maak een aantal basis profielen. Die kunt u vervolgens eenvoudig kopiëren en aanpassen om bij een bepaalde categorie te gebruiken.

  2. Vervolgens moet u een categorie aanmaken of kopiëren. Gebruik een zinvolle naam; koppel er een van uw profielen aan.

    N.B.: Let wel op: kopieer alleen lege categorieën om te voorkomen dat de afbeeldingen mee gekopieerd worden.

  3. Nu kunt u foto's laden. Selecteer eerst de categorie waarvoor ze bestemd zijn.
    U kunt de foto's stuk voor stuk laden, meerdere tegelijkertijd en zelfs een complete map in een keer laden.

Hoofdstuk 1: Een eerste kennismaking.

Maak een nieuw profiel voor de galerij

Open de component Profielen. Kies de optie Nieuw Profiel, geef deze een naam en bewaar hem.
Via de 7 van de 8 tabbladen kunnen alle instellingen van een galerij gedaan worden.

Het tabblad Algemeen bevat een aantal basis instellingen die voor de galerij van belang zijn. De volgorde waarin de foto's getoond dienen te worden is van belang. Vanzelfsprekend ook een gewenste instelling van Toegang.
Vervolgens 4 tabbladen die van belang zijn o.a. als u uw foto’ s van een menu met dia's wilt kunnen bekijken.

De 3 lightbox tabbladen zijn t.b.v. de instellingen die gebruikt zullen worden indien een afbeelding in lightbox.

Maak een nieuwe categorie (galerij)

Open de component Categorieën een nieuwe categorie, geef deze een naam, kies bij Hoofd de optie Boven en bij Profiel het profiel dat u wilt gebruiken. Via Hoofd kunt u de nieuwe categorie als subcategorie koppelen aan een andere reeds bestaande categorie. N.B.: U mag later altijd van profiel wisselen !
U kunt een omschrijving in de rubriek Beschrijving meegeven. In de rechter kolommen staan extra mogelijkheden. Sommige zijn zelf verklarend; andere kunt u later proefondervindelijk vaststellen. Sla uw werk op en vergeet niet de categorie te publiceren.

Afbeeldingen toevoegen

  • Kies Afbeeldingen en vervolgens een door u aangemaakte categorie. U kunt nu via het grijze vlak een of meerder afbeelding (en zelfs een complete map met inhoud) voor het laden aangeven. Geef vervolgens via de knop opdracht om het materiaal te laden. Er is geen limiet aan het aantal afbeeldingen die u klaar gezet hebt om te laden. Zij worden stuk voor stuk geladen dus het kan even duren …
    Aan een afbeelding kunt u diverse gegevens toevoegen. Gebruik de knop Bewerken. Ook is het mogelijk een of meerdere Youtube video’s toe te voegen. Speciale aandacht voor de mogelijkheden die onderaan de pagina staan. Zo kunt u b.v. reeds aanwezige afbeeldingen naar een andere categorie verplaatsen of kopiëren Met label wordt overigens het Joomla! begrip Tag bedoeld. Enkele tips:
  • Leg op uw bureau een map aan met daarin de foto's. Zorg dat zij fatsoenlijke bestandsnamen hebben (die kunt u dan desnoods op de foto projecteren).
  • Van de bestandsnaam, waar spaties b.v. wel zijn toegestaan, wordt de extensie weggelaten. Ook bijzondere tekens worden weggelaten of vervangen. Handig ook als ze als basis dienen voor op volgorde waarin u ze getoond wilt hebben zijn.
  • Aan een afbeelding kan een beschrijving en/of meerdere tags meegegeven worden. U kunt de volgorde van de foto's veranderen via het linker versleep icoon. Bevestig wel de ingestelde volgorde via het icoontje rechts boven in de menubalk van de afbeeldingen.

N.B.: Verklein uw afbeeldingen tot een redelijk formaat b.v. maximaal 1200px breed en/of maximaal 800px hoog.

Een menu item voor de galerij maken

Hiervoor kunt u de normale Joomla! aanpak volgen: kies een menu en voeg een nieuw Item toe.
Kies bij het aan te maken nieuwe item voor Toon categorie.


Hoe maak je een Masonry raster.

  1. Maak een nieuw profiel aan en geef het profiel een naam.
  2. Kies het tabblad Hoofd afbeelding en zet het tonen van een grote afbeelding af.
  3. Kies het tabblad Hoofd Dia's. Hierop worden alle instellingen gedaan.
  4. Voor de raster willen we een lage maximumbreedte en een hoge hoogte b.v. 300 en 800.
  5. Kies nee bij Verkleinen tot gelijke afbeeldingen.
  6. Kies bij Layout van dia's Responsive en Passend in kolommen.
  7. Bewaar het profiel.
  8. Ken het profiel toe aan een Categorie. (Maak desnoods eerst een nieuwe Categorie en laad die met afbelddingen.

N.B.: Bekijk het resultaat op uw website. Misschien moet u eerst nog een menu-item aan maken. Volg de normale Joomla! procedure.


Hoe maak je een Justified raster.

  1. Maak een nieuw profiel aan en geef het profiel een naam.
  2. Kies het tabblad Hoofd afbeelding en zet het tonen van een grote afbeelding af.
  3. Kies het tabblad Hoofd dia's. Hierop worden alle instellingen gedaan.
  4. Voor de raster willen we een hoge maximumbreedte en een lage hoogte b.v. 800 en 300.
  5. Kies nee bij Verkleinen tot gelijke afbeeldingen.
  6. Kies bij Layout van dia's Responsive en Justified.
  7. Bewaar het profiel.
  8. Ken het profiel toe aan een Categorie. (Maak desnoods eerst een nieuwe Categorie en laad die met afbeeldingen.

N.B.: Bekijk het resultaat op uw website. Misschien moet u eerst nog een menu-item aan maken. Volg de normale Joomla! procedure.


Hoe maak je een Metro raster.

  1. Maak een nieuw profiel aan en geef het profiel een naam.
  2. Kies het tabblad Hoofd afbeelding en zet het tonen van een grote afbeelding af.
  3. Kies het tabblad Hoofd dia's. Hierop worden alle instellingen gedaan.
  4. Voor de raster willen we een een even hoge als brede instelling hanteren b.v. 20 en 250.
  5. Kies ja bij Verkleinen tot gelijke afbeeldingen.
  6. Kies bij Layout van dia's Responsive en Metro.
  7. Bewaar het profiel.
  8. Ken het profiel toe aan een Categorie. (Maak desnoods eerst een nieuwe Categorie en laad die met afbeeldingen.

N.B.: Bekijk het resultaat op uw website. Misschien moet u eerst nog een menu-item aan maken. Volg de normale Joomla! procedure.


Over afbeeldingen.

  • Alle afbeeldingen die zichtbaar zijn in de frontend-galerijen worden opgeslagen in images/igallery/resized/.
  • Als u enkele instellingen in het profiel wijzigt, maakt de extensie nieuwe afbeeldingen met de nieuwe grootte of met het nieuwe watermerk enz.
  • De oude afbeeldingen worden niet verwijderd. De reden waarom de oude afbeeldingen niet worden verwijderd, is dat de module of plug-in ze misschien nodig heeft, en de galerij kan niet van tevoren bepalen waar de plug-in/module wordt gebruikt en op welke manier. De module kan bijvoorbeeld een willekeurige module voor afbeeldingen zijn.
  • Als u de profielinstellingen veel hebt gewijzigd, worden er onnodige afbeeldingen opgeslagen in images/igallery/resized/. Om ruimte te besparen, kunt u de images/igallery/resized map verwijderen. Ignite zal deze map opnieuw maken en alle juiste mappen/afbeeldingen in deze map opnieuw maken wanneer de frontend-galerijen worden bekeken. De eerste weergave van elke frontend-galerij zal dan mogelijk iets trager zijn omdat de afbeeldingen opnieuw worden gemaakt.
  • Verwijder geen van de andere mappen, zoals images/igallery/originel/. Daar worden n.l. de originele afbeeldingen bewaard ! Verwijderen van originelen doet u uitsluitend via de mogelijkheid die de component biedt.
  • U kunt ook dezelfde breedte en hoogte kiezen en bijsnijden aan/uit voor de dia van de hoofdgalerij en voor de dia van de lightbox. Dus als u bijvoorbeeld in de profielinstellingen de dia van de hoofdafbeelding instelt op 300 breed en 200 hoog en ja instelt voor bijsnijden op hetzelfde formaat, dan kunt u ook de lightbox instellen op 300 breed en 200 hoog en ja voor bijsnijden op dezelfde grootte. Er wordt dan slechts 1 afbeelding in dia formaat gemaakt en deze wordt gebruikt in de hoofdgalerij en de lightbox galerij.
  • U kunt ook dezelfde breedte en hoogte kiezen en bijsnijden aan/uit voor de afbeelding van de hoofdgalerij en voor de lightbox afbeelding. Dus als u bijvoorbeeld in de profielinstellingen de hoofdafbeelding instelt op 1200 breed en 800 hoog en ja in stelt voor bijsnijden op hetzelfde formaat, dan kunt u ook de lightbox afbeelding instellen op 1200 breed en 800 hoog en ja voor bijsnijden op de zelfde maat. Er wordt dan slechts 1 afbeelding gemaakt en deze wordt gebruikt in de hoofdgalerij en de lightbox galerij.

Aanvullende algemene informatie

  1. U kunt ook op de voor Joomla! gebruikelijk manier modules aanmaken.
  2. Via de button Galerij, onder aan het invoer vak van de JCE editor, kunt u een galerij in een artikel invoegen.
  3. Bij het aanmaken van een profiel is het mogelijk, via  allerlei instellingen, uw galerij aantrekkelijk te maken. Vooral de mogelijkheid om het top menu van de lightbox weergave (rechts boven) goed te benutten is een nuttige aanvulling. Te denken valt hierbij aan het instellen van sociale media buttons, vergrootglas icons en af/aan zetten van de downloaden. U vind de instellingen op de tabbladen Hoofd overig en Lightbox overig.

De achtergrond van de lightbox pagina's veranderen.

Daarvoor dient uw custom.css pagina van de template voorzien te worden. Regel dat desnoods met de webmaster van Korenonline.
De rgba kleur codering is hier wit, de transparantie is op 0,8 ingesteld.

.igui-lightbox{
background-color:rgba(255,255,255,0.8)!important;
color:#999999!important;
}

.ig-lightbox-descriptions, .ig-thumb-scroller-lbox{
background-color:transparent!important;
}

Galerijen verplaatsen naar een andere website

Galerijen kunnen van de ene website naar de andere worden verplaatst. Hiervoor heeft u toegang nodig tot PhpMyadmin, en natuurlijk ook toegang tot uw webhosting file manager via b.v. FileZilla.

  • Op de nieuwe site mag geen Ignite Galerij zijn geïnstalleerd !
  • Ga naar uw webhosting file manager (b.v. FileZilla), kopieer de images/igallery map van de oude site naar de nieuwe site. De locatie op de nieuwe site is gelijk aan de oude site.
  • Ga naar PhpMyadmin, ga naar de database voor de oude site, exporteer de vijf tabellen met igallery in de tabelnaam. Deze hebben een unieke database_voorvoegsel en vervolgens: _igallery, _igallery_comments, _igallery_img, _igallery_profiles en _igallery_ratings. U dient deze tabellen exporteren.
  • Ga naar de database van de nieuwe site, kies de import link bovenaan en importeer de 5 tabellen.
  • Hernoem tabellen zodat deze hetzelfde database_voorvoegsel hebben als de nieuwe databasetabellen.
  • Installeer de component Ignite Gallery met alle galerij onderdelen op de nieuwe site (zorg dat ze gepubliceerd zijn).
  • Mogelijk moet u bij de categorieën de gebruiker opnieuw instellen. Anders krijgt u foutmeldingen.

Watermerken met een ttf bestand toevoegen.

U kunt een ttf-lettertype bestand uploaden naar administrator/components/com_igallery/fonts/ map en vervolgens de tekst waarmee u wilt schrijven invoegen in de profielinstellingen - tabblad Algemeen. U kunt elk ttf-bestand gebruiken, zie websites zoals https://fonts.google.com/ voor gratis ttf-bestanden. De bestandsnaam van het door u gekozen font dient u te wijzigen in font.ttf.
U kunt b.v. dit bestand downloaden (Google's Monserat font) en nadat u het bestand uitgepakt hebt uploaden. 

En verder ...

  • De plugin RokBooster kunt u tijdens het ontwikkelen beter afzetten.
  • Als u de knop Galerij in een aangepaste module wilt gebruiken moet u op het tabblad Opties de optie Bewerk inhoud op Ja zetten.

 

Inlogformulier