Q: Fancybox dynamic href but no prev/next arrows are showing? I have fancybox setup so it is dynamically getting the href from a data-attribute, like below. This is working fine, expect no prev/next arrows are showing when the image pops up in fancybox, so I can't go forward or backward. 
How do I get the arrows to show aswell? The rel is currently set as rel="photos" so should be grouped/arrows showing?
        $(".fancybox-photos").each(function () {
            $(this).fancybox({
                href: $(this).data('real-href'),
                afterLoad: function(current, previous) {

                    // Get the slug for the next image
                    var nextImageFullUrlSlug = current.element.data('image-slug');

                    // Update the URL in the browser (but don't reload page)
                    if (history.pushState) {
                        window.history.pushState('', '', nextImageFullUrlSlug);
                    } else {
                        // This is a fall back if pushstate is not supported in browser.
                        document.location.href = nextImageFullUrlSlug;
                    }

                }
            });
        });

My HTML is setup like this:
<% loop $Photos %>

    <a id="$ID" rel="photos" data-real-href="$Image.FitMax(1920,1080).URL" href="$resolveSlugToUrl" class="fancybox-photos" data-image-slug="{$Up.Link}photos/$Slug">

        $Image.SrcSetTag('croppedImage', 395,263, 'FFFFFF', $Caption)

    </a>

<% end_loop %>

I'm using Silverstripe CMS to dynamically loop through data etc.
