Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums Back End RSS Feed with Altered Images Reply To: RSS Feed with Altered Images

#167617
jonsuh
Participant

I’m not familiar enough with WP to know how exactly to hook it up to the generation of the RSS feed, but there’s a fantastic PHP library that allows you to parse and modify HTML with selectors just like you do with jQuery.

PHP Simple HTML DOM Parser: http://simplehtmldom.sourceforge.net/

require_once('Simple_HTML_DOM.php');

$post_html = "Some random sentence or whatever.
<figure id='post-167550 media-167550' class='align-none'>
  <img src='https://css-tricks.com/wp-content/uploads/2014/04/concept.png' alt='' />
</figure>

Another random sentence or whatever.
<figure id='post-167550 media-167550' class='align-none'>
  <img src='https://css-tricks.com/wp-content/uploads/2014/04/concept.png' width='500' height='200' alt='' />
</figure>";

$post_html_raw = str_get_html($post_html);

foreach($post_html_raw->find('img') as $image) {
  $image_src = $image->src;
  $image->width = '320';
  $image->height = '';
}

echo $post_html_raw;

And here’s what the HTML looks like after:

<p>Some random sentence or whatever.</p> 
<figure id='post-167550 media-167550' class='align-none'>
   <img src='https://css-tricks.com/wp-content/uploads/2014/04/concept.png' alt='' width="320" height="" /> 
</figure> 
<p>Another random sentence or whatever.</p> 
<figure id='post-167550 media-167550' class='align-none'>
   <img src='https://css-tricks.com/wp-content/uploads/2014/04/concept.png' width='320' height='' alt='' /> 
</figure>

I threw up a live-working example: http://labs.jonsuh.com/chris-coyier-rss-email/