Colorbox opens but says "This content failed to load."

I have the same problem. I just installed Media Gallery on two sites and both are behaving the same as what is described here.

I've tried to toggle the setting and play around to get things to work thinking I missed a setting. The only solution I've found so far is:

1) Click 'Edit' on a picture
2) When the 'Edit" form opens, click 'View' to go the picture's detail page
3) Go back to album and click on the picture

The picture should now display in the colorbox overlay (at least it did for me).

Now, this isn't a real solution, but may help someone diagnose what is going on here. Does opening the picture in it's detail page result in Media Gallery performing some processing on it that enables it in the colorbox view?

I have the same problem.

The colorbox help states:
- xhrError
- "This content failed to load."
- Error message given when ajax content for a given URL cannot be loaded.

Could you find the issue / solution?
Is it possible for you to check in your browser, what the real response is?
The page, which is returend in the lightbox is not the same as returned on the detail page.

Hi,

I have the same issue. I've also been able to replicate the same way #2 explained, however that only works for me when still logged in as admin.

I have found that if you reset all caches I get then you receive the errors "this content failed to load" or the colorbox pops out the overlay with "http://" where the media should be.

The error messages also happens when logged out accessing the site without any permissions. I can only see the content after creating/editing and it is cached (or doing the same action as #2).

Example html from my site:

Working html code:

<div id="cboxWrapper" style="height: 540px; width: 760px;"><div><div id="cboxTopLeft" style="float: left;"></div><div id="cboxTopCenter" style="float: left; width: 710px;"></div><div id="cboxTopRight" style="float: left;"></div></div><div style="clear: left;"><div id="cboxMiddleLeft" style="float: left; height: 490px;"></div><div id="cboxContent" style="float: left; width: 710px; height: 490px;"><div id="cboxLoadedContent" style="width: 710px; overflow: auto; height: 470px;">
<strong><div class="embedded-video">
  <div class="player">
    <iframe width="710" height="465" src="//www.youtube.com/embed/lfOkdFnElC8?width=710&amp;height=465&amp;theme=light&amp;autoplay=1&amp;vq=hd720&amp;rel=0&amp;showinfo=1&amp;modestbranding=1&amp;iv_load_policy=1&amp;controls=1&amp;autohide=2&amp;start=0&amp;wmode=opaque" frameborder="0" allowfullscreen=""></iframe>  </div>
</div></strong>
</div><div id="cboxTitle" style="float: left; display: block;"></div><div id="cboxCurrent" style="float: left; display: none;"></div><button type="button" id="cboxPrevious" style="display: none;" tabindex="0"></button><button type="button" id="cboxNext" style="display: none;" tabindex="0"></button><button id="cboxSlideshow" style="display: none;" tabindex="0"></button><div id="cboxLoadingOverlay" style="float: left; display: none;"></div><div id="cboxLoadingGraphic" style="float: left; display: none;"></div><button type="button" id="cboxClose" tabindex="0">Close</button></div><div id="cboxMiddleRight" style="float: left; height: 490px;"></div></div><div style="clear: left;"><div id="cboxBottomLeft" style="float: left;"></div><div id="cboxBottomCenter" style="float: left; width: 710px;"></div><div id="cboxBottomRight" style="float: left;"></div></div></div>

broken html code, after flushing all caches:

<div id="cboxWrapper" style="height: 540px; width: 760px;"><div><div id="cboxTopLeft" style="float: left;"></div><div id="cboxTopCenter" style="float: left; width: 710px;"></div><div id="cboxTopRight" style="float: left;"></div></div><div style="clear: left;"><div id="cboxMiddleLeft" style="float: left; height: 490px;"></div><div id="cboxContent" style="float: left; width: 710px; height: 490px;"><div id="cboxLoadedContent" style="width: 710px; overflow: auto; height: 470px;"><div id="cboxError">This content failed to load.</div></div><div id="cboxTitle" style="float: left; display: block;"></div><div id="cboxCurrent" style="float: left; display: none;"></div><button type="button" id="cboxPrevious" style="display: none;"></button><button type="button" id="cboxNext" style="display: none;"></button><button id="cboxSlideshow" style="display: none;"></button><div id="cboxLoadingOverlay" style="float: left; display: none;"></div><div id="cboxLoadingGraphic" style="float: left; display: none;"></div><button type="button" id="cboxClose">Close</button></div><div id="cboxMiddleRight" style="float: left; height: 490px;"></div></div><div style="clear: left;"><div id="cboxBottomLeft" style="float: left;"></div><div id="cboxBottomCenter" style="float: left; width: 710px;"></div><div id="cboxBottomRight" style="float: left;"></div></div></div>

Not sure how the jQuery/ajax works but hoping that this will help point someone in the right direction. As you can see from the html when it works the embedded-video div is loaded with the iframe, however when not logged in or the site is not cached the plugin doesn't work.

Thanks
Max

I am facing the same error: "This content failed to load.", when trying to open a an external linkt to a webpage in an colorboxed iframe; this happens even without using media gallery.

I have the same problem, but I don't use Media Gallery, perhaps problem not in this module.