More Premium Hugo Themes Premium React Themes

React Photoswipe Gallery

React component wrapper around PhotoSwipe

React Photoswipe Gallery

React component wrapper around PhotoSwipe

Author Avatar Theme by dromru
Github Stars Github Stars: 558
Last Commit Last Commit: Mar 20, 2025 -
First Commit Created: Aug 8, 2025 -
default image

Overview

React-PhotoSwipe-Gallery is a powerful and flexible React component designed to simplify the integration of the popular PhotoSwipe image gallery into your React applications. The component is currently compatible with PhotoSwipe v5, making it a robust choice for developers looking to enhance their projects with a dynamic and feature-rich photo browsing experience. Whether you’re showcasing a portfolio, an e-commerce gallery, or simply a collection of images, this wrapper offers ample customization options to fit your needs.

With its thoughtful design and array of configuration features, React-PhotoSwipe-Gallery empowers developers to create engaging and interactive image galleries. It’s an excellent tool for those who want to leverage the full potential of PhotoSwipe while utilizing the benefits of React’s component-based architecture.

Features

  • Hash Navigation: Facilitates unique ID props for each <Gallery /> component, enabling seamless navigation with hash links.

  • Captions Support: Easily add captions to your images with the withCaption prop and customize each caption using HTML.

  • Plugin Compatibility: Leverage existing PhotoSwipe plugins with the plugins prop, allowing for extended functionalities like dynamic captions.

  • Custom UI Elements: Personalize the gallery’s interface by incorporating custom UI components through the uiElements prop.

  • Custom Slide Content: Utilize the content and html props to insert tailored slide content for a uniquely engaging viewer experience.

  • Versatile Data Source: Use the dataSource prop to manage slides efficiently, rendering thumbnails and full images from a single source.

  • Instance Access: Gain direct access to the PhotoSwipe instance through onOpen and onBeforeOpen props, facilitating event subscription and method invocation.

  • Customization Options: Tailor PhotoSwipe settings and styling with the options prop for a personalized gallery experience.