📸 Photo Gallery Builder

📸 Photo Gallery Builder - Help

🎨 Getting Started

• Upload Photos: Click "Choose Files" or drag and drop images into the upload area at the bottom
• Add Captions: Each photo has fields for a caption and description
• Choose Layout: Select from Grid, Masonry, Carousel, or Flex layouts
• Collapsible Sections: Click headers or collapse buttons on Tag Management and Filter sections to hide/show them

🔖 Tag System

• Create Tags: Use the Tag Management section to create color-coded tags
• Assign Tags: Type in the tag input field on each photo - autocomplete will suggest existing tags
• Multiple Tags: Each photo can have as many tags as you want
• Edit Tags: Click the pencil icon on any tag to change its name or color
• Delete Tags: Click the X;— on a tag in the Tag Management section to remove it from all photos
• Custom Colors: Pick a unique color for each tag for better visual organization

📦 Batch Selection & Tagging

• Select Photos: Click the checkbox in the top-left corner of any photo to select it
• Select Multiple: Click checkboxes on multiple photos - they'll highlight with a gold border
• Batch Action Bar: When photos are selected, a bar appears at the bottom with batch tools
• Batch Add Tags: Type a tag name in the batch bar and press Enter to add it to all selected photos
• Select All: Click "Select All" button to select all visible photos (respects filters)
• Clear Selection: Click "Clear Selection" or press Escape to deselect all
• Keyboard Shortcuts:
  • Ctrl/Cmd + A: Select all visible photos
  • Escape: Clear selection
• Autocomplete: The batch tag input also has autocomplete for existing tags

🔍 Filtering Photos

• Two Filter Zones: The filter section has two separate zones for different filtering behaviors
• Match ANY (OR): Click tags in the top zone to show photos with ANY of the selected tags
  • Example: Select "Nature" OR "Family" → shows photos that have either tag
• Match ALL (AND): Click tags in the bottom zone to refine and show only photos with ALL selected tags
  • Example: Select "2024" AND "Published" → shows only photos that have both tags
• Combine Both: Use both zones together for complex queries
  • Example: OR zone: "Nature" OR "Landscape", AND zone: "Favorites" → shows Nature OR Landscape photos that are also Favorites
• Active Filters: Selected tags appear brighter and scaled up
• Clear All Filters: One button clears both OR and AND filters
• Photo Count: The filter info shows exactly what's being filtered and how many photos match

✍ Editing Photos

• Caption: Add a short title for the photo
• Description: Add a longer description or context
• Delete: Remove any photo from the gallery
• View Full Size: Click any photo to see it in lightbox mode

🎨 Customization

• Theme: Toggle between dark and light modes
• Accent Color: Pick any color to customize the interface
• Layout Options:
  • Grid: Equal-sized tiles in a responsive grid
  • Masonry: Pinterest-style cascading layout
  • Carousel: Horizontal scrolling gallery
  • Flex: Flexible responsive grid

💾 Exporting Your Gallery

• Export Static HTML: Downloads a standalone, view-only HTML file
  • Perfect for sharing or publishing online
  • Includes tag filtering for viewers
  • Cannot add new photos or edit tags
  • Smaller file size
• Export Editable HTML: Downloads a fully functional gallery builder
  • Includes all current photos and tags pre-loaded
  • Can add more photos, create tags, and organize
  • Full tag management, filtering, and batch selection
  • Perfect for continuing work elsewhere or sharing with collaborators
  • Works offline - no internet required
• Export Data (JSON): Downloads your data as a portable JSON file
  • Contains all photos (with images as base64)
  • Includes all tags with names and colors
  • Preserves captions, descriptions, and tag assignments
  • Saves gallery settings and metadata
  • Can be imported into future versions of this app
  • Smallest file format, universal compatibility
  • Perfect for backing up your work
• ⚠️ Important: This app does not save to browser storage. Always export your work before closing the browser!

💡 Tips

• Export frequently! Your work is not saved automatically - export editable HTML or JSON data to preserve your progress
• Create tags before uploading photos for faster organization
• Use descriptive tag names (e.g., "Nature", "Family", "2024", "Favorites")
• Color-code related tags (e.g., all location tags in blue, all year tags in green)
• The autocomplete feature speeds up tagging - just start typing!
• Use batch selection to quickly tag multiple photos at once
• Combine OR and AND filters to create complex queries
• Use Ctrl/Cmd+A to quickly select all filtered photos for batch tagging
• Collapse Tag Management and Filter sections to maximize workspace when editing photos
• Export Static HTML for sharing with viewers only
• Export Editable HTML to continue work on another computer or collaborate with others
• The editable export includes everything - it's a complete portable gallery builder!
• Export Data (JSON) for backing up your work or importing into future app versions