I am using preg_replace to change some content, I have 2 different types of images...
<p>
<img class="responsive" src="image.jpg">
</p>
<div class="caption">
<img class="responsive" src="image2.jpg">
</div>
I am using preg_replace like this to add a container div around images...
function filter_content($content)
{
$pattern = '/(<img[^>]*class=\"([^>]*?)\"[^>]*>)/i';
$replacement = '<div class="inner $2">$1</div>';
$content = preg_replace($pattern, $replacement, $content);
return $content;
}
Is there a way to modify this so that it only affect images in P tags? And also vice versa so I can also target images within a caption div?
Absolutely.
$dom = new DOMDocument();
$dom->loadHTML("<body><!-- DOMSTART -->".$content."<!-- DOMEND --></body>");
$xpath = new DOMXPath($dom);
$images = $xpath->query("//p/img");
foreach($images as $img) {
$wrap = $dom->createElement("div");
$wrap->setAttribute("class","inner ".$img->getAttribute("class"));
$img->parentNode->replaceChild($wrap,$img);
$wrap->appendChild($img);
}
$out = $dom->saveHTML();
preg_match("/<!-- DOMSTART -->(.*)<!-- DOMEND -->/s",$out,$match);
return $match[1];
It's worth noting that while parsing arbitrary HTML with regex is a disaster waiting to happen, using a parser with markers and then matching based on those markers is perfectly safe.
Adjust the XPath query and/or inner manipulation as needed.
Use an html parser instead of regex, DOMDocument for example, i.e.:
$html = <<< EOF
<p>
<img class="responsive" src="image.jpg">
</p>
<div class="caption">
<img class="responsive" src="image2.jpg">
</div>
EOF;
libxml_use_internal_errors(true);
$dom = new DOMDocument();
$dom->loadHTML($html);
$xpath = new DOMXPath($dom);
$images = $xpath->query('//p/img[contains(@class,"responsive")]');
$new_src_url = "some_image_name.jpg";
foreach($images as $image)
{
$image->setAttribute('src', $new_src_url);
$dom->saveHTML($tag);
}