Hugo ignoriert beim Erstellen von Zwischengrößen von Bildern die Metadaten (Exif). Das führt dazu, dass Bilder auf der Seite liegen, die eigentlich hochkant fotografiert wurden. Dazu hatte ich bereits einen Blogbeitrag geschrieben, siehe hier.

Heute habe ich dafür mal ein Bash-Script erstellt, um in einem Verzeichnis rekursiv alle Bilder zu finden, in denen die Rotation nur in den Exif-Daten enthalten ist, die aber auf Dateiebene nicht ausgerichtet sind.

Diese Dateien werden dann mit dem Tool mogrify korrekt ausgerichtet, die Orientierung aus Exif entfernt und die Dateien gespeichert. mogrify ist im Paket ImageMagick enthalten.

Das Script

Da ich es bevorzuge, dass mir ein Script mitteilt, was es tut, gibt es eine Ausgabe für jede Datei, ob es Exifdaten zur Rotation gibt. Damit das besser lesbar ist, werden Zeilen ohne Match eingerückt.

Hier das Shell-Script (Bash):

#!/bin/bash

SEARCH_IN_PATH="${1}"
cd "${SEARCH_IN_PATH}"

shopt -s globstar

for file in **/*; do
    #echo "${file}"
    if [ -f "${file}" ]; then
        filename=$(basename "${file}")
        extension="${filename##*.}"
        if [[ ${extension} =~ (webp|gif|jpg|jpeg|png) ]]; then
            exiftool "${file}" | grep "^Orientation" | grep "Rotate" >/dev/null

            if [ $? = 0 ]; then
                echo "Image found, mogrifiy: ${file}"
                mogrify -auto-orient "${file}"
            else
                echo -e "\tNo exif orientation: ${file}"
            fi
        fi
    fi
done
Vorsicht beim Ausführen von Shellkommandos via Copy & Paste

Man sollte Shellkommandos aus Anleitungen, die in einem Browser angezeigt werden, grundsätzlich nicht einfach ungeprüft in die Shell einfügen und ausführen.

Denn es ist möglich, Teile des Codes z. B. via CSS zu verstecken. Diese Teile werden aber trotzdem kopiert und landen auch in der Shell, wo sie ausgeführt werden.

Besser ist es, die Kommandos erst in einen lokalen Texteditor einzufügen und dort zu prüfen, bevor man die ausführt.

Kopiere doch mal dieses Beispiel und füge es – in die Shell (!NEIN) – in einen Editor ein:

echo "Befehl 1"; echo "Befehl 3"

Für alte Blogbeiträge

Somit reicht ein Aufruf auf der Konsole, um alle Bilder in meinem Blog zu “reparieren”.

Beispielaufruf für meinen Blog

$ hugo_find_fix_orientation.sh blog/posts/2022/2022-09-01-fotos-der-letzten-tage/
        No exif orientation: cover.jpg
Image found, mogrifiy: images/2022-01-19-hachelallee-1.jpg
        No exif orientation: images/2022-01-19-hachelallee-2.jpg
        No exif orientation: images/2022-01-fahrrad-zob-pforzheim.jpg
        No exif orientation: images/2022-01-schwann-radstation.jpg
        No exif orientation: images/2022-01-wald-mit-sonne.jpg
[…]

Insgesamt 25 Dateien wurden so gefunden und korrekt ausgerichtet.

Beim nächsten Rendern des Blogs erkennt Hugo die geänderten Bilddateien und erstellt dann automatisch neue Zwischengrößen daraus.

Für neue Blogbeiträge

Das Script kann ich jetzt auch verwenden, um Bilder neuer Blogbeiträge automatisch korrekt auszurichten. Sobald ein Blogbeitrag fertig ist, lasse ich das Script einmalig über das Page Bundle laufen.