Antworten auf deine Fragen:
Neues Thema erstellen

Antworten zum Thema „Automatische Thumbnail Generation in HTML Dateien?“

Daniel_Knecht

PSD-Mitglied

Hy,
ich suche eine Möglichkeit das die Bilder die auf meine Seite stellen will automatisch in Thumbnails umgewandelt werden um in der Übersicht mehr Platz zu sparren. Derzeit muss ich von jedem Bild eine Kopie machen und diese als Thumbnail extra speichern. Mit der Zeit nervt das ganz schön deshalb suche ich nach so einem Code/Script.

Der Code den ich zz verwende geht zwar aber in der Übersicht wird nur das erste Bild als Thumb angezeigt alle anderen nicht.

Das ist der Code:
<td width="100%" height="110">
<a href="Bild URL 1">
<img src="Bild URL (wie Bild URL 1)" style='width:100px; height:100px;' />
</a>
</td>

Hab ich evtl. was vergessen?
 

fabiogloor

impossible is nothing

AW: Automatische Thumbnail Generation in HTML Dateien?

Hallo, du kannst natürlich schon die Bilder wie in dem Codebeispiel mit width und height zu einer Art Thumbnail darstellen. Es gibt aber da immernoch das Problem, dass das komplette Bild geladen werden muss und das kann bei mehreren grösseren Bildern eine Ewigkeit dauern.
Damit du diese Problem nicht hast, muss du das Bild zu einem Thumbnail umrechnen lassen, so dass du schlussendlich 2 Bilder hast. Wenn du diesen Vorgang automatisieren willst verwende am besten Image Magic. Dieses kannst über via Konsole, z.B. vom PHP her, ansteuern wenn ein neues Bild hochgeladen wird und in ein Thumbnail umrechnen lassen. Hoffe konnte dir damit helfen.

Gruss
 
I

iDefender

Guest

AW: Automatische Thumbnail Generation in HTML Dateien?

Gibt es auch eine Möglichkeit, die Bilder umrechnen zu lassen ohne auf PHP zurückgreifen zu müssen?
 

fabiogloor

impossible is nothing

AW: Automatische Thumbnail Generation in HTML Dateien?

Naja, du brauchst schon eine Programmiersprache um die Bilder umrechnen zu können. Entweder PHP, ASP, C#, JAVA oder was auch immer. Allein von HTML aus kannst du das nicht.
 

Daniel_Knecht

PSD-Mitglied

AW: Automatische Thumbnail Generation in HTML Dateien?

...Wenn du diesen Vorgang automatisieren willst verwende am besten Image Magic. Dieses kannst über via Konsole, z.B. vom PHP her, ansteuern wenn ein neues Bild hochgeladen wird und in ein Thumbnail umrechnen lassen...

Gruss

Ich kann dir da nicht so recht folgen wie du das mit dem "Image Magic" meinst.

Es ist ja alles in seperaten html´s enthalten. Also es ist kein cms etc.

--> (RallyeArchiv>45.ADMV...>Bilder)
 
E

Evi01

Guest

AW: Automatische Thumbnail Generation in HTML Dateien?

Image Magic ist ein Programm was normal aus der Shell aufgerufen wird und Bilder umwandeln kann. Hat nix mit CMS oder der gleichen zu tun.
Image Magic wird von vielen Programmier und Scriptsprachen verwendet um genau das zum Beispiel auf einem Webserver zu tun.

Man kann zum Beispiel via PHP ein Bild verkleinern und auf dem Webserver speichern das kann aber PHP selber nicht sondern dafür ist Image Magic mit in PHP eingebunden worden.
 

Daniel_Knecht

PSD-Mitglied

AW: Automatische Thumbnail Generation in HTML Dateien?

Du meinst also nicht den normalen Image Magic Resizer sondern ein script Programm? wo bekomm ich den denn her?
 
E

Evi01

Guest

AW: Automatische Thumbnail Generation in HTML Dateien?

Entweder suchst du mal mit Google nach PHP und image resize da müsste es relativ viele sachen derart geben oder wenn mich nicht alles täuscht findet man auch was unter php.net

Ja das währe dann ein Script was du schreiben musst in einer Scriptsprache die Image Magic kann z.B. PHP.
 

blackout

Schaf im Wolfspelz

AW: Automatische Thumbnail Generation in HTML Dateien?

Ich hätte da ne PHP-Klasse anzubieten, sie ist allerdings etwas spärlich dokumentiert. Ein Beispiel dafür ist diese Mini-Ansicht , aber kleiner als das Original isses immerhin:

Benutzt wird sie z.B. so:
PHP:
$Thumb = new Thumbnail($_GET['image']);
$Thumb->setTransparencyChecker(false); // Display a checker where the image is transparent
$Thumb->setEnlargeSmallImages(false); // Shall images that are smaller than the maximum thumbnail dimensions be scaled up?
$Thumb->setMaxDimension(256, 192); // Maximum width/height of the resulting thumbnail
$Thumb->setMaintainAspectRatio(true); // Specifies whether the original aspect ratio of the image shall be maintained even if it is resized
$Thumb->generate(); // Prints the image data
PHP:
/**
 * Creates a thumbnail of a PNG/JPEG/GIF file. PNG-24 alpha channels are supported, GIF transparency however is not.
 *
 * Use $_GET['image'] to determine the source file
 *
 * HTTP Content-Type will be the same as the source file or text/plain if an error occurs
 *
 * @author David Luposchainsky
 */
class Thumbnail {

	/**
	 * Defines the maximum dimension of the resulting thumbnail
	 *
	 * @var int
	 */
	protected $MaxResultDimension;

	/**
	 * If set to TRUE the aspect ratio of the source image will be maintained (by scaling one down to maximum height/width and calculating the other one appropriately), else the image will always be stretched to maximum dimensions
	 *
	 * @var bool
	 */
	protected $MaintainAspectRatio;

	/**
	 * If set to TRUE, images smaller than the maximum width will
	 *  not be resized (i.e. enlarged) at all
	 *
	 * @var bool
	 */
	protected $EnlargeSmallImages;

	/**
	 * Settings for the checker background for transparent areas of
	 *  resized PNG graphics. If set to FALSE, the transparency will
	 *  be maintained, otherwise the array below defines the checker
	 *  pattern appearance.
	 *
	 * @var false|array
	 */
	protected $TransparencyChecker;

	/**
	 * Stores the filename of the source image
	 *
	 * @var string Path to the source image
	 */
	protected $SourceFilename;

	/**
	 * Stores the MIME type of the image generated by self::generate(). Until that function is run, the value is undefined.
	 *
	 * @var string The MIME type of the generated thumbnail
	 */
	protected $Mime;

	/**
	 * Initializes default data
	 *
	 * @param string $SourceFilename Path to the source image
	 * @throws Exception
	 */
	function __construct($SourceFilename) {

		// Check whether GD2 is ready to work
		if(!function_exists('getimagesize') || !function_exists('imagecreatetruecolor')) {
			throw new Exception('GD2 not installed/configured');
		}

		$this->SourceFilename = $SourceFilename;

		// Initialize default values
		$this->MaxResultDimension = array(256, 192);
		$this->MaintainAspectRatio = true;
		$this->EnlargeSmallImages = false;
		$this->TransparencyChecker = array(
			'Width' => 8, // Width of a checker cell
			'Height' => 8, // Height of a checker cell
			'R1' => 0xe8, // Red of cell type #1 (particularly the top-left one)
			'G1' => 0xe8, // Green
			'B1' => 0xe8, // Blue
			'R2' => 0xff, // Red of cell type #2
			'G2' => 0xff, // Green
			'B2' => 0xff, // Blue
			);

		// Check whether the source file exists
		if(!file_exists($this->SourceFilename)) {
			throw new Exception('File not found');
		}
	}

	function setMaxDimension($MaxWidth, $MaxHeight) {
		$this->MaxResultDimension = array($MaxWidth, $MaxHeight);
	}

	function setMaintainAspectRatio($Value) {
		$this->MaintainAspectRatio = $Value;
	}

	function setEnlargeSmallImages($Value) {
		$this->EnlargeSmallImages = $Value;
	}

	function setTransparencyChecker($Settings) {
		if(!$Settings) {
			$this->TransparencyChecker = false;
		} else {
			foreach($Settings as $Key => $Value) {
				$this->TransparencyChecker[$Key] = $Value;
			}
		}
	}

	function getMime() {
		if(is_string($this->Mime)) {
			return $this->Mime;
		} else {
			throw new Exception('No valid MIME type available, make sure to run generate(true) first');
		}
	}

	/**
	 * Generates the thumbnail
	 *
	 * @param bool $Return If set to TRUE the image code is returned instead of printed.
	 * @return string Returns the thumbnail data
	 * @throws Exception
	 */
	function generate($Return = false) {

		// Determine file dimensions and MIME of the source image
		$ImageSize = getimagesize($this->SourceFilename);
		if(!$ImageSize) {
			throw new Exception('imagesize() error');
		}
		$this->Mime = $ImageSize['mime'];
		$SourceImageWidth = $ImageSize[0];
		$SourceImageHeight = $ImageSize[1];

		// Create source image ressource
		switch($this->Mime) {
			case 'image/jpeg':
				$SourceImage = imagecreatefromjpeg($this->SourceFilename);
				break;
			case 'image/png':
				$SourceImage = imagecreatefrompng($this->SourceFilename);
				break;
			case 'image/gif':
				$SourceImage = imagecreatefromgif($this->SourceFilename);
				break;
			default:
				throw new Exception('Only the following MIME types are allowed: image/png, image/jpeg, image/gif');
		}

		// :TODO: compress the block below
		// Determine thumbnail image size
		if($this->MaintainAspectRatio) {
			$NewImageWidth = $this->MaxResultDimension[0];
			$NewImageHeight = round($NewImageWidth / $SourceImageWidth * $SourceImageHeight);
			if($NewImageHeight > $this->MaxResultDimension[1]) { // If the x-scaled image should exceed the maximum y size scale down the y axis instead of the x
				$NewImageHeight = $this->MaxResultDimension[1];
				$NewImageWidth = round($NewImageHeight / $SourceImageHeight * $SourceImageWidth);
			}
		} else {
			$NewImageWidth = $MaxResultDimension[0];
			$NewImageHeight = $MaxResultDimension[1];
		}
		if(!$this->EnlargeSmallImages && ($NewImageWidth > $SourceImageWidth || $NewImageHeight > $SourceImageHeight)) {
			$NewImageWidth = $SourceImageWidth;
			$NewImageHeight = $SourceImageHeight;
		}

		// Generate thumbnail image
		$NewImage = imagecreatetruecolor($NewImageWidth, $NewImageHeight);
		switch($this->Mime) { // Handle output differently for each format
			case 'image/png': // Handle transparent PNG areas
				if($this->TransparencyChecker) {
					// Fill background with color #1
					$CheckerColor1 = imagecolorallocate($NewImage, $this->TransparencyChecker['R1'], $this->TransparencyChecker['G1'], $this->TransparencyChecker['B1']);
					imagefilledrectangle($NewImage, 0, 0, $this->MaxResultDimension[0] - 1, $this->MaxResultDimension[1] - 1, $CheckerColor1);
					// Initialize color #2
					$CheckerColor2 = imagecolorallocate($NewImage, $this->TransparencyChecker['R2'], $this->TransparencyChecker['G2'], $this->TransparencyChecker['B2']);
					// Paint the pattern
					$XLineOffset = 0; // Offset to create checker pattern (move every 2nd line to the right)
					for($y = 0; $y < $NewImageHeight; $y += $this->TransparencyChecker['Height']) {
						for($x = 0; $x < $NewImageWidth; $x += (2 * $this->TransparencyChecker['Width'])) {
							$x1 = $x + $XLineOffset;
							$y1 = $y;
							$x2 = $x1 + $this->TransparencyChecker['Width'] - 1;
							$y2 = $y1 + $this->TransparencyChecker['Height'] - 1;
							imagefilledrectangle($NewImage, $x1, $y1, $x2, $y2, $CheckerColor2);
						}
						if($XLineOffset == 0) {
							$XLineOffset = $this->TransparencyChecker['Width'];
						} else {
							$XLineOffset = 0;
						}
					}
				} else {
					imagealphablending($NewImage, false); // Don't ask me why these 2 parameters are set to true-false, I just checked all 3 other combinations when true-true didn't work :\
					imagesavealpha($NewImage, true);
				}
				break;
			case 'image/jpeg': // Interlace JPEGs
				imageinterlace($NewImage, 1);
				break;
		}

		// Scale the image down
		imagecopyresampled($NewImage, $SourceImage, 0, 0, 0, 0, $NewImageWidth, $NewImageHeight, $SourceImageWidth, $SourceImageHeight);

		// Generate image
		if($Return) {
			ob_start();
		} else {
			header('content-type: '.$this->Mime);
		}
		switch($this->Mime) {
			case 'image/jpeg':
				imagejpeg($NewImage, null, 100);
				break;
			case 'image/png':
				imagepng($NewImage);
				break;
			case 'image/gif':
				imagegif($NewImage);
				break;
			// default has already been caught in the switch before
		}
		imagedestroy($SourceImage);
		imagedestroy($NewImage);
		if($Return) {
			$ImageData = ob_get_contents();
			ob_end_clean();
			return $ImageData;
		}
	}
}
 

fabiogloor

impossible is nothing

AW: Automatische Thumbnail Generation in HTML Dateien?

Sorry, bin erst jetzt wieder online, aber Evil01 hat es ja gut beschrieben. Natürlich gibt es auch PHP Klassen, aber von der Qualität, sowie vor allem von der Performance habe ich mit dem Image Magic eindeutig die bessere Erfahrung gemacht. Und auch die möglichkeiten sind grösser mit drehen, spiegeln, u.v.m...
 

blackout

Schaf im Wolfspelz

AW: Automatische Thumbnail Generation in HTML Dateien?

Zumindest die Performance von ImageMagick wird sicher nicht besser sein als eine selbstgeschriebene Klasse, und Thumbnails drehen und spiegeln will ich eher selten. :\
 

fabiogloor

impossible is nothing

AW: Automatische Thumbnail Generation in HTML Dateien?

Doch, die Performance ist aus diesem Grund bei uns besser weil wir das ImageMagick auf einem externen Server laufen haben, der nichts anderes macht als die Bilder umzurechnen. Somit ist der PHP Server entlastet. Da wir unmengen Bilder umrechnen müssen, käme der PHP Server so zu schnell an den Anschlag, und das verlangsamt für alle User die eigene PHP Seite um einiges. Mit 1 Bild kann es sein, dass es über PHP schneller geht. Das ging bei uns am Anfang auch noch gut. Aber mach das mal mit 100 Bilder. Das hat ImageMagick besser im Griff ;) Ausserdem kennt der ImageMagick Server so ne Art Cache Funktion. Wenn er merkt, dass er das Bild schon mal umgerechnet hat (welches bei unserer MedienDatenbank ab und zu der Fall sein kann da er Bildern online verändern kann und Texte drüberlegen usw...) rechnet er das Bild nicht neu, sondern gibt dieses aus dem Cache zurück...
 

blackout

Schaf im Wolfspelz

AW: Automatische Thumbnail Generation in HTML Dateien?

... eigenes Script aufm externen Server ist schneller.
(Es sei denn natürlich ImageMick ist vorcompiliert)
 

fabiogloor

impossible is nothing

AW: Automatische Thumbnail Generation in HTML Dateien?

Natürlich ist für 1 Bild ein Script auf dem gleichen Server schneller, da es nicht noch auf einen anderen verbinden muss. Aber wenn es wie gesagt 100 Bilder sind, die der eigene Server verarbeiten muss, und nebenbei muss der gleiche Server noch 100te Anfragen auf die Website verarbeiten wo die Benutzer zugreifen, dann kommt der relativ schnell an den Anschlag. Und anders ist der Vorteil, dass man die Umrechnung auf einen anderen Server auslagern kann und ImageMagick das umrechnen von mehreren Bildern gleichzeitig um einiges besser handelt als eine PHP Klasse.

... eigenes Script aufm externen Server ist schneller.
(Es sei denn natürlich ImageMick ist vorcompiliert)

Ich bin mir grad nicht sicher, aber glaube ImageMagick ist in C geschrieben. Muss das aber mal nachschauen. In diesem Fall wäre es dann auch vorcompiliert. Ist ja eine Consolen Anwendung.

Aber ist ja auch egal, ich glaube wir reden da ein bisschen aneinander vorbei :D Es kommt auf jeden Fall auf die Verwendungszwecke an, welches für einem besser ist. Ich bin halt da mehr der ImageMagick Fan wie es den Anschein macht ;)

Gruss
 
G

GWeinerth

Guest

AW: Automatische Thumbnail Generation in HTML Dateien?

Je nach Hostingangebot haste nicht immer PHP o.ä. zur Verfügung.
Und wenn Du PHP hast, kannste noch lange nicht PHP programmieren ... geschweige denn externe Tools aufm Webserver aufrufen/einbinden.

Ich würd einfach offline das Thumb generieren und dann hochladen.

Du kannst doch mit PS eine Webgalerie erstellen ... dann haste doch schon alles an Werkzeugen was Du brauchst.
Ob du die generierten Seiten nimmst, bleibt Dir überlassen, aber die Thumbs sind von der Größe/Qualität her OK und das Teil geht vollautomatisch.

warum kompliziert, wenn's auch einfach geht.

Günni
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Neueste Themen & Antworten

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
175.189
Beiträge
2.582.077
Mitglieder
67.259
Neuestes Mitglied
SaschMasch1312
Oben