Simple Image Gallery - WordPress Plugin

A simple image gallery plugin for WordPress. Tell your story with beautiful sectioned image galleries.

Are your photos just sitting on your mobile device, Dropbox or iCloud? Share your stories by creating simple, stunning image gallery pages.

Simple Image Gallery is designed for one-page story telling. Organize your photos in sections. Add a title and description + optional captions to develop your narrative. Turn family, travel, event or product photos into stories worth sharing.

Features

✨ Core Features:

• Create unlimited photo galleries with custom post type
• Add gallery title and description
• Set a hero/header image with overlay text
• Divide photos into sections with subtitles and descriptions
• Drag-and-drop photo organization
• Add captions to individual photos
• Beautiful lightbox for full-size viewing
• Fully responsive and mobile-friendly
• Keyboard navigation support

Installation

1. Download the plugin ZIP file or clone this repository
2. Upload the simple-image-gallery folder to /wp-content/plugins/
3. Activate the plugin through the 'Plugins' menu in WordPress
4. You'll see a new "Photo Galleries" menu item in your WordPress admin

Usage

Creating a Gallery

1. Navigate to Photo Galleries → Add New
2. Add Gallery Title - Enter your gallery name (e.g., "Pancake Party")
3. Add Description - Write a description that appears below the title
4. Choose Header Image - Select a hero image for your gallery header

Adding Sections

1. Click "Add Section" button
2. Enter a Section Title (e.g., "Flipping Pancakes")
3. Add a Section Description to tell the story
4. Click "Add Photos" to select images from your media library
5. Organize photos by dragging and dropping

Photo Management

Each photo has two options accessible via the overlay controls:

• ✏️ Edit Caption - Add a caption that appears on hover
• 🗑️ Remove - Delete photo from the gallery

Organizing Content

• Drag sections using the handle to reorder them
• Drag photos within sections to change their order
• Collapse/expand sections using the toggle button
• Delete sections using the trash icon

Viewing Your Gallery

Once published, your gallery will display with:

• Hero image with title and description overlay
• Clean, grid-based photo layout
• Sectioned content with titles and descriptions
• Lightbox functionality for full-size viewing
• Keyboard navigation (arrow keys, home, end)

Customization

Styling

The plugin includes clean, minimal styles that should work with most themes. You can override styles by adding custom CSS to your theme:

/* Customize gallery header */
.pgs-gallery-header {
    min-height: 600px;
}

/* Customize section titles */
.pgs-section-title {
    color: #your-color;
    font-size: 36px;
}

/* Customize photo grid */
.pgs-photos-grid {
    gap: 30px;
}

Template Override

You can override the gallery template by copying templates/single-gallery.php to your theme:

your-theme/
  photo-gallery-sections/
    single-gallery.php

Technical Details

Post Type

• Slug: photo_gallery
• Public: Yes
• REST API: Enabled
• Supports: title, thumbnail

Meta Keys

• _pgs_gallery_description - Gallery description text
• _pgs_header_image - Header image attachment ID
• _pgs_sections - JSON array of sections with photos

Dependencies

• Backend: WordPress Media Library, jQuery UI Sortable
• Frontend: GLightbox 3.2.0 (loaded from CDN)

Browser Support

• Chrome, Firefox, Safari, Edge (latest versions)
• Mobile browsers (iOS Safari, Chrome Mobile)
• Graceful degradation for older browsers

Shortcode Support

You can embed galleries anywhere using the shortcode:

[photo_gallery id="123"]

Or by gallery slug:

[photo_gallery slug="australia-adventures"]

Performance

The plugin is optimized for performance:

• Lazy loading for images
• Minimal JavaScript and CSS
• No jQuery dependency on frontend
• CDN-hosted lightbox library
• Optimized database queries

Development

File Structure

simple-image-gallery/
├── assets/
│   ├── css/
│   │   ├── admin-style.css
│   │   └── frontend-style.css
│   └── js/
│       ├── admin-script.js
│       └── frontend-script.js
├── includes/
│   ├── class-gallery-meta-boxes.php
│   └── class-gallery-frontend.php
├── templates/
│   └── single-gallery.php
├── photo-gallery-sections.php
└── README.md

Hooks and Filters

Actions:

• pgs_before_gallery_header - Before header output
• pgs_after_gallery_header - After header output
• pgs_before_section - Before each section
• pgs_after_section - After each section

Filters:

• pgs_gallery_data - Modify gallery data
• pgs_photo_sizes - Change image sizes used
• pgs_lightbox_settings - Customize lightbox options

Frequently Asked Questions

Q: Can I use this with Gutenberg/Block Editor? A: Yes! The plugin uses a custom post type that works with both classic and block editors.

Q: How many photos can I add? A: There's no hard limit, but for best performance, we recommend keeping galleries under 100 photos.

Q: Can I export/import galleries? A: Currently, you can export galleries using standard WordPress export tools. Import functionality may be added in future versions.

Q: Does it work with WooCommerce? A: The plugin is standalone and doesn't integrate directly with WooCommerce, but you can link products to galleries.

Changelog

Version 1.0.0

• Initial release
• Custom post type for galleries
• Section management with drag-and-drop
• Photo organization with hero images
• Caption support
• GLightbox integration
• Responsive design
• Keyboard navigation

Credits

• Developed by Tyron Love
• Uses GLightbox by biati-digital
• Inspired by Simple.photo

License

GPL v2 or later

Support

For support, bug reports, or feature requests, please open an issue on SourceTube or contact the developer.

---

Enjoy creating beautiful photo stories! 📸