Beiträge

NextGEN Gallery – Bilder verkleinern im Seitenverhältnis

/1 Kommentar/in /von

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 – Resizing images according to the aspect ratio

/0 Kommentare/in /von

Soooo… after postponing it for quite a while… I sat down and solved finally the aspect ratio problem when Nextgen Gallery shall resize/shrink an image.

The problem is… If I set as picture size e.g. 800×600 px (width x height), then Nextgen Gallery resizes a picture from e.g. 1024x768px to this format. All good. But if the original picture is 768x1024px then the result is not a picture with 600x800px, no, it will be a picture of 450x600px. And that is not what we want. (Isn’t it?)

So, I sat down today and checked the sources. Actually its simple. The picture will be uploaded and checked on its size. The values will be re-calculated be the settings and the aspect ratio should be checked as well. They just forgot to adjust the settings. We’ll do that now…

Open the file „/wp-content/plugins/nextgen-gallery/admin/wp25/functions.php“ in an editor and search for the function „function resizeImages()“. Here you’ll see:

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;
}

This is the function which resizes our original pictures. We’ll replace this function now with this modified one:

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;
}

Ok, what is this doing now?

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

First of all we check if the uploaded image is bigger then the settings. If not, then we don’t need to do anything anyway.

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

Here we check the aspect ratio… horizontal or vertical format.

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

And that is basically the new thing… after we know if we have a horizontal or vertical picture, we can adjust the setting values… like 800x600px or 600x800px (for my example).

And thats it already. Looks a lot, but its more explaining then anything else :)
Maybe that is not the best solution (especially it is not ‚update save‘), but it works for now. If you know a better solution, then let me have it in the comments. ;)

Please notice that all code snippets and examples on this page are on your own risk. I am not responsible for anything you do!

Cheers
Gordon

Image resize problem with the NextGEN Gallery plugin

/0 Kommentare/in , /von

Hi,

and I had a problem again. If you use WordPress with the „NextGEN Gallery“ plugin, then you may also stumble over this problem after some time.
In the options of the plugin you can set a picture size to shrink the pictures, in case they are to big.
I’ve added there the value of 640 x 480 px. Because to big pictures need too long to load and use unnecessarily much disk space. A few minutes ago I was wondering why the pictures still need ages to load and in the full screen mode I saw it … the pictures haven’t been resized by the plugin.

After a while consulting Google I found help.

Edit the file „/wp-content/plugins/nextgen-gallery/admin/wp25/functions.php“ and search the function „function upload_images()„. Scroll to the end of this function and search for:

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

Write before this:

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

Save it, upload the file to the web-space again and then it should work.

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

But something is still disturbing me. Wenn I set as size 640 x 480px then is it horizontal format. But the function doesn’t automatically recognize vertical format. I mean it recognize it of course… but the height is still 480px and the width will be calculated by the height. Like this the resulting image is a bit small then. Would be nice if the function would change the values according to the format of the picture.
Maybe I will check it next week. Then I’ll have more time. :)

[UPDATE] The article is ready, the problem is solved: To the article

Cheers
Gordon

WordPress installieren

/0 Kommentare/in /von

Hallo zusammen,

nun habe ich mich ja entschieden einen eigenen Blog zu starten. Als Software habe ich mich für WordPress entschieden. WordPress ist eine weit verbreitete Blog-Software.

Die Installation verlief sehr simpel. Erst habe ich sie lokal auf meinem Rechner installiert… ein wenig rumprobiert und diverse Plugins ausprobiert. Besonders wichtig war mir die Galerie, die standartmäßig nicht mit dabei ist. Aber das Plugin „NextGen Gallery“ machte einen ganz guten Eindruck und wenn man erst einmal verstanden hat wie sie funktioniert ist sie auch ganz nett.

Nun habe ich das ganze System gerade auf meinen Webspace geladen und es funktioniert wie geplant :)

Nun ist es ja leider so das man sich über die Sicherheit fast mehr sorgen machen muss als alles andere. Dazu habe ich gerade ein nettes Tutorial gefunden, welches ich gerade durchrocke. Es beinhaltet schon viele, wichtige, Schritte. Dazu werde ich noch ein paar eigene Ideen einbauen. Ich hoffe nur das ich bei den ganzen Sicherheitsmaßnamen nicht auch „echte“ User ausschließe. Falls doch möchte ich mich schon mal entschuldigen.

Falls meine eigenen Ideen funktionieren werde ich dazu auch noch mal etwas schreiben.

… so, Idee Nr. 1 ist installiert und funktioniert einwandfrei :)
Worum gehts? Ganz einfach. WordPress hat natürlich ein Backend um die Artikel zu verfassen (etc.pp.). Dieses Backend ist von Haus aus immer unter /wp-admin/ zu finden. Das ist allerdings nicht nur gut für den Benutzer, sondern auch Hacker und sonstige Bösewichte finden das toll. So müssen Sie nicht erst ewig nach dem Administrationsbereich suchen.
Leider ist es bei WordPress nicht damit getan das Verzeichnis einfach umzubennen. Denn in vielen Dateien wird auf genau dieses Verzeichnis verwiesen und eine zentrale Konfigurationsvariable gibts leider nicht. Also muss man alle Dateien abklappern und die Pfadangeben manuell ändern. Zum Glück gibts kleine Helferlein die das für einen in Sekunden erledigen. Ein solch Helferlein ist z.B. InfoRapid.
Aufzupassen ist dabei das Sie nach „wp-admin“ suchen und durch den neuen Verzeichnispfad (z.B. „meinadmin“) ersetzen. Nach dem durchlauf muss gleich noch einer gestartet werden, da auch so einige CSS-Dateien „umbenannt“ wurden. Also muss danach nach „meinadmin.“ gesucht werden und durch „wp-admin.“ ersetzt werden. Dann stimmen die CSS-Dateinamen wieder.

Somit kann man das Backend-Verzeichnis umbenennen. Soweit ist das schon mal eine tolle Sache und ein Schritt in Richtung Sicherheit. Da nun aber das Backend-Verzeichnis nicht mehr vorhanden ist, die Bösewichte aber gern danach suchen, kam mir gleich noch der Gedanke einen drauf zu setzen.

Wem das Projekt „Spider Trap“ bekannt ist, der weiß vielleicht was ich meine :) Für alle die es nicht kennen erkläre ich es kurz. Suchmaschinen setzen sogenannte Bots ein um das Internet zu durchsuchen und zu indexieren. Bots sind Softwaregesteuerte Maschinen die selbstständig ihre Arbeit verrichten. Da es aber auch Inhalte im Internet sind die, aus welchen Gründen auch immer, nicht in Suchmaschinen auftauchen sollen gibts es Regeln an die sich die Bots halten müssen. Diese Regeln werden, unter anderem, in der Datei „robots.txt“ festgehalten. Nun gibt es leider auch hier Bots (meist von kleinen Suchmaschinen) die sich nicht an diese Regeln halten oder schlichtweg ignorieren. Bots kommen auch nicht immer von Suchmaschinen. Auch Hacker bauen sich solche Bots um Standartsystem aufzuspüren und auszukundschaften.
Soweit dazu. Das Projekt „Spider Trap“ stellt diesen Bots eine Falle in dem Sie eine Regel aufstellen die besagt das ein Bot ein bestimmtes Verzeichnis nicht „betreten“ darf. Gute Bots halten sich an diese Regel und fassen das Verzeichnis nicht an. Böse Bots jedoch werden gerade versuchen genau dieses Verzeichnis aufzurufen und tappen damit in die Falle. Sie werden vom System registriert und schlichtweg ausgeschlossen. Dies geschieht über eine IP-Sperre.
(Anm. Die IP ist einzigartig und somit kann man einen Rechner eindeutig identifizieren. Bei normalen Internetusern wechselt diese jedoch des öfteren (normalerweise bei jeder neuen Internetverbindung). Bots sind aber meist auf Webservern installiert und deren IP muss immer gleich sein.)

Nun zum Plan: Wir haben nun das Verzeichnis „wp-admin“, in dem normalerweise das Administrationsmenü von WordPress liegt, „frei“ gemacht. Dieser Verzeichnisname ist frei. Ich habe es neu angelegt und die „Bot-Falle“ darin installiert. Damit werden nicht nur die bösen Bots darin gefangen sondern auch gleich noch ein paar andere böse Buben. Leider bringt das nur bei automatisierten Scripten etwas. Denn die Bot-Falle kann auch wieder aufgelöst werden. Wenn nun ein Mensch versucht hat mein System auszuspähen dann kann er sich allein wieder „befreien“.
Warum das so ist? Ganz einfach. Wenn ein Benutzer meines System ausversehen selbst in die Falle gegangen ist (was ich mir eigentlich nicht vorstellen kann wie das passieren soll, aber kann ja vorkommen), dann wäre es überaus übel wenn er dort nicht wieder rauskommt und meine Seite nicht mehr anschauen kann. So muss er einen Code eingeben und kommt wieder aus der Falle raus.
Wie oben schon angesprochen ändern sich bei normalen Internetnutzern die IP nach einer weile. So kann es auch vorkommen das ein böser Benutzer in meine Falle getappt ist, sich aus dem Internet abmeldet und somit seine IP wieder frei wird. Nun wählt sich irgend ein anderer Benutzer ins Internet ein, bekommt die IP des bösen Benutzers und will ganz zufällig auch meine Seiten besuchen so ist er gleich gesperrt, denn er hat ja jetzt die IP des anderen, bösen, Benutzers.

Naja, bei mir funktioniert das ganze erst einmal. Vielleicht setze ich mich selbst mal an das Script von „Spider Trap“ und tüftel mal dran rum. Es gibt da noch ein paar Ideen die man einbauen könnte. Vielleicht wenn ich Zeit habe.

Sonnige Grüße
Gordon