/* BeejBløg */

Jun 15, 2015 - 1 minute read - Comments -

External Content in Blogger Post

Highlights:

  • pull content from 3rd party source, using crossorigin.me (CORS proxy) to avoid “no ‘access-control-allow-origin’ header is present on the requested resource”
  • from what i can glean, Blogger does not offer any kind of server side include facility so we have to resort to client browser tricks and that means this content is NOT going to be crawled/googlable
  • this approach relies on jQuery (Core) so you’ll need to have that referenced as well – example here, but also make sure you point at the latest version

Usage:

drop this helper function in a global JS/HTML widget via the Blogger Layout editor…

function pluginContent(url, containerSelector, boolPrettyPrint) {
  var ctrl = $(containerSelector);
  $.get("https://crossorigin.me/"+url)
    .done(function (result) {
        ctrl.html(result);

        //force prettyPrint rendering after loading dynamic content
        // google on: "google code prettify" to get dialed in on this code syntax highlighting library
        // => https://code.google.com/p/google-code-prettify/wiki/GettingStarted
        if (boolPrettyPrint) {
          ctrl.removeClass("prettyprinted");
          PR.prettyPrint();
        }
    })
    .fail(function() {
      ctrl.html('failed to retrieve external content.'+
        'try going there directly: '+url+'')
    });
}

Then use it like this in an individual blogpost: