Archief van categorie ‘PHP’

Screenshots bij je links

dinsdag 28 juli 2009

Op veel pagina’s zie je tegenwoordig een screenshot bij een link staan. Voor wie in de veronderstelling is dat de webmaster op print-screen heeft gedrukt en het plaatje geupload heeft naar de server: dit is (hopelijk) niet het geval!

Er zijn op internet diverse diensten te vinden die dit vervelende klusje voor je willen opknappen. Een klein overzichtje vindt je bijvoorbeeld op http://sharebrain.info/articles/the-best-free-screenshot-services/2366/

Omdat voor een van onze projecten dergelijke functionaliteit nodig is, ben ik hier eens wat dieper ingedoken. Uiteindelijk kwam ik terecht bij http://webthumb.bluga.net/, een web-based dienst van Joshua Eichorn, een bekende naam in het PHP-wereldje.

We hebben dit als volgt geimplementeerd:

  • De bezoeker vraagt een thumbnail-url op, bijvoorbeeld: http://www.example.com/thumb/12345.jpg
    Het script wat hier achter verstopt zit, kijkt op het bestandssysteem of de thumb al gemaakt is. Is dit het geval, dan wordt deze natuurlijk netjes geserveerd.
  • In het geval dat de thumbnail nog niet gemaakt is, wordt in de database een vlaggetje omgezet, nl. screenshot_status=pending
  • Een achtergrond proces (daemon of cron-job) leest alle url’s uit met dit betreffende vlaggetje, en maakt vervolgens de webthumb-api-url voor het plaatje. Hier komt nog even wat php-werk bij kijken, omdat er een api-key en hash-code nodig zijn. Maar de handleiding helpt hier uitstekend bij.
  • Als het plaatje is gemaakt, wordt status op “available” gezet en werkt het naar behoren.

Het voordeel van deze aanpak is dat er geen afbeeldingen worden gemaakt die toch niet opgevraagd worden. We hebben overigens ook de mogelijkheid om thumbnails te “regeneraten”.

Voor 30.000 credits betaal je bij deze dienst 50 dollar, omgerekend 36 euro en een beetje. Mocht je minder dan 100 screenshots per maand maken, dan is het zelfs geheel gratis.

Wat mij betreft: een aanrader!

Genereer zelf Sitemaps

woensdag 11 februari 2009

Heb je eindelijk na dagen, weken, maanden ploeteren een fatsoenlijke website in elkaar geknusteld, vol met de laatste snufjes conform de eisen van de web 2.0 websurfer (jQuery, FLIR image replacement, shadowbox, je eigen videoconverter a la Youtube, uiteraard XHTML correct, meertalige SEO vriendelijke URL’s) dan zou eigenlijk het hele internet alles uit hun handen moeten laten vallen en meteen naar je website moeten komen kijken.

Wat heb je aan een fatsoenlijke website als niemand er komt kijken? Bar weinig en daarom heb je natuurlijk een heleboel handige tools en weetikwat’s om je site te promoten.

Een goed begin is het maken van een degelijke sitemap. Sitemaps ze komen eigenlijk in 2 smaken, een gebruikersvriendelijke variant en een voor de zoekmachines/webcrawlers (zonder opmaak):

  • De HTMLvriendelijke; zie je vaak bij uitgebreide websites om bezoekers te helpen wegwijs te worden op de website. Alle beschikbare pagina’s staan er op.
  • Een voor Webcrawlers; die de website dan makkelijker kunnen doorlopen en indexeren, met o.a. een prioriteitstag, hoe belangrijk de pagina is. Wanneer de pagina voor het laatst is bijgewerkt

Het maken van een ingebakken Sitemap generator in een website is geen overbodige luxe. En een vaak vergeten functionaliteit. Alle beschikbare pagina’s van een website nalopen kan (afhankelijk van de opbouw van de website) een intensief proces zijn. Gelukkig zijn er ook tools om van buitenaf de website zelf te spideren en een sitemap te maken. Tuurlijk zijn er allerlei ‘handige’ plugins te vinden, maar als het echt wilt hebben zo als jij wilt hebben, dan doe je het zelf. Enter Wget…

Wget is your best friend

Wget is een krachtige unix tool die (ook beschikbaar voor Windows) die via http/ftp allerlei manieren (onderdelen van websites) kan nalopen, downloaden en archiveren. Het kan als spider worden gebruikt of als website mirror dienst, download tool en veel meer. In ons geval gebruiken we Wget om een website na te lopen en dan gevonden interne links ook te volgen. Alle resultaten worden opgeslagen in een log bestand wat we later gaan aanpassen om alle gevonden resultaten uit te filteren. In een console:
wget -m --follow-tags=a --reject=jpg,bmp,png,js,gif,css,flv,pdf,login --no-directories -o spider_results.txt --delete-after -erobots=off http://www.eeble.nl

  • -m = mirror de website
  • follow-tags = a levert alleen de anchor tags op
  • –reject = negeer links met deze woorden in de URL
  • –no-directories = geen lokale kopie van directories aanmaken (scheelt weer ruimte)
  • –delete-after = verwijder bestanden na downloaden (scheelt weer ruimte)
  • -erobots=off = negeer robots.txt

Dit levert een bestand genaamd spider_results.txt waar alle gevonden resultaten in terecht komen. Met een simpel cat opdrachtje wordt de output leesbaar. In een console type:

cat spider_results.txt | grep http://www.eeble.nl | cut -d ' ' -f4 | sort -u

En dat ziet er dan weer zo uit:

http://www.eeble.nl/
http://www.eeble.nl/11/home
http://www.eeble.nl/11/tetris.html
http://www.eeble.nl/13/research.html
http://www.eeble.nl/15/playground.html
http://www.eeble.nl/16/technieken.html
http://www.eeble.nl/17/links.html
http://www.eeble.nl/18/hosting.html
http://www.eeble.nl/1/home.html
http://www.eeble.nl/4/vacature.html
http://www.eeble.nl/6/contact.html
http://www.eeble.nl/blog
http://www.eeble.nl/blog/2008/08
http://www.eeble.nl/blog/2008/09
...

Dan is nog een php script om de resultaten weer te geven als XML bestand:

<php?

$logfile =  sitemap.txt;
if (is_readable($logfile)) {
 if ($links = file($logfile)) {
  if (count($links = array_filter(array_map('trim', $links),'strlen'))>0) {
   sort($links, SORT_STRING);
   $out ="\n
         xmlns:xsi=\"http://www.w3.org/2001/XMLSchema-instance\"\n
         xsi:schemaLocation=\"http://www.sitemaps.org/schemas/sitemap/0.9
         http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd\">\n";
   foreach($links as $link) {
      $num = substr_count($link,'/')-3;
      $out .= " \n ".trim(htmlentities($link))."\n";
      $out .= sprintf("%F\n \n",(1-$num/10*2));
  }
  $out .= "</urlset>";

  //output maken
  header ("content-type: text/xml");
  echo $out;
  exit(0);
 }
}
} else { //404 terug geven
  header("HTTP/1.0 404 Not Found");
  header("Cache-Control: no-cache, must-revalidate");
  header("Expires: Sat, 26 Jul 1997 05:00:00 GMT");
  exit(0);
}
?>

Browsershots

woensdag 13 augustus 2008

Doelstelling is om van een ingevoerde url op geautomatiseerde wijze een afbeelding van de webpagina terug te geven,
Zo’n dergelijke visuele voorstelling levert een extra bijdrage aan de content waar websites bij betrokken zijn.
Er zijn betaalde webservices, zoals thumbshots die deze dienst aanbieden, echter een vereiste is wel dit in eigen beheer te hebben.

Om tot een oplossing te komen worden verschillende mogelijkheden onderzocht. Een mogelijkheid zou zijn om een opensource programma die vanuit linux aangestuurd kan worden te gebruiken die html omzet naar een afbeelding, zoals bijvoorbeeld er ook al reeds toepassingen bestaan om html naar pdf om te zetten. Meer veel van de beschikbare programma’s op dit gebied hebben geen goede html ondersteuning.
De programma’s die dit wel hebben zijn uiteraard de veelgebruikte browsers, maar dit kan niet zomaar op een linux server zonder grafische omgeving draaien.
De oplossing hiervoor heet ‘headless’. Xvfb onder linux zorgt er op de achtergrond voor dat er geen fysiek scherm nodig is om applicaties te draaien die een grafische omgeving vereisen.

Xvfb staat voor: X virtual framebuffer, en plaatst de grafische toepassingen rechtstreeks in het geheugen zonder hier maar ook een grafische kaart of beeldscherm voor nodig te hebben. Het kan meerdere virtuele schermen aanmaken.
Op zo’n virtueel scherm kan elke browser onder linux geopend worden, en vervolgens door imagemagick, een beeldbewerking programma, een screenshot maken.

Een andere toepassing binnen headless Xvfb zou kunnen zijn om openoffice documenten te laten converteren voor Enterprise Content Management (ECM) zoals dit ook door Alfresco wordt gedaan.

Geef je website een facelift

dinsdag 12 augustus 2008

Al enige tijd ben ik bekend met sIFR, een techniek waarbij je bepaalde tekstuele elementen op je pagina kunt vervangen door een specifiek lettertype. Omdat je er bijna niet van uit mag gaan dat iedereen het desbetreffende lettertype in huis heeft, maakt sIFR gebruik van een ingenieus trucje: het lettertype wordt in een flash-movie ingebakken en on-the-fly over je pagina heen geplakt. Hier vindt je een voorbeeld.

Nu kwam ik pas op Ajaxian een variant van sIfR tegen, genaamd Facelift. Met Facelift kun je hetzelfde bereiken als met sIFR, maar dan zonder gebruik te maken van flash. Met behulp van een stukje javascript en een PHP script, wordt de tekst vervangen door een plaatje van die tekst in het juiste lettertype. Voorbeelden vindt je hier.

Implementatie? Fluitje van een cent. Het is een kwestie van downloaden, uitpakken, uploaden en een paar regels code aanpassen aan je eigen wensen. De juiste lettertypebestanden in het mapje, “font-family” instellen en voila, een kind kan de was doen.

Wel liep ik tegen een klein dingetje aan: stokken en staarten in de tekst vormen geen probleem, maar daarvoor moet je wel even in de configuratie sleutelen en de waarde “realFontHeight” op “true” zetten.

Al met al een handige tool om je website net dat beetje meer te geven.

Facelift: http://facelift.mawhorter.net/
sIFR: http://www.mikeindustries.com/blog/sifr/


Eeblog wordt gemaakt door medewerkers van Eeble Internet Innovations