Home
Navigation
Impressum
SEO Welten - Webcoding, Editoren, Scripte und Anwendungen
SEO Welten
Buchempfehlungen
 

Script für sichtbare Wasserzeichen

Transparente Bereiche in Bildern gestalten

Übersicht / Seite:

  1. Hotlinking von Bildern (mit Beispielen für Gegenmaßnahmen)
  2. Text in Bilder einfügen (mit PHP, ImageTTFText und geeigneten Fonts)
  3. Rewrite Regeln (und Bedingungen für die Auslieferung von Images)
  4. Clientseitige Möglichkeiten (zum Austausch von Grafiken)
  5. Ein weiteres PHP-Script (zur Einfügung von sichtbaren Wasserzeichen)

Vorbemerkung

Das auf dieser Seite vorgestellte Script entspricht weitestgehend dem bereits unter Text in Bilder einfügen beschriebenen Script und wurde nur um einige Zeilen für eine erweiterte Aufgabenstellung ergänzt. Allgemeine Hinweise und Einzelheiten zur Funktionsweise des Scripts können Sie auf der verlinkten Seite nachlesen, da wir uns auf dieser Seite mit ergänzenden Hinweisen zum erweiterten Funktionsumfang begnügen möchten.

Ergänzende Hinweise

Gegenüber den bereits vorgestellten Scripts wurde unter anderem der HTTP-Header um eine Zeile ergänzt, die das Datum und den Zeitpunkt der letzten Aktualisierung enthält. Das neue Datum stimmt praktisch nie mit dem bei Expires angegebenen Verfallsdatum überein und der Zeitpunkt des letzten Request liegt gegenüber einem nachfolgenden Request immer in der Vergangenheit. Würde das Datum und der Zeitpunkt von Expires in der Zukunft liegen, könnte der Browser die Datei bis zu dem bei Expires angegeben Zeitpunkt aus dem Cache laden.
Bei den ersten Code-Listings hätte die Angabe von Last-Modified keinen Sinn ergeben, da in den Webseiten die originalen Grafiken referenziert sind und der Server diese bei einer Anfrage vom Browser aus dem Verzeichnis ladet, in dem diese abgelegt wurden, mit den zeitlichen Angaben des Datei-Uploads. Bei der Bildbearbeitung wird vom Browser hingegen das PHP-Script angefordert und nicht die eigentliche Grafik.

Ein weiterer Unterschied bzw. eine Ergänzung des Funktionsumfanges besteht darin, dass nicht mehr das ganze Bild abgedunkelt wird, um einen einzufügenden Text besser hervorzuheben, sondern nur noch ein Teilbereich erhält einen transparenten Hintergrund, wobei die Ecken dieses Teilbereiches abgeschrägt werden. Für die Abschrägung der linkseitigen und der rechtseitigen Ecken wurden zwei Schleifen programmiert.
Weiterhin lässt sich nicht nur die Transparenz des Hintergrundes im gewählten Bereich steuern, sondern auch die Transparenz der Schrift. Durch die Auswahl geeigneter Farben und Stufen bei der Transparenz, könnten somit sichtbare Wasserzeichen für Fotos entworfen werden. Ob sichtbare Wasserzeichen oder Text in transparenten Bereichen, die Größe der Wasserzeichen oder der Bereiche passt sich an die Größe der aufgerufen Grafik an, wenn mit Prozenten gearbeitet wird. Nähere Einzelheiten zu diesen Anpassungen sind den Kommentaren zu entnehmen, wobei die Werte entsprechend angepasst werden können. 

PHP-Script (images-mit-wasserzeichen.php):

<?php

header("Cache-Control: no-cache, must-revalidate");         // neue Anfrage an den Server auslösen
header("Expires: Thu, 01 Jan 1970 00:00:00 GMT");           // Datum in die Vergangenheit verlegen
header("Pragma: no-cache");                                 // zusätzlicher Hinweis für Proxy-Server
header("Last-Modified: ".gmdate("D, d M Y H:i:s")." GMT");  // Datum und Uhrzeit der letzten Aktualisierung

if (isset($_GET["image"]) and !empty($_GET["image"])) {

    $eingang = $_GET["image"];
    $endung  = $_GET["endung"];
    $eingang = preg_replace("/[^a-z0-9_\/-]/i", "", $eingang);
    $endung  = preg_replace("/[^a-z]/i", "", $endung);
    $endung  = strtolower($endung);

    if ($endung == "jpg") {
        header("Content-Type: image/jpeg");
        $image  = imagecreatefromjpeg($eingang.".".$endung);
    }
    if ($endung == "png") {
        header("Content-type: image/png");
        $image  = imagecreatefrompng($eingang.".".$endung);
    }

    $format = getimagesize($eingang.".".$endung);
    $width  = $format[0];
    $height = $format[1];
    $fonts1 = round($width /34);                  // font-size beträgt ein Vierunddreißigstel der Bildweite
    $fonts2 = round($width /26);                  // font-size beträgt ein Sechsundzwanzigstel der Bildweite
    $ablin1 = round(($width /2) - ($fonts1 *2));  // Rechteck ab links / halbe Bildweite minus 2 x font-size
    $abobn1 = round($height /2);                  // Rechteck ab oben / halbe Bildhöhe
    $bisli1 = $width  - ($fonts1 *2);             // Rechteck bis rechts minus 2 x font-size
    $bisun1 = $height - ($fonts1 *2);             // Rechteck bis unten minus 2 x font-size
    $ablin2 = $ablin1 + round($fonts2 *0.8);      // Ausrichtung erste Schriftzeile vom linken Bildrand
    $ablin3 = $ablin1 + round($fonts2 *2.1);      // Ausrichtung zweite Schriftzeile vom linken Bildrand
    $abobn2 = $abobn1 + round($fonts2 *2.5);      // Ausrichtung erste Schriftzeile vom oberen Bildrand
    $abobn3 = $abobn1 + round($fonts2 *5.5);      // Ausrichtung zweite Schriftzeile vom oberen Bildrand
    $mindgr = 150;                                // Mindestabmessungen der Kantenlänge des Bildes in Pixel
    $fontpf = "fonts/SourceSansPro-Bold.ttf";     // Pfad zum Font
    $infos1 = "Weitere Infos erwünscht?";
    $infos2 = "» Hier klicken «";

    $transsch = imagecolorallocatealpha($image, 255, 255, 255, 52);  // Schrift R,G,B, Transparenz
    $transran = imagecolorallocatealpha($image, 52, 46, 36, 52);     // Rechteck R,G,B, Transparenz

    function ARUND($img, $lin, $oben, $unten, $trans) {

        for ($i = $lin+3; $i > $lin; $i--) {$oben++; $unten--;

            imagefilledrectangle($img, $i, $oben, $i, $unten, $trans);
        }
    }

    function BRUND($img, $bis, $oben, $unten, $trans) {

        for ($i = $bis-3; $i < $bis; $i++) {$oben++; $unten--;

            imagefilledrectangle($img, $i, $oben, $i, $unten, $trans);
        }
    }

    if ($width > $mindgr and $height > $mindgr) {

        ARUND($image, $ablin1, $abobn1, $bisun1, $transran);    // Abschrägung der linken Ecken
        BRUND($image, $bisli1, $abobn1, $bisun1, $transran);    // Abschrägung der rechten Ecken

        imagefilledrectangle($image, $ablin1+4, $abobn1, $bisli1-4, $bisun1, $transran);

        /* ------------------------------------------------------------------------------
        Image, Font-size, Drehung 0, Abstand der Schrift von links, Abstand der Schrift
        von oben bis zur Unterkannte der Schriftzeichen, Color, Font mit Pfad, String
        ------------------------------------------------------------------------------ */
        ImageTTFText ($image, $fonts1, 0, $ablin2, $abobn2, $transsch, $fontpf, $infos1);
        ImageTTFText ($image, $fonts2, 0, $ablin3, $abobn3, $transsch, $fontpf, $infos2);
    }

    /*-- Ausgabe für Browser und Speicherung der Version mit Datum --------------------*/

    if ($endung == "jpg") {

        imagejpeg($image);
        imagejpeg($image, $eingang."-version-".gmdate("d-M-Y").".".$endung);   // Zeile 82
    }
    if ($endung == "png") {

        imagepng($image);
        imagepng($image, $eingang."-version-".gmdate("d-M-Y").".".$endung);    // Zeile 87
    }

    imagedestroy($image);
}

?>

Nachfolgend als Beispiel eine Grafik, in der mit dem Script ein transparenter Bereich mit einem Hinweis eingefügt wurde.

Malerische Landschaft
Nur ein Demo, womit nicht die mit Maleffekten verfremdete Landschaft gemeint ist.

Hotlinking von Bildern « Clientseitige Möglichkeiten « zurück

 
Navigation

Finden und
gefunden werden ...


- Optimierung -

 

Webcoding

Übersicht


Web Services


Tutorials &
diverse Listings

und vieles mehr...


XML


Copyright © 2006 - Verlag Horst Müller - Stendal | Datenschutz | Nutzungsbedingungen