GitHub
Jim Valentine
@f13dev
f13dev
Margate, UK
f13.dev
Joined March 28, 2016
Margate, UK
f13.dev
Joined March 28, 2016
Sorry, that page does not exist
Coders Rank
Automatically add a lightbox link to any images in your pages and posts.
After installing this plugin each image within a post or page will become a clickable link with a popup lightbox. If the image tag is wrapped in an anchor tag, the href of the anchor will be used to load the higher resolution image.
Rather than use a bloated “off the shelf” lighbox solution, F13 Lightbox has been writte from scratch and utilises 6kB of JavaScript to operate making it a very lightweight light box.
Accessible for keyboard and screen reader users!
As image tags are modified automatically it is unlikely that you will have to make changes to your pages and posts.
Simply add an image and F13 Lightbox will include it:
<img src="./image.jpg" alt="Description of image" />
If you wish to show a thumbnail on your website and have it link to a larger image, wrap the image tag in an anchor tag:
<a href="./image.jpg" title="Enlarge image"> <img src="./thumbnail.jpg" alt="Description of image" /> </a>
There may be times where you do not want a specific image to be included in the lightbox, simply add the class “no-lightbox” to your image tag and the image will not be included:
<img src="./image.jpg" alt="Description of image" class="no-lightbox" />
For an image wrapped in an anchor tag:
<a href="https://f13.dev" title="Enlarge image"> <img src="./thumbnail.jpg" alt="Description of image" class="no-lightbox" /> </a>
Installing is as simple as 1,2,3 –