I'm using JSON Rest Resource and JSON Data source to pull in external Wordpress blog post content and display on a Squiz Matrix page.
I've set up the keywords and data attributes, and everything seemed to be working well. I was pulling in the blog post title, links and a shortened version of the excerpt. I even had a function with JS/jQuery and regex to scan through the rendered content information for an IMG src tag and then collect it as a variable and then use it to create a background-image css class to give the widget containing the content some texture, and of course, make it more interesting.
var content = ('%ds__content%');
var srcWithQuotes = content.match(/src\=([^\s]*)\s/)[1];
var imgsrc = srcWithQuotes.substring(1,srcWithQuotes.length - 1);
$( '#wp-post-image' ).css('background-image', 'url(' + imgsrc + ')');
Ok so the big issue is when the person who posts the new blog, uses an alt tag that contains an apostrophe - it breaks the content feed completely and it does not give me the img src URL at all.
Is there any way to "escape" apostrophe characters in the content data string??
This is what the content string looks like and it breaks on the alt tag (Advertisement for Molloy's Hotel, Sydney Street, Mackay from The Canegrower's Weekly):
var content = ('{"rendered":"\n<div id=\"attachment_21221\" style=\"width: 299px\" class=\"wp-caption alignnone\"><a href=\"http:\/\/blogs.slq.qld.gov.au\/jol\/files\/2016\/07\/cane2.jpg\"><img class=\"size-medium wp-image-21221\" src=\"http:\/\/blogs.slq.qld.gov.au\/jol\/files\/2016\/07\/cane2-289x300.jpg\" alt=\"Advertisement for Molloy's Hotel, Sydney Street, Mackay from The Canegrower's Weekly, September 7, 1933. John Oxley Library, State Library of Queensland\" width=\"289\" height=\"300\" srcset=\"http:\/\/blogs.slq.qld.gov.au\/jol\/files\/2016\/07\/cane2-289x300.jpg 289w, http:\/\/blogs.slq.qld.gov.au\/jol\/files\/2016\/07\/cane2.jpg 597w\" sizes=\"(max-width: 289px) 100vw, 289px\" \/><\/a>