Bildgröße verändern von Bildern, die per URL eingefügt

Hallo Didi,

meine Antwort willst du vielleicht gar nicht lesen, aber manchen ist überhaupt nicht bewusst, dass sie mit dem Einbinden fremder Bilder Urheberrechtsverletzungen begehen.

Hast du die schriftliche Erlaubnis, dieses Bild (sowie alle anderen Bilder von anderen Urhebern) zu nutzen? Das oben verlinkte Foto stammt zum Beispiel von http://www.meinfeinerzug.de/foto/?id=24590. Es ist ein Klacks, solche Bilder per Bildersuche bei Google zu finden (und somit auch das Bild auf deiner Seite).

Hier der rechtliche Aspekt, Stichwort Hotlinking. Eine Urheberrechtsverletzung gilt übrigens nicht nur für das Einbinden per Link, sondern auch (oder erst recht auch) für das Herunterladen und physikalische Einbinden per eigenem Webspace.

Natürlich musst du selbst wissen, was du machst, es sollte meinerseits nur ein freundlicher Hinweis sein, der dich u. U. vor erheblichen Abmahnungskosten bewahren könnte.

Die sichtbare Größe von Bildern lässt sich per CSS regulieren, mit width und height.

Hi Didi,

also das Bild auf der Seite ist nich per URL eingefügt, sondern kommt aus deinem Upload-Verzeichnis.

Wie auch immmer. Es gibt eine schnelle Lösung, die aber möglicherweise ungewünschte Nebenwirkungen auf die responsive Ausgabe haben könnte.

Bearbeite die style.css deines themes

Und ändere die Zeile 763 wie folgt von alt:

#content img {
    height: auto;
    margin: 0;
    max-width: 640px;
    width: auto;
}

zu neu:

#content img {
    height: auto;
    margin: 0;
    max-width: 640px;
    /* width: auto; */
}

Solltest du irgendwelche negativen Auswirkungen in der mobile Ansicht bei Inhaltsbildern feststellen, müsste man mit CSS-Klassen arbeiten.

Nachtrag: Ich sehe gerade, dass die Website überhaupt nicht responsive gestaltet wurde. Also sollte die Änderung gut greifen.

Hallo Didi,

ich muss noch etwas überprüfen, daher Text noch einmal kurz entfernt.

Hallo Didi

—————–
da zu zwischenzeitlich geantwortet hattest, füge ich den obigen (fehlenden) Text von mir, noch einmal hier ein, aber mit Ergänzungen
—————-

ich denke kaum, dass ein Plug-in dein Problem lösen wird. Es ist ein CSS-Problem, und deswegen müsste der Code auch genau an der Stelle geändert werden.

Um es mal kurz zu erläutern: Beim Bild wird durch das Ziehen/Verkleinern inline eine width (Wert für die Breite) eingetragen. Durch das width:auto; in der CSS-Datei wird das wieder aufgehoben und das Bild in seiner ursprünglichen Breite, aber nicht mehr als 640px (max-width:640px) Breite angezeigt.

Bei den Bildern in der Mediasparte gibt es ja unterschiedliche Größen eines Bildes. Hier wird bei deiner Website das kleinste physisch vorhandene Bild eingefügt.

Die Bilder per URL liegen nur in ihrer ursprünglichen Größe vor.

Leider lässt sich in dieser Konstallation ein width:auto; durch nichts überschreiben, sondern nur (wie von mir oben vorgeschlagen) auskommentieren, oder ganz löschen. Andernfalls hätte man dir die Scheu vor dem Bearbeiten der CSS-Dateien nehmen können, in dem du ein Custom-CSS-Plug-in installierst und den Code dort einträgst – aber wie schon geschrieben, width:auto; lässt sich selbst durch ein unset!important nicht wieder rückgängig machen.

Daher entweder:
1.) CSS bearbeiten (Lade dir doch einfach vor der Bearbeitung die Datei per FTP herunter, als Sicherung. Sollte dir irgendein Fehler unterlaufen, kannst du die Sicherung wieder hochladen.

2.) Alle Bilder auf dem Server hochladen und von dort aus einfügen.

Ergänzung:

3.) Du installierst das Plug-in Custom.css (Link siehe oben) und trägst dort ein:

#content img {
    max-width: 200px;
}

Was bedeutet: Die 200px sind die maximal mögliche Breite (zuvor waren es 640px). Natürlich kannst du die 200 anpassen, wie du meinst.

Willst du diese Änderung auf die extern eingebunden Bilder eingrenzen, dann gibst du den extern eingebundenen Bildern eine CSS-Klasse, trägst also unter „Bild-Details“ -> „erweiterte Optionen“ -> “ Bild-CSS-Klasse“ einen frei zu vergebenden Namen ein, sagen wir einfach mal bildextern.

Statt des obigen CSS-Codes trägst du nun in dem Plug-in Custom.css das ein

#content img.bildextern {
    max-width: 200px;
}

Wenn du das Plug-in installierst, bist auf der ganz sicheren Seite und ist ruckzuck gemacht.

/Ergänzung Ende

PS:
Ja, das .org war mir nicht aufgefallen. Somit ist die tram droch per URL eingebunden 😉

Ich wünsche dir auch einen schönen Sonntag, danke 🙂