Frontity lightbox for wp content images

🙋Get Help
1

Hi,
I am new at Frontity and React.

I’m trying to apply lightbox or any overlay function for images within wordpress posts when using gallery block within Wordpress. Can someone help me go in the right direction in achieving this? Is this maybe built-in? It can also just be a new page with next and prev buttons to navigate through the images.

Thanks,
Grimur

2

Hi! Although there is no built-in solution, it would not be complicated to achieve what you are trying to do by using some react package. I give you two packages that will be very useful for you, both with good documentation:

1 Like
3

Thank you for the input :slight_smile: I managed to do this. I went with “Simple-react-lightbox”.

1 Like
4

Just wanted to put it here in case someone else is looking for a similar solution.

  1. Install the package
npm install --save simple-react-lightbox
  1. add the following line to post.js
import SimpleReactLightbox, { SRLWrapper } from 'simple-react-lightbox'
  1. add the following around 
<SimpleReactLightbox>
  <SRLWrapper>
   <Html2React html={post.content} />
  </SRLWrapper>
</SimpleReactLightbox>

That should be enough, you can also style it to your liking.

2 Likes