SitePoint Sponsor

User Tag List

Results 1 to 12 of 12
  1. #1
    SitePoint Zealot
    Join Date
    Apr 2005
    Location
    Auckland, New Zealand
    Posts
    121
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    finding contents of img src and using it for a prefix to the img tag

    Hey guys,

    I have a string that is for a blog, potentially it could have an unlimited number of images in this string, what im trying to do is get the value of the src="" and use it as the hyperlink that happens before the img
    so currently they might show up
    Code:
    <img src="images/image1.jpg" />
    <img src="images/image2.jpg" />
    <img src="images/image3.jpg" />
    etc
    what im trying to turn this into is the following
    Code:
    <a href="images/image1.jpg"><img src="images/image1.jpg" /></a>
    <a href="images/image1.jpg"><img src="images/image2.jpg" /></a>
    <a href="images/image1.jpg"><img src="images/image3.jpg" /></a>
    basically trying to integrate lightbox into our blog dynamically so our user doesn't need to manually type code she doesn't understand.

    ive tried countless things, the closest is the following, tho it gives them all the same href

    Code:
    preg_match_all('/<img[^>]+>/i',$qryblog[content], $imgTags); 
    for ($i = 0; $i < count($imgTags[0]); $i++) {
      // get the source string
      preg_match('/src="([^"]+)/i',$imgTags[0][$i], $imgage);
      // remove opening 'src=' tag, can`t get the regex right
      $origImageSrc[$id][] = str_ireplace( 'src="', '',  $imgage[0]);
    }
    $src = $origImageSrc[$id][$count];
    $yourprefix = "<a href=\"$src\" data-lightbox=\"image-2\" title=\"Gallery\">";
    $yoursuffix = "</a>";
    $content=preg_replace("#(<img[^>]*>)#s",$yourprefix."\${1}".$yoursuffix,$qryblog[content]);
    im really struggling to find a way to make this dynamically do it on the fly... does anyone have any ideas?

    ive also tried using simple dom html paraser but didn't have much luck with it

    Code:
    $html = str_get_html($qryblog[content]);
    
    foreach($html->find('img') as $element)
    	echo $element->src . '<br>';
    This happily outputs all the src's but I cant make it do the rest

  2. #2
    SitePoint Enthusiast
    Join Date
    May 2007
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello,

    Something like this? Replace $text with your blog content.

    Code:
    <?php
    $test = '
    <img src="images/image1.jpg" />
    <img src="images/image2.jpg" />
    <img src="images/image3.jpg" />';
    
    $new = preg_replace('/(<img src="([^\"]+)" \/>)/','<a href="\2">\1</a>',$test);
    echo $new;
    ?>
    http://phpfiddle.org/main/code/mn6-5fe
    Ben

  3. #3
    SitePoint Zealot
    Join Date
    Apr 2005
    Location
    Auckland, New Zealand
    Posts
    121
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by phpMyDirectory View Post
    Hello,

    Something like this? Replace $text with your blog content.

    Code:
    <?php
    $test = '
    <img src="images/image1.jpg" />
    <img src="images/image2.jpg" />
    <img src="images/image3.jpg" />';
    
    $new = preg_replace('/(<img src="([^\"]+)" \/>)/','<a href="\2">\1</a>',$test);
    echo $new;
    ?>
    http://phpfiddle.org/main/code/mn6-5fe
    hey Ben... thanks for that
    I really wish I didn't suck with those regexp's

    The only thing I forgot to mention is that there can be other tags before and after the src="", how would we be able to make it work no matter what is before or after that?

  4. #4
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,255
    Mentioned
    196 Post(s)
    Tagged
    2 Thread(s)
    Do you have to use regex for this?

    Seems it should be possible to get all img tags, get the src attribute value. create the anchor tag, give the href attribute the value of the img src.

    Or am I missing something?

  5. #5
    SitePoint Zealot
    Join Date
    Apr 2005
    Location
    Auckland, New Zealand
    Posts
    121
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Mittineague View Post
    Do you have to use regex for this?

    Seems it should be possible to get all img tags, get the src attribute value. create the anchor tag, give the href attribute the value of the img src.

    Or am I missing something?
    Hey,

    nope it can be anything... im just struggling to find a way to make it work reliably...

  6. #6
    SitePoint Enthusiast
    Join Date
    May 2007
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by ShaneLangley View Post
    hey Ben... thanks for that
    I really wish I didn't suck with those regexp's

    The only thing I forgot to mention is that there can be other tags before and after the src="", how would we be able to make it work no matter what is before or after that?
    You could try:
    Code:
    <?php
    
    $test = '
    <img test="test" src="images/image1.jpg" />
    <img src="images/image2.jpg" />
    <img src="images/image3.jpg" anothertest="test" />';
    
    $new = preg_replace('/(<img[^\>]+src="([^\"]+)"[^\>]\/>)/','<a href="\2">\1</a>',$test);
    echo $new;
    ?>
    I suggest testing this on a wide range of content and also making sure it doesn't pose any problems on malformed input, etc.

    Mittineague may be right that another method may be easier and possibly faster for you instead of regex.
    Ben

  7. #7
    SitePoint Zealot
    Join Date
    Apr 2005
    Location
    Auckland, New Zealand
    Posts
    121
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by phpMyDirectory View Post
    You could try:
    Code:
    <?php
    
    $test = '
    <img test="test" src="images/image1.jpg" />
    <img src="images/image2.jpg" />
    <img src="images/image3.jpg" anothertest="test" />';
    
    $new = preg_replace('/(<img[^\>]+src="([^\"]+)"[^\>]\/>)/','<a href="\2">\1</a>',$test);
    echo $new;
    ?>
    I suggest testing this on a wide range of content and also making sure it doesn't pose any problems on malformed input, etc.

    Mittineague may be right that another method may be easier and possibly faster for you instead of regex.
    Thanks for that... tho I think I must be missing something... it doesn't seem to be putting anything before or after the img tags, below is the output of $test

    Code:
    <div style="width: 29.63%; height: 0%; float: left;">
    <table border="0" cellpadding="0" cellspacing="0" style="height:471px; width:100%">
    	<tbody>
    		<tr>
    			<td>
    			<p>text goes here.</p>
    
    			<p>&nbsp;</p>
    
    			<p>More text goes here.</p>
    
    			<p>&nbsp;</p>
    
    			<p>&nbsp;</p>
    			</td>
    		</tr>
    	</tbody>
    </table>
    </div>
    
    <div style="width: 70%; height: 100%; float: left;">
    <table border="0" cellpadding="0" cellspacing="0" style="height:462px; padding-left:50px; width:533px">
    	<tbody>
    		<tr>
    			<td>&nbsp;
    			<table border="0" cellpadding="1" cellspacing="1" style="width:500px">
    				<tbody>
    					<tr>
    						<td><img alt="" src="/path/ckeditor/fileman/Uploads/Images/img.jpg" style="height:360px; width:490px" /></td>
    					</tr>
    					<tr>
    						<td>Comment 1</td>
    					</tr>
    					<tr>
    						<td><img alt="" src="/path/ckeditor/fileman/Uploads/Rocketman.png" style="height:354px; width:489px" /></td>
    					</tr>
    					<tr>
    						<td>Comment 2</td>
    					</tr>
    					<tr>
    						<td><img alt="" src="/path/ckeditor/fileman/Uploads/Valentino.png" style="height:589px; width:486px" /></td>
    					</tr>
    					<tr>
    						<td>Comment 3</td>
    					</tr>
    					<tr>
    						<td><img alt="" src="/path/ckeditor/fileman/Uploads/Mischka.png" style="height:563px; width:489px" /></td>
    					</tr>
    					<tr>
    						<td>Comment 4</td>
    					</tr>
    					<tr>
    						<td><img alt="" src="/path/ckeditor/fileman/Uploads/Chaika Cali and Sibi.png" style="height:534px; width:486px" /></td>
    					</tr>
    					<tr>
    						<td>Comment 5</td>
    					</tr>
    					<tr>
    						<td><img alt="" src="/path/ckeditor/fileman/Uploads/Cali.png" style="height:569px; width:483px" /></td>
    					</tr>
    					<tr>
    						<td>Comment 6</td>
    					</tr>
    				</tbody>
    			</table>
    			</td>
    		</tr>
    	</tbody>
    </table>
    </div>

  8. #8
    SitePoint Zealot
    Join Date
    Apr 2005
    Location
    Auckland, New Zealand
    Posts
    121
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    on testing that example $test above it appears that one works with tags that are before the src but if theres any after it doesn't

    Code:
    <a href="images/image1.jpg"><img test="test" src="images/image1.jpg" /></a>
    <a href="images/image2.jpg"><img src="images/image2.jpg" /></a>
    <img src="images/image3.jpg" anothertest="test" />
    ...edit

    it appears adding a + after the [^\>] was what was missing to make that one work

    Code:
    $new = preg_replace('/(<img[^\>]+src="([^\"]+)"[^\>]+\/>)/','<a href="\2">\1</a>',$test);
    Seems to work correctly... will keep testing but it looks perfect... the lucky thing about this is its all added using a wysiwyg editor so the input will generally be pretty standard thank you so much for the help

  9. #9
    SitePoint Enthusiast
    Join Date
    May 2007
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sorry there was a typo in my last post. Try:
    Code:
    <?php
    
    $test = '
    <?php
    $test = '
    <img test="test" src="images/image1.jpg" />
    <img src="images/image2.jpg" />
    <img src="images/image3.jpg" anothertest="test" />';
    
    $new = preg_replace('/(<img[^>]+src="([^\"]+)"[^>]+\/>)/','<a href="\2">\1</a>',$test);
    echo $new;
    ?>
    Ben

  10. #10
    SitePoint Zealot
    Join Date
    Apr 2005
    Location
    Auckland, New Zealand
    Posts
    121
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by phpMyDirectory View Post
    Sorry there was a typo in my last post. Try:
    Code:
    <?php
    
    $test = '
    <?php
    $test = '
    <img test="test" src="images/image1.jpg" />
    <img src="images/image2.jpg" />
    <img src="images/image3.jpg" anothertest="test" />';
    
    $new = preg_replace('/(<img[^>]+src="([^\"]+)"[^>]+\/>)/','<a href="\2">\1</a>',$test);
    echo $new;
    ?>
    perfect.... thank you so much for the help

  11. #11
    Programming Team silver trophybronze trophy
    Mittineague's Avatar
    Join Date
    Jul 2005
    Location
    West Springfield, Massachusetts
    Posts
    17,255
    Mentioned
    196 Post(s)
    Tagged
    2 Thread(s)
    If you're happy that that regex will do the job, then this might be moot. But here it is anyway
    PHP Code:
    <?php
    $test_dom 
    = <<< EOTEST
    <html><head><title>Test HTML string</title></head>
    <body>
    <img src="./images/image0.png" alt="image0 alt" /><br />
    <img src="./images/image1.png" alt="image1 alt" /><br />
    <img src="./images/image2.png" alt="image2 alt" /><br />
    <img src="./images/image3.png" alt="image3 alt" /><br />
    <img src="./images/image4.png" alt="image4 alt" /><br />
    <img src="./images/image5.png" alt="image5 alt" /><br />
    <img src="./images/image6.png" alt="image6 alt" /><br />
    <img src="./images/image7.png" alt="image7 alt" /><br />
    <img src="./images/image8.png" alt="image8 alt" /><br />
    </body></html>
    EOTEST;

    $doc = new DOMDocument();
    $doc->loadHTML($test_dom);

    $body_tag $doc->getElementsByTagName('body');
    $img_tags $doc->getElementsByTagName('img');
    $num_imgs $img_tags->length;
    for (
    $i 0$i $num_imgs$i++) {
        
    $img_src $img_tags->item($i)->getAttribute('src');
        
    $anchor_tag $doc->createElement('a');
        
    $anchor_tag->setAttribute('href'$img_src);
        
    $anchor_tag->appendChild($img_tags->item($i)->cloneNode());
        
    $body_tag->item(0)->replaceChild($anchor_tag$img_tags->item($i));
    }
    echo 
    $doc->saveHTML();
    ?>

  12. #12
    SitePoint Zealot
    Join Date
    Apr 2005
    Location
    Auckland, New Zealand
    Posts
    121
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for that ill keep that in mind if I have any issues... the one I tried with using the dom stuff was no where like that which explains why I wasn't succesfull


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •