Images not Displaying in Image Frame Shortcodes

Posted in: ,

Overview

This article described some possible solutions when image are not loading within the image frame shortcodes.

  • When adding images to the Image Frames Shortcodes a common cause for the images not loading is that hyperlinks are being used when adding the image URL.
  • Hyperlinks can be seen in the Visual Editor as a blue link in the shortcode. Switching to the HTML Editor you will see that the hyperlink uses anchor tags: <a href=”">

     

    Here’s an example of invalid code:

    [frame style="modern" image_path="<a href="http://your-site.com/wp-content/uploads/your-image.jpg">http://powerjacksystems.com/wp-content/uploads/2011/08/3500lb.jpg</a>" link_to_page="" target="" description="" size="four_col_large"]

    Here’s an example of valid code:

    [frame style="modern" image_path="http://your-site.com/wp-content/uploads/your-image.jpg" link_to_page="" target="" description="" size="four_col_large"]
  • (click screenshot for full-size view)
    ImageFrames
  • If the code is formatted correctly and images still not loading, another check is to ensure the image itself is indeed loading. Simply copy the image URL, open a new tab in browser, paste the image URL and load the page. If image is indeed loading on it’s own then the issue could be caused by server-related issue.

Additional information on Shortcodes and Image Frames can be viewed in the Shortcodes Training Video