Heute gibt es mal wieder ein nützliches Plugin für die Programmierer unter euch! 🙂

Auf Webseiten und Blogs wird vor allem in Artikeln viel mit Bilder und Fotos gearbeitet. Allein hier auf eurer IT-Runde gehen wir bei jedem Artikel auf die Suche nach einem passenden Artikelbild und müssen dies dann mit Photoshop aufwändig verkleinern, abspeichern und hochladen. Will man neben dem Artikelbild noch einen anderen Teilausschnitt vom Foto im Artikel online stellen, muss man dieses wieder in Photoshop öffnen, anpassen, speichern und hochladen. Bei uns hält sich der Aufwand noch in Grenzen, bei Magazinen oder anderen Portalen muss ein einzelnes Foto jedoch für das Artikelbild, den Slider, ein Themenbild etc. herhalten. Immer das Originalfoto zu laden wäre schwachsinnig und sieht pixelig aus, alle Fotos einzeln in Photoshop je nach Größe anpassen ist viel zu aufwändig – Was nun?

Weil ich eine passende Funktion vor kurzem bei einem großen Portal im Backend gesehen habe, mit der man Teilausschnitte von einem Foto festlegen und als eigenes Bild neu speichern kann, habe ich mich mal auf die Suche nach einem Codeschnipsel gemacht. Für die eigentliche Bildbearbeitung benötigen wir gdlib in PHP, da ich meinen Ausschnitt aber selbst definieren und online “ziehen” wollte, ist auch Java Script von Vorteil.

Ein paar Foren durchsucht und einige Scripte weiter bin ich dann auf das einfache aber geniale Plugin “Manual jQuery Image Resizer/Cropper” gestoßen (Demo). Dies bietet genau die Funktionen die man zum zerschneiden und speichern des Teilausschnittes braucht. Ganz einfach kann man mit einem Grau/Transparenten Block über das vorhandene Bild fahren und über dem optimalen Platz das Bild “cutten” – Zusätzlich bietet das Script übrigens noch eine Verkleinerung des originalen Fotos an. Alles kann dann genau an einem selbst festgelegten Speicherort abgelegt und gespeichert werden. Genau das was wir wollten und eigentlich noch mehr! 🙂

Das ist natürlich nur eine super Grundlage, jeder muss das Plugin natürlich noch an die eigenen Bedürfnisse anpassen. Ich beispielsweise habe einen Upload für das originale Bild eingebaut und auf diesem kann ich dann vorher je nach Area festgelegte Größen hin und her schieben. Diese werden dann mit einem Wasserzeichen abgespeichert und passend zum Artikel in die Datenbank geschrieben. Ist das Script einmal fertig und läuft es einwandfrei, kann man sehr viel Spaß damit haben und im nachhinein einiges an Zeit einsparen! 😎

Wie findet ihr das Plugin – Absolutes Muss für jeden Entwickler oder kennt ihr bessere Alternativen? Ihr seid gefragt! 🙂

Tweet