Så använder du Timthumb i WordPress

Timthumb är ett PHP skript för att göra olika storlekar av en bild som finns på din webbserver. Timthumb är lanserat som öppen källkod och här tänkte jag gå igenom steg för steg hur du använder det i ditt WordPress tema. Det exempel jag kommer gå igenom förutsätter att du använder dig av Custom Fields (egna fält) i WordPress. Ett bra användningsområde kan tex vara ifall du vill ha en bild till varje bloggpost, men bilden ska vara olika stor på olika sidor.

1. Installera skriptet

Börja med att ladda hem källkoden till Timthumb.php och spara den i ditt temas mapp. Skapa också en mapp där och döp den till ”cache”. Kom ihåg att det är viktigt att mappen är skrivbar ifrån servern så sätt korrekta rättigheter.

2. Använd Custom Fields

1. Börja med att ladda upp bilden i den post du vill använda.
2. Lägg till ett nytt ”Custom Field (eget fält) och sätt namnet till ”picture”.
3. Värdet i det här fältet ska vara adressen till bilden du nyss laddat upp.

3. Anrop ifrån WordPress

Nu ska vi ta och anropa Timthumb skriptet ifrån vårt WordPress-tema. I den fil och på den plats i koden du vill infoga en bild skriver du följande:

<?php
$picture = get_post_meta($post->ID, 'picture', true);
<img src="<?php bloginfo('template_directory'); ?>/timthumb.php?src=<?php echo $picture; ?>&h=150&w=150&zc=1" alt="<?php the_title(); ?>" width="150" height="150" />
?>

Det första som händer här är att vi sparar undan adressen till bilden genom att använda oss av det egna fältet ”picture” och sparar undan det i variabeln $picture. Nästa sak vi gör är att skapa en bildtagg och som värde till dess src attribut sätter vi sökvägen till Timthumb skriptet. Efter det följer en querystring ”src” som har värdet av variabeln innehållandes adressen till bilden ($picture) och det sätts även värden för h (height) och w (width) följt av zc (zoomcropping).

Sammanfattning

När det här anropet så körs kommer det att skapas en ny bild av din ursprungliga med de värden som du nyss satt. Behöver du mer hjälp att förstå vad skriptet gör så besök Timthumb supportforum.

Du har kommit till slutet av inlägget

Tyckte du inlägget var intressant? Läs dessa också:

Boktips – PHP Objects, Patterns and Practice

Skrivet 10 augusti - 2009 Postat i: Tutorials