I need to remove all images in a variable using the following pattern. (With PHP).
<div class="float-right image">
<img class="right" src="http://www.domain.com/media/images/image001.png" alt="">
</div>
All the div tags will have an image class, but the float-right might vary. I can't seem to get the regex working, please help me.
Use a DOM instead of regex. Example:
<?php
$doc = new DOMDocument();
$doc->loadHTML('<div class="float-right image">
<img class="right" src="http://www.domain.com/media/images/image001.png" alt="">
</div>');
foreach( $doc->getElementsByTagName("div") as $old_img ) {
$img = $doc->createElement("img");
$src = $doc->createAttribute('src');
$class = $doc->createAttribute('class');
$src->value = 'http://your.new.link';
$class->value = 'right';
$img->appendChild($src);
$img->appendChild($class);
$doc->replaceChild($img, $old_img);
}
echo $doc->saveHTML();
?>
This regex matches your pattern:
(?s)<div class="[^"]*">\W*<img\W*class="[^"]*"\W*src="[^"]*"\W*alt="[^"]*">\W*</div>
I have tested it against several strings. It will work on:
<div class="anything">
<img class="blah" src="anything" alt="blah">
</div>
, where you can replace the "blah" and "anything" strings with anything.
Also, the various \W* in the regex allow for different spacing from string to string.
You said you want to do this in PHP.
This will zap all the matched patterns from a page stored in the $my_html variable.
$my_html=preg_replace('%(?s)<div class="[^"]*">\W*<img\W*class="[^"]*"\W*src="[^"]*"\W*alt="[^"]*">\W*</div>%m', '', $my_html);
I think this is what you were looking for?
Related
I have a string containing anchor tags. Those anchor tags holds some html and text as like below:
<a class="content-title-link" title="Blog" href="https://example.com/my-blog" target="_blank">
<img id="my_main_pic" class="content-title-main-pic" src="https://example.com/xyz.jpg" width="30px" height="30px" alt="Main Profile Picture">
My HTML Link
<label>Click here to view
<cite class="glyphicon glyphicon-new-window" title="Blog"></cite>
</label>
</a>
My string is like:
<p>Hello there,</p>
<p><a class="content-title-link" title="Blog" href="https://example.com/my-blog" target="_blank">
<img id="my_main_pic" class="content-title-main-pic" src="https://example.com/xyz.jpg" width="30px" height="30px" alt="Main Profile Picture">
My HTML Link
<label>Click here to view
<cite class="glyphicon glyphicon-new-window" title="Blog"></cite>
</label>
</a>
what's up.
</p>
<p>
Click here <a class="content-title-link" title="Blog" href="https://example.com/my-blog" target="_blank">
<img id="my_main_pic" class="content-title-main-pic" src="https://example.com/xyz.jpg" width="30px" height="30px" alt="Main Profile Picture">
My HTML Link
<label>Click here to view
<cite class="glyphicon glyphicon-new-window" title="Blog"></cite>
</label>
</a> to view my pic.
</p>
I have to replace the anchor tags with their href in the string so string will be like:
<p>Hello there,</p>
<p>https://example.com/my-blog
what's up.
</p>
<p>
Click here https://example.com/my-blog to view my pic.
</p>
I have tried below code but it is not replacing a tag with it's href:
$dom = new DomDocument();
$dom->loadHTML( $text );
$matches = array();
foreach ( $dom->getElementsByTagName('a') as $item ) {
$matches[] = array (
'a_tag' => $dom->saveHTML($item),
'href' => $item->getAttribute('href'),
'anchor_text' => $item->nodeValue
);
}
foreach( $matches as $match )
{
// Replace a tag by its href
$text = str_replace( $match['a_tag'], $match['href'], $text );
}
return $text;
Does anyone know is it possible to do this.
We can try using a regex for this. Replace the following pattern with the capture group:
<a.*?href="([^"]*)".*?>.*?<\/a>
Using preg_replace we can repeatedly match the above pattern and replace the anchor tag with the capture href URL inside the tag.
$result = preg_replace('/<a.*?href="([^"]*)".*?>.*?<\/a>/s', '$1', $string);
Note carefully the s flag at the end of the /pattern/s. This does the replacement in DOT ALL mode, meaning that dot will also match newline (i.e. across lines, which is what you want).
Demo
Search for this regex:
<a.*?href="([^"]*)"[^>]*>
and replace it with
$1
I converted a webiste from Wordpress and I some of the posts have a caption tag as the following:
[caption id="attachment_666" align="alignleft" width="316"]
<img class="wp-image-92692" src="img" width="316" alt="fitbit-yoga-lady.png" height="210">
text
[/caption]
I would like to catch all of these captions and convert it to the following
<div id="attachment_666" style="width: 326px" class="wp-caption alignleft">
<img class="wp-image-92692" src="img" alt="fitbit-yoga-lady.png" width="316" height="210">
<p class="caption">text</p>
</div>
Well, given the exact text that you provided, the following should work.
Search Pattern:
\[caption([^\]]+)align="([^"]+)"\s+width="(\d+)"\](\s*\<img[^>]+>)\s*(.*?)\s*\[\/caption\]
Replacement:
<div\1style="width: \3px" class="wp-caption \2">\4
<p class="caption">\5</p>
</div>
See the demo.
Depending on how tolerant of variations in the input it needs to be, you may need to adjust it from there, but that should at least get you started.
Here's an example of how this could be done with preg_replace:
function convert_caption($content)
{
return preg_replace(
'/\[caption([^\]]+)align="([^"]+)"\s+width="(\d+)"\](\s*\<img[^>]+>)\s*(.*?)\s*\[\/caption\]/i',
'<div\1style="width: \3px" class="wp-caption \2">\4<p class="caption">\5</p></div>',
$content);
}
I'm doing this blindly on my phone, but I think you can use the following two regular expressions, one for the opening tag and another for the closing:
Find:
\[caption([^\]])\]
Replace:
<div$1>
Find:
\[/\caption\]
Replace:
</div>
I have a string containing different types of html tags and stuff, including some <img> elements. I am trying to wrap those <img> elements inside a <figure> tag. So far so good using a preg_replace like this:
preg_replace( '/(<img.*?>)/s','<figure>$1</figure>',$content);
However, if the <img>tag has a neighboring <figcaption> tag, the result is rather ugly, and produces a stray end tag for the figure-element:
<figure id="attachment_9615">
<img class="size-full" src="http://www.example.com/pic.png" alt="name" width="1699" height="354" />
<figcaption class="caption-text"></figure>Caption title here</figcaption>
</figure>
I've tried a whole bunch of preg_replace regex variations to wrap both the img-tag and figcaption-tag inside figure, but can't seem to make it work.
My latest try:
preg_replace( '/(<img.*?>)(<figcaption .*>*.<\/figcaption>)?/s',
'<figure">$1$2</figure>',
$content);
As others pointed out, better use a parser, i.e. DOMDocument instead. The following code wraps a <figure> tag around each img where the next sibling is a <figcaption>:
<?php
$html = <<<EOF
<html>
<img class="size-full" src="http://www.example.com/pic.png" alt="name" width="1699" height="354" />
<figcaption class="caption-text">Caption title here</figcaption>
<img class="size-full" src="http://www.example.com/pic.png" alt="name" width="1699" height="354" />
<img class="size-full" src="http://www.example.com/pic.png" alt="name" width="1699" height="354" />
<figcaption class="caption-text">Caption title here</figcaption>
</html>
EOF;
$dom = new DOMdocument();
$dom->loadHTML($html);
$xpath = new DOMXPath($dom);
# get all images
$imgs = $xpath->query("//img");
foreach ($imgs as $img) {
if ($img->nextSibling->tagName == 'figcaption') {
# create a new figure tag and append the cloned elements
$figure = $dom->createElement('figure');
$figure->appendChild($img->cloneNode(true));
$figure->appendChild($img->nextSibling->cloneNode(true));
# insert the newly generated elements right before $img
$img->parentNode->insertBefore($figure, $img);
# and remove both the figcaption and the image from the DOM
$img->nextSibling->parentNode->removeChild($img->nextSibling);
$img->parentNode->removeChild($img);
}
}
$dom->formatOutput=true;
echo $dom->saveHTML();
See a demo on ideone.com.
To have a <figure> tag around all your images, you might want to add an else branch:
} else {
$figure = $dom->createElement('figure');
$figure->appendChild($img->cloneNode(true));
$img->parentNode->insertBefore($figure, $img);
$img->parentNode->removeChild($img);
}
Hi I am trying to wrap images containing a specific class (pinthis is this example) in a span to which I will add info for schema. This is a basic example and I will need to inject other schema info also. To get me started though can anyone help me get from my existing code to my example output. I need to update multiple pages dynamically and some of the content will come via PHP from Wordpress taxonomies and other data so would prefer to do it in PHP if possible.
<p>
<a class="fancybox" rel="gallery1" href="image.jpg">
<img src="img.jpg" alt="alt text" width="1000" height="1000" class="various classes including ... pinthis">
</a>
</p>
Which I would like to become...
<p>
<a class="fancybox" rel="gallery1" href="image.jpg">
<span itemscope itemtype="http://schema.org/ImageObject">
<img src="img.jpg" alt="alt text" width="1000" height="1000" class="various classes including ... pinthis">
</span>
</a>
</p>
I think if someone could point me in the right direction and give me a push start that would give me enough to carry on from there
Many thanks.
Using PHP DOMDocument, you could do something like this:
$html = '<p><a class="fancybox" rel="gallery1" href="image.jpg"><img src="img.jpg" alt="alt text" width="1000" height="1000" class="various classes pinthis"></a></p>';
// Create a DOMDocument and load the HTML.
$dom = new DOMDocument();
$dom->loadHTML($html);
// Create the span wrapper.
$span = $dom->createElement('span');
$span->setAttribute('itemscope', '');
$span->setAttribute('itemtype', 'http://schema.org/ImageObject');
// Get all the images.
$images = $dom->getElementsByTagName('img');
// Loop the images.
foreach ($images as $image) {
// Only affect those with the pinthis class.
if (strpos($image->getAttribute('class'), 'pinthis') !== false) {
// Clone the span if we need to use it often.
$span_clone = $span->cloneNode();
// Replace the image tag with the span tag.
$image->parentNode->replaceChild($span_clone, $image);
// Add the image tag as a child of the new span tag.
$span_clone->appendChild($image);
}
}
// Get your HTML with saveHTML()
$html = $dom->saveHTML();
echo $html;
Just modify the code to suit your specific needs. For example, if you need to change your span tag attributes, if you are changing your class for searching, etc... You might even want to make a function where you can specify your class and span attributes.
Documentation to DOMDocument: http://php.net/manual/en/class.domdocument.php
use warpAll
check if the image has required class
if image has class, then wrap it with the desired <span></span>
Try it this way :
if ($('img.classes').hasClass('pinthis')){
$('img.classes').wrapAll('<span itemscope itemtype="http://schema.org/ImageObject">></span>');
}
Fiddle Demo
helpful thread : jquery, wrap elements inside a div
Hi I need to remove the link of a screen scrap site here is the output source.
<div class="FourDayForecastContainerInner">
<span class="day">Friday</span>
<a href="forecastPublicExtended.asp#Period4" target="_blank">
<img src="./images/wimages/b_rain.gif" class="thumbnail">
</a>
<span class="hi">
<span style="width:24px;">Hi</span>
19 / 66
</span>
<span class="lo">
<span style="width:24px;">Lo</span>
16 / 60
</span>
<span class="description">
Sunny Breaks, showers
</span>
</div>
<div class="FourDayForecastContainerInner">
<span class="day">Saturday</span>
and here is my code Im using phpquery
$doc = phpQuery::newDocumentHTML( $e );
$containers = pq('.FourDayForecastContainerInner', $doc);
foreach( $containers as $container ) {
$div = pq('span', $container);
$img = pq('img', $container);
$div->eq(0)
->removeAttr('style')
->addClass('day')
->html(
pq( 'u', $div->eq(0) )
->html()
);
$img->eq(0)
->removeAttr('style')
->removeAttr('height')
->removeAttr('width')
->removeAttr('alt')
->addClass('thumbnail')
->html( pq( 'img', $img->eq(0)) );
$div->eq(1)
->removeAttr('style')
->addClass('hi');
$div->eq(3)
->removeAttr('style')
->addClass('lo');
$div->eq(5)
->removeAttr('style')
->addClass('description');
}
print $doc;
I have manage to remove all attributes styles height width etc. but i can't seem to remove the a href
thank you so much for your help
I tried it with your sample code and it works. This is the output
<div class='FourDayForecastContainerInner'>
<span class='day'>Friday</span>
<img src='./images/wimages/b_rain.gif' class='thumbnail'>
<span class='hi'>
<span style='width:24px;'>Hi</span>
19 / 66
</span>
<span class='lo'>
<span style='width:24px;'>Lo</span>
16 / 60
</span>
<span class='description'>
Sunny Breaks, showers
</span>
</div>
<div class='FourDayForecastContainerInner'>
<span class='day'>Saturday</span><div class='FourDayForecastContainerInner'>
<span class='day'>Friday</span>
<img src='./images/wimages/b_rain.gif' class='thumbnail'>
<span class='hi'>
<span style='width:24px;'>Hi</span>
19 / 66
</span>
<span class='lo'>
<span style='width:24px;'>Lo</span>
16 / 60
</span>
<span class='description'>
Sunny Breaks, showers
</span>
</div>
<div class='FourDayForecastContainerInner'>
<span class='day'>Saturday</span>
The way you are doing is too long and tiresome. Use regular expressions to replace the link.
$html = 'Your HTMl CODE HERE';
$exp = "~<a.*>~isU";
$html = preg_replace($exp,"", $html);
$exp = "~</a>~isU";
$html = preg_replace($exp,"", $html);
echo $html
this will totally remove the link
Does the following code do what you want ? (when added at the end of 'for' loop)
$imghtml = pq('a', $container)->html();
pq($container)->prepend($imghtml);
pq('a', $container)->remove();
Note : phpquery doesn't seem to support jquery detach()
I ran into the same question and I wanted to share my solution. My goal was to remove all tags from the title portion of some SoundCloud embed code. The HTML looked like this:
<object height="81" width="100%">
... a bunch of embed code ...
</object>
<span>
Mike Ink _ Silver
by
MINIMAL
</span>
At the end of the HTML above, you can see that the title has not only one but two links around it. My goal was to strip those out.
Assuming that HTML is assigned to the PHP variable $text, here's how I did it:
$doc = phpQuery::newDocument($text);
$soundcloud_title = strip_tags((string) $doc->find('span'));
print($soundcloud_title);
// outputs: Mike Ink _ Silver by MINIMAL
I know that this doesn't directly answer the question. In fact, I'm using strip_tags to remove the links instead of using phpquery, but I hoped it might help other coders who are looking for the same answers I was.
Happy coding!