Flickr is zonder twijfel de grootste en beste fotografiewebsite op internet. Er zijn veel widgets, badges en plug-ins waarmee u uw nieuwste Flickr-foto's op uw website kunt weergeven, maar we gaan nog een stap verder door rechtstreeks op Flickr te tikken en uw fotostream te integreren in uw website, waardoor u een fotogalerie krijgt is een fluitje van een cent om te updaten.

We zullen deze fotogalerij maken met behulp van de Flickr API en phpFlickr. Als de letters 'A, P & I' voldoende zijn om angst in je hart te krijgen, maak je geen zorgen, we zullen het rustig aan doen en volledige codevoorbeelden geven die je kunt kopiëren.

Flickr heeft onlangs ook The App Garden gelanceerd, een showcase van gereedschappen, speelgoed en sites die de Flickr API gebruiken om iets nuttigs of leuks te bieden. Zodra u de API begrijpt, kunt u uw verbeelding een nieuwe manier laten zien om het te gebruiken en uw app in te dienen.

Voor deze tutorial veronderstel ik dat je al een Flickr-account hebt en toegang hebt tot een server die PHP en PEAR uitvoert.

De omtrek

• Download een Flickr API-sleutel
• Download de phpFlickr-bestanden
• Bouw een galerijpagina om onze miniaturen weer te geven (met paginering)
• Maak een fotopagina om onze foto's te tonen (met vorige en volgende navigatie)

Stap 1 - Krijg een Flickr API-sleutel

Uw API-sleutel is uw eigen unieke reeks cijfers en letters die u toegang verlenen tot de Flickr-services. Ga hier naartoe: http://www.flickr.com/services/apps/create/apply/

Hier moet u beslissen of u Flickr gaat gebruiken voor commerciële of niet-commerciële doeleinden. Flickr geeft goede uitleg over welke je moet kiezen, de kans is groot dat je een niet-commerciële API-sleutel nodig hebt, wat ik kies voor deze demo.

Volg de stappen en vul al uw gegevens in.

U zou dan uw unieke sleutel moeten krijgen die zal verschijnen als een reeks willekeurige getallen en letters zoals:

Je ziet ook een nummer met de naam 'Geheim;' negeer dat voor nu. Voor deze oefening hebben we alleen de sleutel nodig; maak er een notitie van, want we hebben het binnenkort nodig.

Als u de API gebruikt om later een coole tool of site te bouwen, wilt u mogelijk alles wat u in de Flickr App Garden bouwt, indienen en toevoegen. U kunt klikken op 'App-details bewerken' om de info in te vullen.

Besteed bijzondere aandacht aan de tips en adviezen in de API-gebruiksvoorwaarden en de communityrichtlijnen. Als u deze misbruikt, raakt u deze kwijt.

Nu naar de spannende dingen ...

Stap 2 - Download phpFlickr 

phpFlickr is een project van Dan Coulter. Het is een klasse geschreven in PHP die fungeert als een verpakking voor de API van Flickr. De bestanden verwerken de gegevens die door Flickr worden geleverd en retourneren arrays in PHP, die we gebruiken om onze foto's weer te geven

We moeten de bestanden downloaden die we later in onze webpagina zullen opnemen en zullen al het gecompliceerde werk voor ons doen. Ga naar phpflickr.com of ga rechtstreeks naar de downloadpagina op Google Code. In deze demo gebruiken we het zip-bestand: phpFlickr-2.3.1 (zip)

Download en pak het uit. Voor deze zelfstudie hebben we alleen de PEAR-map en het phpFlickr.php-bestand nodig. Upload de bestanden naar uw webdirectory

Stap 3 - Basisinstellingen en eenvoudige configuratie  

Nu hebben we alles wat we nodig hebben om verbinding te maken met Flickr en onze foto's op te halen. We maken twee pagina's: een om onze miniaturen weer te geven en een om de foto weer te geven. Alle code is beschikbaar als volledige pagina's aan het einde van de zelfstudie.

Deze codevoorbeelden werken allemaal op basis van het feit dat uw bestanden zich in de hoofdmap van uw server bevinden - of allemaal in dezelfde map. Voor alles moeten we een cachemap maken om ervoor te zorgen dat phpFlickr correct werkt. Maak een map met de naam 'cache' in uw webdirectory en geef het schrijfbare rechten (CHMOD 777).

Nu gaan we een pagina maken waarop onze miniaturen worden weergegeven en die een aantal eenvoudige paging heeft. In de voorbeeldgalerij is dit index.php - en ziet het er zo uit.

Voordat we verder gaan, moeten we twee hoofdvariabelen instellen in het bestand config.php.

Open config.php. U zult zien dat er gewoon om twee dingen wordt gevraagd: uw API-sleutel en uw Flickr-gebruikersnaam.

Voer eerst uw API-sleutel in - de lange willekeurige reeks cijfers en letters die u eerder door Flickr hebt gekregen. Houd uw informatie binnen de aanhalingstekens.

// voeg uw API-sleutel toe $ key = "VOER UW FLICKR API-SLEUTEL HIER IN";

Nu voor uw Flickr-gebruikersnaam; dit is niet je Yahoo-inlognaam of je Flickr-schermnaam - maar de gebruikersnaam die je voor Flickr zelf gebruikt. Om te controleren, logt u in bij Flickr en bekijkt u bovenaan de pagina waar staat 'Aangemeld als ...' - dat is uw gebruikersnaam. Dus laten we onze gebruikersnaam als een variabele declareren:

// vul uw Flickr-gebruikersnaam in $ username = "YOUR FLICKR USERNAME HERE";

Sla de wijzigingen op in config.php en upload - u zou dat bestand niet meer nodig moeten hebben.

Stap 4 - De pagina Miniaturen maken

Op naar de pagina zelf. Hier is een uitsplitsing van wat we aan het begin van de pagina doen, waarin alles wordt aangegeven dat klaar is voor de actie:

We gaan enkele vorige en volgende links opnemen met een klein beetje code verderop op de pagina. De miniaturen die we gaan tonen, zijn afhankelijk van de pagina waarop we ons bevinden, dus we voeren een eenvoudige if-instructie uit die ons paginanummer zal pakken. Als er een 'fpage'-query in de url staat, gebruik die dan. Zo niet, dan staan ​​we op pagina één.

 
 Vervolgens nemen we het kernbestand phpFlickr op dat alles heeft wat we nodig hebben om met Flickr te communiceren.
 
// inclue het kernbestand require_once ('phpFlickr.php');
 
 Nu starten we een nieuwe klasse op vanuit het phpFlickr-bestand met behulp van onze API-sleutel die we eerder hadden.
 
 // Start de hoofd phpFlickr-klasse op $ f = new phpFlickr ($ key);
 
 phpFlickr gebruikt caching om het proces te versnellen. Er zijn opties om een ​​databasetechniek te gebruiken, maar voor deze tutorial gebruiken we de eenvoudigere cachemap-optie. We hebben een map nodig met de naam 'cache' die schrijfbaar is, wat betekent dat het systeem er toegang toe heeft en de inhoud kan wijzigen. Stel hiervoor de rechten van de mappen in op 777 via uw FTP-programma. Vervolgens voegen we deze regel toe om deze in te schakelen: 
 
$ f-> enableCache ("fs", "cache");
 
 We noemen de methode people_findByUsername die een array retourneert:
 
$ result = $ f-> people_findByUsername ($ gebruikersnaam);
 
 Vanuit die array hebben we ook uw unieke gebruikers-ID nodig (uw Flickr-ID ziet er zo uit: 11221312 @ N00, hier aangegeven als $ nsid), wat we zo krijgen:
 
// pak onze unieke gebruikers-id uit de $ result array $ nsid = $ result ["id"];
 
 Vervolgens noemen we de methode people_getPublicPhotos, die opnieuw een array retourneert die we $ foto's zullen noemen. In deze regel passeren we ook onze id die we hierboven in de regel hebben genoemd ($ nsid). NULL verwijst naar de optie 'extra's' waar we ons nu niet mee bezighouden. We vermelden ook het aantal miniaturen dat we willen weergeven (21) en gaan door de pagina om te beginnen ($ pagina), die teruggaat naar de $ -paginavariabele vanaf de bovenkant van de pagina:
 
 $ photos = $ f-> people_getPublicPhotos ($ nsid, NULL, NULL, 21, $ pagina);
 
 Het laatste beetje dat we nodig hebben om de pagina in te stellen, is een klein beetje informatie die we nodig hebben om de paging te laten werken. We hebben toegang tot de array met $ foto's die we hierboven hebben gemaakt en halen het totale aantal pagina's tevoorschijn, plus het totale aantal foto's in onze fotostream:
 
$ pagina's = $ foto's [foto's] [pagina's]; // geeft het totale aantal pagina's $ totaal = $ foto's [foto's] [totaal]; // geeft als resultaat hoeveel foto's er in totaal zijn?>
 
 Merk op dat we de php sectie hier afsluiten met de?> Nu hebben we alles wat we nodig hebben om de eerste 21 thumbnails van onze Flickr-fotostream te krijgen en ze weer te geven. We gaan nu door met de pagina, wat html toevoegen, PHP gebruiken om de afbeeldingen weer te geven en enkele eenvoudige paging-links toevoegen. Dus laten we beginnen met het schrijven van een aantal basis html. 
 
        
Mijn fotogalerij
 
 
 Hier is niets buitengewoons; gewoon het instellen van de html en het starten van een gebied voor de miniaturen. De volgende stap is om onze div genaamd 'duimen' te vullen met onze thumbnails, zoals:
  
 Merk op dat we php opnieuw openen met  
 We gebruiken een foreach-lus om door de array met $ foto's te lopen en naar het foto-element ($ foto) te gaan, dat de informatie bevat die we nodig hebben voor de miniaturen.
Zie de opmerkingen in de code voor een uitleg van wat er gaande is: 
 
 buildPhotoURL ($ photo, "Square"). "\" width = \ "75 \" height = \ "75 \" alt = \ "$ photo [title] \" /> "; // close link echo" "; // end loop?>