Beiträge

Größe von Bildern einfach ändern

Hallo zusammen,

immer wieder gelangt man zu einem bestimmten problem… man möchte bilder in das internet laden und dann dauert es ewig, der upload bricht ab oder die Seite macht einfach gar nichts mehr bzw. gibt fehler aus. Oder sie quitiert den dienst einfach mit der folgenden (oder änlichen) fehlermeldung „Bilder sind zu groß“.

Digitalkameras machen heutzutage sehr gute bilder in einer sehr großen auflösung. Generell ist das gut da so eine bessere qualität bei herauskommt. Für den upload in das internet ist dies aber negativ. Die dateien werden immer größer und brauchen somit länger für den upload und auch mehr speicherplatz auf dem server.

Also gibt es nur eine lösung, die schönen neuen großen bilder doch wieder kleiner machen. Zumindest für den upload in das internet.

Nun gibt es tausende von programmen die dies ermöglichen. Von professionellen bildbearbeitungsprogrammen wie z.B. Photoshop (sehr teuer!) oder Gimp (kostenlos) bis zu kleinen helferlein wie z.B. VSO Image Resizer. Das letztere möchte ich hier einmal vorstellen da ich damit arbeite und es für gut befinde. Es ist sehr einfach und hat den großen vorteil das mit dem programm auch mehrere bilder in einem rutsch geändert werden können. Und für den privaten gebrauch ist es kostenlos. Für kommerzielle anwendung kostet es aktuell auch nur 15 USD.

Erst einmal müssen sie sich die datei natürlich runterladen. Die herstellerwebseite findest du hier. Einfach die kostenlose version herunterladen und installieren.

Beim starten fragt das programm immer erst einmal natürlich ob man kostenlos weitermachen möchte oder ob man es vielleicht doch kaufen möchte. Einfach auf „Fortfahren“ klicken und weiter gehts.
Danach öffnet sich ein neues fenster „Öffnen“ in dem du die bilder auswählen kannst die du ändern möchtest. Wenn es mehrere bilder sind dann habe ich mir angewöhnt ein neues verzeichnis auf der festplatte anzulegen und dort erst einmal alle bilder reinzukopieren die ich ändern möchte. Hat den vorteil das ich im programm dann nicht extra noch suchen muss und – wenn die bilder in mehreren verzeichnissen liegen – auch noch mehrere durchgänge machen muss. Alles in einem rutsch und fertig.
Also bilder auswählen. Möchte man nur eines ändern dann einfach drauf klicken, mehrere kann man mit der STRG-Taste auswählen und alle am besten indem man die linke maustaste gedrückt hält und über alle bilder zieht… oder STRG+A. Nachdem man alle gewünschten bilder markiert hat einfach auf „Öffnen“ klicken.

Nun kann man bei „Profil“ ein vordefiniertes profil auswählen, oder auch nicht. :-) Die auflösung ist wichtig. Hier sollte man zwischen 640×480 bis 1024×768 eingeben… ich nehme meist 800×600. Reicht meist völlig aus für das web. Und natürlich dahinter in „px“ (Pixeln).

Sollte hinter der Auflösung ein „>> mehr…“ stehen so bitte drauf klicken. Dann erscheinen darunter noch ein paar weitere einstellmöglichkeiten.

Uns interessiert hier erst einmal nur der reiter „Allgemein“.
„Filtering“ ist immer „am besten“ :-)
Bei „Format“ kann ein neues Dateiformat eingestellt werden. Für internetbilder empfehle ich immer jpg da es die beste komprimierung hat und dabei die beste qualität.
Apropos „Qualität“… diese kann man hier noch einmal seperat einstellen. Standartwert würde ich 75% vorschlagen. Sollten die bilder dann noch zu groß sein kann man noch weiter runter gehen. Bis 50% sollte die qualität einigermaßen ok sein. Darunter wird es dann schlechter.
„Original Seitenverhältnis beibehalten“ sollte angeklickt sein damit keine metamorphosen bei rauskommen ;-) „Auflösung für Portrait anpassen“ habe ich noch nie ausprobiert… ob man es braucht… who knows.
Bei der „Dateinamenmaske“ kann man noch bestimmen wie der dateiname aussehen soll… ob das programm nach dem dateinamen noch ein „(Kopie)“ anhängt oder sonstiges. Hier sind die voreinstellungen schon ok. Man braucht hier nicht unbedingt noch etwas ändern.

Dann noch zwei wichtige sachen. Bei „Aktion“ kann man wählen ob man eine „Kopie erstellen“ möchte – also das original bleibt erhalten und das geänderte bild wird in einer neuen datei gespeichert (wie in „Dateinamenmaske“ vorgegeben) – oder ob man das „Original ersetzen“ möchte – die original bild datei wird überschrieben und ist weg(!!) – oder ob man „Verschieben“ möchte – hab ich noch nie gemacht… vermute das die neue bilddatei in einem anderen ordner gespeichert wird.
Und darunter gibt es dann noch das „Ziel“. Hier gibt man an wo die neue bilddatei gespeichert werden soll.

Dann einfach auf „OK“ klicken und das programm tut seine arbeit. Das schöne, wenn man (z.B.) 50 Bilddateien ausgewählt hat dann arbeitet das programm alle 50 mit einem mal ab. Ohne jedes mal neu alles eingeben zu müssen.

Wenn das programm seine arbeit getan hat findet man seine neuen bilder – je nachdem was man eingestellt hat – in dem entsprechenden ordner wieder und kann sie nun getrost ins internet laden. ;-)

NextGEN Gallery – Bilder verkleinern im Seitenverhältnis

Soooo… nach langem verschieben habe ich mich heute mal beigemacht und das Problem mit dem Seitenverhältnis gelöst.

Das Problem ist folgendes… Gebe ich für meine Bilder einer Größe von 800 px x 600 px (Breite x Höhe) vor, so verkleinert die Software z.B. ein Bild von 1024px x 765px auf dieses Format. Ist mein Bild allerdings 765px x 1024px so wird es nicht auf 600px x 800px verkleinert sondern auf 450px x 600px. Und das ist nicht im Sinne des Erfinders. :)

Also habe ich mich heute mal hingesetzt und bin dem auf den Grund gegangen. Es ist eigentlich simpel. Das Bild wird hochgeladen und auf seine Größe kontrolliert. Die werte werden nach der Vorgabe neu berechnet und es wird aufgepasst das aus Querformat nicht plötzlich ein Hochformat wird und umgekehrt. Vergessen wurde aber leider auch Vorgabewerte anzupassen. Das tun wir nun…

Öffnen Sie die Datei „/wp-content/plugins/nextgen-gallery/admin/wp25/functions.php“ in einem Editor und suchen Sie nach der Function „function resizeImages()“. Hier finden Sie folgenes:

function resizeImages($gallery_absfolder, $pictures) {
// ** $gallery_absfolder must contain abspath !!

if(! class_exists(’ngg_Thumbnail‘))
require_once(NGGALLERY_ABSPATH.’/lib/thumbnail.inc.php‘);

$ngg_options = get_option(’ngg_options‘);

if (is_array($pictures)) {

$bar = new wpProgressBar(__(‚Running… Please wait‘,’nggallery‘));
$bar->setHeader(__(‚Resize images‘,’nggallery‘));
//total number of elements to process
$elements = count($pictures);
// wait a little bit after finished
if ($elements > 5) $bar->setSleepOnFinish(2);
//print the empty bar
$bar->initialize($elements);

foreach($pictures as $picture) {

if (!is_writable($gallery_absfolder.“/“.$picture)) {
$messagetext .= $gallery_absfolder.“/“.$picture.“<br />“;
$bar->increase();
continue;
}

$thumb = new ngg_Thumbnail($gallery_absfolder.“/“.$picture, TRUE);
// echo $thumb->errmsg;
// skip if file is not there
if (!$thumb->error) {
$thumb->resize($ngg_options[‚imgWidth‘],$ngg_options[‚imgHeight‘], $ngg_options[‚imgResampleMode‘]);
if ( $thumb->save($gallery_absfolder.“/“.$picture,$ngg_options[‚imgQuality‘]) ) {
// do not flush the buffer with useless messages
if ($elements < 100)
$bar->addNote($picture. __(‚ : Image resized…‘,’nggallery‘));
} else
$bar->addNote($picture . “ : Error : <strong>“.$thumb->errmsg.“</strong>“);
$bar->increase();
}
$thumb->destruct();
}
}

if(!empty($messagetext)) nggallery::show_error(‚<strong>‘.__(‚Some pictures are not writeable :‘,’nggallery‘).'</strong><br /><ul>‘.$messagetext.'</ul>‘);
return;
}

Das ist die Function die unseren „normalen“ Bildern eine neue Größe gibt. Wir ersetzen diese Funktion nun durch diese neu modifizierte:

function resizeImages($gallery_absfolder, $pictures) {
// ** $gallery_absfolder must contain abspath !!

if(! class_exists(’ngg_Thumbnail‘))
require_once(NGGALLERY_ABSPATH.’/lib/thumbnail.inc.php‘);

$ngg_options = get_option(’ngg_options‘);

if (is_array($pictures)) {

$bar = new wpProgressBar(__(‚Running… Please wait‘,’nggallery‘));
$bar->setHeader(__(‚Resize images‘,’nggallery‘));
//total number of elements to process
$elements = count($pictures);
// wait a little bit after finished
if ($elements > 5) $bar->setSleepOnFinish(2);
//print the empty bar
$bar->initialize($elements);

foreach($pictures as $picture) {

if (!is_writable($gallery_absfolder.“/“.$picture)) {
$messagetext .= $gallery_absfolder.“/“.$picture.“<br />“;
$bar->increase();
continue;
}

$thumb = new ngg_Thumbnail($gallery_absfolder.“/“.$picture, TRUE);
// echo $thumb->errmsg;
// skip if file is not there

if (!$thumb->error) {
//$thumb->resize($ngg_options[‚imgWidth‘], $ngg_options[‚imgHeight‘], $ngg_options[‚imgResampleMode‘]);

if ($thumb->currentDimensions[‚height‘] > $ngg_options[‚imgHeight‘] || $thumb->currentDimensions[‚width‘] > $ngg_options[‚imgWidth‘]) {

// check for portrait format
if ($thumb->currentDimensions[‚height‘] > $thumb->currentDimensions[‚width‘]) {
//vorgaben checken
if ($ngg_options[‚imgWidth‘] > $ngg_options[‚imgHeight‘]) {
$y = $ngg_options[‚imgWidth‘];
$x = $ngg_options[‚imgHeight‘];
} else {
$y = $ngg_options[‚imgHeight‘];
$x = $ngg_options[‚imgWidth‘];
}
$thumb->resize($x, 0, $ngg_options[‚imgResampleMode‘]);
// get optimal y startpos
$ypos = ($thumb->currentDimensions[‚height‘] – $y) / 2;
$thumb->crop(0, $ypos, $x,$y,$ngg_options[‚imgResampleMode‘]);
} else {
//vorgaben checken
if ($ngg_options[‚imgWidth‘] < $ngg_options[‚imgHeight‘]) {
$y = $ngg_options[‚imgWidth‘];
$x = $ngg_options[‚imgHeight‘];
} else {
$y = $ngg_options[‚imgHeight‘];
$x = $ngg_options[‚imgWidth‘];
}
$thumb->resize(0,$y,$ngg_options[‚imgResampleMode‘]);
// get optimal x startpos
$xpos = ($thumb->currentDimensions[‚width‘] – $x) / 2;
$thumb->crop($xpos, 0, $x,$y,$ngg_options[‚imgResampleMode‘]);
}

} else {
$thumb->resize($ngg_options[‚imgWidth‘], $ngg_options[‚imgHeight‘], $ngg_options[‚imgResampleMode‘]);
}

if ( $thumb->save($gallery_absfolder.“/“.$picture,$ngg_options[‚imgQuality‘]) ) {
// do not flush the buffer with useless messages
if ($elements < 100)
$bar->addNote($picture. __(‚ : Image resized…‘,’nggallery‘));
} else
$bar->addNote($picture . “ : Error : <strong>“.$thumb->errmsg.“</strong>“);
$bar->increase();
}
$thumb->destruct();
}
}

if(!empty($messagetext)) nggallery::show_error(‚<strong>‘.__(‚Some pictures are not writeable :‘,’nggallery‘).'</strong><br /><ul>‘.$messagetext.'</ul>‘);
return;
}

Was machen wir da nun im Einzelnen?

if ($thumb->currentDimensions[‚height‘] > $ngg_options[‚imgHeight‘] || $thumb->currentDimensions[‚width‘] > $ngg_options[‚imgWidth‘]) {

Hier überprüfen wir ob das Hochgeladene Bild überhaupt größer ist als die Vorgabe (hier 800px x 600px). Wenn nicht muss auch nichts verkleinert werden.

if ($thumb->currentDimensions[‚height‘] > $thumb->currentDimensions[‚width‘])

Hier überprüfen wir in welchem Seitenformat das Bild vorliegt, Quer- oder Hochformat.

if ($ngg_options[‚imgWidth‘] > $ngg_options[‚imgHeight‘]) {
$y = $ngg_options[‚imgWidth‘];
$x = $ngg_options[‚imgHeight‘];
} else {
$y = $ngg_options[‚imgHeight‘];
$x = $ngg_options[‚imgWidth‘];
}

Und das ist im Endeffekt das neue… Nachdem wir nun wissen ob wir es mit einem Quer- oder Hochformat zu tun haben, passen wir die Vorgabewerte dem Format an… 800px x 600px oder 600px x 800px (für mein Beispiel.

Und das war es auch schon. Sieht viel aus, ist aber mehr Erklärung als alles andere :)
Vielleicht ist das nicht das non-plus-ultra, aber es funktioniert. Und darauf kommt es an. Wer es besser machen kann… kann gern seinen Kommentar loswerden ;)

Bitte beachten Sie. Alle Angaben auf dieser Seite sind ohne Gewähr und nur auf eigene Gefahr zu verwenden!

Gruß
Gordon

NextGEN Gallery und Bilder verkleinern…

Hallo,

da hatte ich doch gerade mal wieder ein Problem. Wer WordPress mit dem Plugin „NextGEN Gallery“ verwendet wird vielleicht auch drauf stoßen.
Man kann in den Optionen angeben auf welche Bildgröße die Bilder verkleinert werden sollen (falls Sie zu groß sind).
Ich habe dort 640px x 480px angegeben. Denn zu große Bilder brauchen zu lange zum Laden und benötigen nur unnötig Speicherplatz. Nun habe ich mich vorhin gewundert warum die Bilder dennoch so lange zum Laden brauchen und bei einer Vollbildansicht hab ichs dann gesehen… die Bilder wurden nicht verkleinert.

Nach einigem Googlen habe ich dann eine Hilfe gefunden. Allerdings auf englisch… daher gebe ich es einfach mal hier auf deutsch wieder:

Bearbeiten Sie die Datei „/wp-content/plugins/nextgen-gallery/admin/wp25/functions.php“ und suchen Sie nach der Funktion „function upload_images()„. Scollen Sie ganz an das ende der Funktion und suchen Sie nach:

//create thumbnails
nggAdmin::generatethumbnail(WINABSPATH.$gallerypath,$imageslist);

Davor schreiben Sie dann folgendes:

//create resized pictures
nggAdmin::resizeImages(WINABSPATH.$gallerypath,$imageslist);

Speichern (und die Datei wieder auf den Webspace laden) und nun sollte es funktionieren.

Quelle: http://wordpress.org/support/topic/177782

Etwas stört mich nun aber immernoch. Wenn ich als größe 640px x 480px angebe ist das ja das Querformat. Er erkennt allerdings nicht automatisch ein Hochformat. Also er erkennt es schon… nimmt aber weiter fleißig 480px als höhe an und rechnet die Breite um. Damit wird das Bild aber noch kleiner als gedacht. Schöner wäre es wenn er im Querformat dann einfach 480px x 640px benutzt.
Vielleicht werde ich mich da nächste Woche mal ransetzen. Da habe ich dann ja wieder Zeit :)
[UPDATE] Der Artikel ist fertig, das Problem gelöst: Zum Artikel

Gruß
Gordon