✔ Images aus Text finden, auf attribute überprüfen und setzen

Loveboat

Loveboat

Erfahrenes Mitglied
Hallo zusammen,

habe seit langem mal wieder ein Problem wo ich nicht weiter komme.

Ich benutze einen WYSIWYG-editor mit dem ich Text und auch Bilder in meine Webseite einfügen kann. Das funktioneirt so weit ganz gut.

Mein Problem: Ich möchte nicht jedesmal die Bilder manuell anpassen müssen, z.b. eine CSS-Klasse, Breite bzw. Höhe und so weiter angeben müssen.

Daher dachte ich mir, mittles
PHP: 
preg_replace
den übermittelten Text zu prüfen.

Mein Problem:
Ich habe keine Idee, wie ich den Text auf Bilder prüfen kann, welche im Anschluß modifizert werden müssen bevor der modifizierte Text in meiner Datenbank abgespeichert wird.

Beispiel:

Text kommt vom editor so an:
HTML: 
<p>Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>

<p><img alt="" src="/images/galerie/bild1.jpg" />Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>

<p><img alt="" src="/images/galerie/bild2.jpg" />Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>

<p>Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis.</p>


Text wie er hinterher aussehen soll:
HTML: 
<p><img class="galerie" alt="" src="/images/galerie/bild1.jpg" style="width: 150px" />Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>

<p><img class="galerie" alt="" src="/images/galerie/bild2.jpg" style="height: 150px;" />Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>

<p>Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis.</p>

Das bedeutet, die Attribute "class" und "style" sollen hinzugefügt werden. Der Style soll auch in Abhängigkeit des Bildes sein, d.h. Hoch- oder Querformat des Bildes. Hiermit möchte ich eine einheitliche Formatierung erzwingen.


Hoffe ich habe mich verständlich ausgedrückt.

Danke im Voraus.

Gruß
Loveboat
 
mit preg_replace
PHP: 
$pattern = '/(<img alt="[^"]*" src="[^"]*") \/>/i';
$replace = '\1 style="width: 150px" class="galerie" \>';
$newHtml = preg_replace($pattern, $replace, $oldHtml);
 
Hallo Yaslaw,

super warum hab ich so umständlich gedacht. :-)
Funktioniert schon mal, aber:

Wie kann ich für jedes gefunden Bild die Quelle rausziehen, damit ich vorher die Abemssungen überprüfen kann? Denn basierend auf die Abmessungen möchte ich bei Querformat eine breite und im Hochformat eine Höhe definieren.

Danke und Gruß
Loveboat
 
@alxy
Hast meinen Text wohl nicht richtig gelesen. ich wollte nicht wissen wie ich die Größe ermitteln kann, sondern wie ich Quelle aus dem Text rausziehen kann. Mir ist die Funktion getimagesize() bekannt.
 
Arg. Das DOMDocument muss ich mal noch kennenlernen.

Mal nachsehen - aha, so geht das.
PHP: 
$doc = new DOMDocument();
$doc->loadHTML($html);

foreach($doc->getElementsByTagName('img') as $image){
    $image->setAttribute('class', 'galerie');
    $image->setAttribute('style', 'height: 150px;');
}
echo $doc->saveHTML();

Nachtrag:
und die Quelle auslesen ist einfach
PHP: 
    //TODO: Was sinnvolles mit der Quelle machen
    echo $image->getAttribute('src');

Doch, das DOMDocument scheint was tolles zu sein. Muss ich mir merken!
 
das klingt interessant mit dem DOMDocument.....werde ich mal ausprobieren.
Sage Dir Bescheid. Danke im Voraus. :-)
 
Hey Yaslaw,

man das DOMDocument ist ja echt cool. Kannte ich auch noch nicht. Damit kann man wunderbar auf die Elemente zugreifen, ähnlich wie bei jQuery.

Konnte wunderbar auf die Attribute zugreifen. Denke damit bekomme ich mein Problem gelöst. Melde mich später, DANKE******
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück