TRImax documentatie

voor developers


Upload foto's via Cloudinary

Deze methode vervangt de eerste manier om foto's te uploaden naar een map op de webserver zelf; de eerste methode is nog steeds aanwezig in TRImax.
Via Cloudinary kan dit gebruiksvriendelijker. Het uploaden gebeurt naar de server van Cloudinary die als CDN (Content Delivery Network) geconfigureerd is en daardoor zeer snel content kan aanleveren.
In Cloudinary is het mogelijk meerdere foto's tegelijkertijd via drag & drop te uploaden. In Cloudinary hoeft de gebruiker zich geen zorgen meer te maken over het formaat van de foto's in de upload, Cloudinary levert foto's aan de website die naar het juiste formaat geconverteerd worden en dit zonder vertragingen.

Principes in websites die met TRImax gebouwd zijn

  • er zijn geen settings nodig in de $config van TRImax
  • per project wordt een eigen account aangemaakt bij Cloudinary, met login in de vorm: project.cloudinary@trios.be
  • indien er fotoreeksen gebruikt worden op de website, worden die in mappen georganiseerd, zie voorbeeld van Legend Motors hieronder

image

naamgeving van foto's in een fotoreeks

De foto's in een fotoreeks krijgen een naam die aan strikte regels moet voldoen:

  • elke foto in Cloudinary in een bepaalde reeks (vb. auto's) moet een unieke naam hebben die in geen enkele andere map nogmaals mag voorkomen
  • de foto start met het numeriek ID van de map, dan een min-teken en dan een volgnummer dat start bij 01 en maximaal kan oplopen tot 99
  • de volgnummers kleiner dan 10 moeten met twee cijfers weergegeven worden, dus 51-01.jpg en niet 51.1.jpg
  • de extensie moet .jpg zijn in kleine letters

Voorbeeld: 51-11.jpg

Legend Motors voorbeeld

Vaak zal in de code van de webapplicatie volgende of gelijkaardige code gebruikt worden:

$map="autos-" . str_pad($id, 4, "0", STR_PAD_LEFT);
$img="$id-" . str_pad($foto, 2, "0", STR_PAD_LEFT) . ".jpg";
$aantalfotos=$arrresult[0]['fotos'];     // afkomstig van *Airtable*

Een foto verkleinen

In het voorbeeld uit de website van Legend Motors wordt de width naar 800 herleid.

http://res.cloudinary.com/legendmotors/image/upload/c_scale,w_800/v1/$map/$img'> 

Een foto uitsnijden

http://res.cloudinary.com/legendmotors/image/upload/c_fill,g_center,h_300,w_450/v1/$map/$img