Add attributes to image inside div with preg_replace

Normally you would do this with a stylesheet, but this is for a newsletter so have to use inline styles.

The newsletter contains several blocks wrapped in a div with the tmp class. The content will be placed inside this div, with possibly 1 image. This image is where I want to add an inline style to.

This code bellow works as long as there is no <p> in the same div. But once you add some text to it, it stops working. Obviously there will be text in a newsletter. I got this code form another form, i tried to play around with the code a bit to get it to work, but no success so far.

If you would remove the <p> from the $str, it does work fine. But I want to work with multiple <p> after the img. Any idea’s on how to make this work with <p> after the image?


$str = '<div class="tmp">
		<img width="140" height="140" align="left"  src="/img/text/my-image.jpg">
		<p>Lorum ipsum</p>
	</div>';

$str = preg_replace('/\\s\\s+/', "", $str);  
$pattern = "/<div class=\\"tmp\\">(\\\\w+)?<img ([^>]+)>(\\\\w+)?<\\/div>/is";
$replacement = "<div class=\\"tmp\\">\\\\1 <img style=\\"float:left; margin:0 10px 10px 0;\\" \\\\2 /> \\\\3</div>";

$str = preg_replace($pattern, $replacement, $str);
echo $str;


I’m struggling to come up with a messier way of doing what you are trying to do :rolleyes:.

Just because it’s a newsletter, why do you have to use inline styles?

I would love to us a normal sylesheet, but as far as I know there are some mail clients that strip it out, I think gmail was one of them that takes out css files. So no other option then to use inline style.

oh ok,

In your op you didn’t mentioned the newsletter was being emailed. I assumed it was a newsletter just for publishing on a web page which people can link to. In that case then yes, you have to think way retro for html emails and so inline styles is the way to go.

So is your question:

I am starting off with this:


$str = '<div class="tmp">
		<img width="140" height="140" align="left"  src="/img/text/my-image.jpg">
		<p>Lorum ipsum</p>
	</div>';

but I actually want:

a) (remove both <p></p> tags WHEN inside a div called “tmp” and if immediately following an <img>)


$str = '<div class="tmp">
		<img width="140" height="140" align="left"  src="/img/text/my-image.jpg">
		Lorum ipsum
	</div>';

OR b) (remove the paragraph contents and <p> tags WHEN inside a div called “tmp” and if immediately following an <img>)


$str = '<div class="tmp">
		<img width="140" height="140" align="left"  src="/img/text/my-image.jpg">
	</div>';

OR if something else, then please show us exactly.

Personally i’d think you’re looking for XML manipulation more than preg at this point, but eh…

His original pattern indicates he wants case A.

Gotta stop doing these regex’s blind, but i dont have time to test it before leaving work today…

$pattern = ‘~<div class=“tmp”>(.?)<img (^>)>(.*?)</div>~’;
$replace = ‘<div class=“tmp”>\\1<img width=“140” height=“140” align=“left” \\2 >\\3</div>’;

NOTE: Only works if all ‘tmp’ class div’s have an image tag in them. Otherwise will cause issues.