# Creating lightboxes in articles

> Our themes offer convenient yet powerful lightbox functionality which can be added with a single click.

Source: https://www.zenplates.co/documentation/customization/creating-lightboxes-in-articles (Customization › Using theme settings)

When lightboxes are enabled through theme settings, a few things happen:

1. The lightboxes plugin script (Fancybox) is added to the theme in the `footer.hbs` template; and
2. The lightboxes script is added to the theme in the `footer.hbs` template; and
3. The lightboxes plugin styles are added to the theme in the `document_head.hbs` template.

The lightboxes script automatically converts all images within the content area into lightboxes by wrapping them in a link with the necessary lightbox markup. If this blanket functionality doesn't work for you, a better solution may be to:

- Disable lightboxes through theme settings.
- Add the necessary scripts and styles to the theme manually and then add your lightbox/Fancybox links as required.

In the `document_head.hbs` template you'd add the following:

```html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css" />
```

and in the `footer.hbs` template you'd add:

```html
<script type="text/javascript" src="https://cdn.jsdelivr.net/combine/npm/jquery@3.5.1/dist/jquery.min.js,gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>
```

You can then wrap images in a link:

```html
<a href="image.jpg" data-fancybox data-caption="An image within a lightbox">
  <img src="thumbnail.jpg" alt="An image within a lightbox" />
</a>
```

The thumbnail image and the main image can be the same if you like, but sometimes it makes sense to have the thumbnail be a smaller version of the larger one.
