×

php, Web, WordPress

Bild mit Text mergen

30. Dezember 2017

Merge Image mit PHP und GD Bibliothek

Für ein WordPress-Projekt an dem ich für mich arbeite habe ich etwas mit der GD Bibliothek und php herumexperimentiert. Hiermit kann ich per URL-Parameter Text in ein Bild schreiben.

Gedacht war das ganze für ein individuell erstelltes Open-Graph Bild, dass dann z. B. bei Facebook eingelesen werden kann. Das möchte ich etwas intuitiver lösen können. Von dem Dynamic Dummy Image Generator weiß ich dass das machbar ist.

Nach etwas Googeln habe ich dann herausgefunden, dass sich das über die GD Bibliothek lösen lässt. Hierzu habe ich ein Quellbild das ich laden kann, es ist möglich die Schriftart als Font-Datei anzufügen und neben der Positionierung des Textes, kann ich auch noch dessen Schriftfarbe bestimmen. 

Der Code

<?php 
// Definition des Dateityps 
header('Content-type: image/jpeg'); 

// Quellbild 
$jpg = imagecreatefromjpeg('images/merge.jpg'); 

// Textfarbe 
$white = imagecolorallocate($jpg, 255, 255, 255); 

// Definition der Schriftart mit einer ttf 
$font = 'fonts/ZillaSlab-Regular.ttf'; 

// Text aus der URL nehmen
$text = $_GET['text']; 

// Text auf das Bild setzen. Quellbild, Schriftgröße, Rotieren, X, Y, Farbe, Schriftart, Text 
imagettftext($jpg, 50, 0, 400, 250, $white, $font, $text); 

// Bild an Browser übergeben 
imagejpeg($jpg); 

// Cache löschen 
imagedestroy($jpg); 
?>

Jetzt kann ich einfach die URL der PHP-Datei aufrufen und per URL-Parameter den Text anhängen. Wichtig ist, dass die php-Datei als eigenständige Datei vorliegt.

https://gimsech.de/bildtest.php?text=Text

Das Ergebnis

Testbild

Unzufrieden bin ich noch damit, dass der Text weder umbricht, noch sich in der Größe ändert. Damit habe ich das Problem, dass zu lange Texte einfach aus dem Bild rutschen. [gelöst: siehe Tipp 4]

Tipps

  1. Um zu überprüfen, ob die GD Bibliothek überhaupt auf dem Server installiert ist, kann man den Code von hier nutzen.
  2. Ich werde jetzt die bestehende Lösung des „Dynamic Dummy Image Generators“ nutzen. Hier kann man sich alles als MIT-Lizenz bei Github laden. Russell Heimlich hat sich da schon einige Gedanken mehr darüber gemacht, was passieren soll wenn der Text länger wird.
  3. PHP for kids hat ein paar Beispiele in Kapitel 10 zur GD Bibliothek.
  4. Hier habe ich einen Codeschnipsel gefunden, der mir dabei hilft den Text zu zentrieren und einen Umbruch zu erzeugen.
  5. Und hier gibt es einige weitere PHP Tutorials für Anfänger.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.