Adding Lightbox Support to Anchor

Previously, the images weren't ideal on the blog. While they were typically large enough if viewing it on a desktop computer, it didn't work great on phones, because you couldn't expand the images in any way. For Dog-a-Day, in viewing previous images I used a lightbox solution called FancyBox. They recently released their 3rd version which was mobile first, so I figured I'd add it to the blog.

Adding support was remarkably easy. First, I added the import scripts below:

to the footer.php file of the theme after I load in jQuery. Then, I just had to adapt the markdown.php script in Anchor to add the proper tags around it. This was done by simply appending the line $result = "<a data-fancybox='gallery' href='$url'>$result</a>"; in the '_doImages_inline_callback' function in the anchor/libraries/markdown.php file.

Above is a sample image, that you can use to test the new lightbox display.