Tiggles ツ
6/5/2019 - 5:03 PM

Blog alt tags to captions

This will take your img's alt tag content, and create a new span sibling with said content. It will then wrap the whole thing in a div with any of the styling that was originally given to the image (if any)

ie - http://cloud.madebyspeak.com/53221f

js.js
content_copyfile_download
$(".post-body img").each(function() {
  if ($(this).attr("alt").length) {
    if ($(this).attr("style").length) {
     var theStyling = $(this).attr("style"),
          theAlt = $(this).attr("alt");
     $(this).wrap("<div class='image-with-caption' />");
     $("<span class='image-caption' />").insertAfter($(this));
     $(this).parent(".image-with-caption").attr("style", theStyling);
     $(this).attr("style", "");
     $(this).next(".image-caption").text(theAlt);
    } else {
      var theStyling = $(this).attr("style"),
          theAlt = $(this).attr("alt");
      $(this).wrap("<div class='image-with-caption' />");
      $("<span class='image-caption' />").insertAfter($(this));
      $(this).parent(".image-with-caption").attr("style", theStyling);
      $(this).attr("style", "");
      $(this).next(".image-caption").text(theAlt);
    }
    
  }
})