Help Guide

Back to Gallery

Gallery Views Everyone

Use the four view buttons in the top toolbar to change how images are displayed.

Masonry Variable-height cards arranged in columns. Photos keep their original proportions. Best for a natural browsing feel.
Grid Fixed square cards with cropped previews. Clean and uniform — great for a large library.
List Vertical list with a small thumbnail and file details. Useful for quickly finding a specific file by name or date.
Carousel A single large image fills the screen with left/right arrows. Swipe left or right on touch screens.

Image Size & Sort Order Everyone

Image Size Slider

The slider in the toolbar adjusts the target width of gallery cards from 100 px to 600 px. Drag right for larger cards, left for smaller. Works in all views.

Sort Order

Use the sort dropdown to change the display order:

  • Date (newest) – most recently modified files first.
  • Date (oldest) – oldest files first.
  • Name (A–Z / Z–A) – alphabetical by filename.
  • Size (largest / smallest) – by file size in MB.
  • Images first / Videos first – groups media type at the top.

Your chosen sort order is saved for your next visit.

Hover Effects Everyone

Pick the animation that plays when you hover a gallery card:

  • Zoom – card image gently zooms in.
  • Pan up – image pans upward to reveal the bottom.
  • Grayscale – image desaturates; colour returns on hover-out.
  • Tilt – subtle 3D tilt following the mouse.
  • Flash – brief white flash then zoom.
  • None – no animation.

Your choice is saved automatically.

Themes Everyone

Click the colour circles in the toolbar to switch the gallery theme:

  • Default – dark blue-grey (the standard look).
  • Dark – pure charcoal dark.
  • Black – full OLED black.
  • White – light mode.

The selected theme is stored in your browser and applied instantly on every visit, before the page renders, to prevent any flash.

Recent Uploads Everyone

A horizontal strip at the top of the page shows the most recently added files. Click any card to open it in the lightbox. Hover (or tap on mobile) to see the date and file size.

The number of items shown in the recent strip is set by the site administrator.

VIP Access Everyone

Some galleries contain code-protected private content (VIP groups). To unlock them:

  1. Click the VIP button in the top-right toolbar.
  2. Enter the access code you were given.
  3. Click Unlock. The VIP section appears between the recent strip and the main gallery.

You can unlock multiple VIP groups at once — just open the VIP dialog again and enter another code. Unlocked groups remain active for your browser session.

The sections below describe features only available after logging in as admin. Regular visitors will not see these controls.

Logging In Admin

Click the Admin Login button in the top-right corner of the toolbar. Enter your PIN in the dialog that appears and click Login.

Once logged in you will see:

  • An Admin shield badge in the toolbar.
  • A Select button (batch operations).
  • A gear icon to open the Admin Panel.
  • A logout button.
  • Edit and Delete buttons inside the lightbox.
Security tip: Always log out when you are done, especially on a shared or public device.

Admin Panel Admin

Click the gear icon in the toolbar to open the Admin Panel. It slides down from the top of the page. Click the × or the gear icon again to close it.

The panel is divided into three tabs:

  • Tools – maintenance actions and activity log.
  • Files – upload new media and view gallery statistics.
  • Display – toggle visibility of UI sections and adjust spacing.

Admin Panel → Tools Tab Admin

Clear Thumbnail Cache Deletes all server-generated thumbnail images inside the thumbs/ folder. Thumbnails are rebuilt on-demand the next time each image is viewed. Run this after manually replacing or rotating source images.
Compress Images Re-encodes all JPEG and PNG images using PHP GD at 80 % quality. Reduces file sizes without a visible quality drop. Videos are skipped. This operation modifies the source files — run it once after initial upload.
Check Compression Scans all images and reports their current file sizes to the log without changing anything. Use this before running Compress Images to assess potential savings.
VIP Groups Opens the VIP group manager inline. See the VIP Groups section below for full details.
Logs A collapsible panel showing the output of all admin actions performed in the current session (uploads, compressions, deletions, etc.). Click the Logs header to expand or collapse. Use Clear to wipe the log.

Admin Panel → Files Tab Admin

Upload Files

Upload images and videos directly through the browser. Three ways to add files:

  • Drag & drop – drag files from your file manager and drop them onto the dashed upload area.
  • Click the upload area – opens your device's file browser. Select multiple files with Ctrl/Cmd + click.
  • Camera button (mobile only) – opens your device camera to take a photo or video and upload it immediately.
  • Gallery button (mobile only) – opens your device's photo library so you can select multiple images/videos to upload.

As files upload, a thumbnail row shows each file's progress. Green outlines = success; red outlines = failed. A progress bar at the bottom tracks overall completion.

Once all uploads finish, click Done to refresh the gallery.

Supported formats: JPEG, PNG, GIF, WebP (images) · MP4, MOV, WebM (videos).

Gallery Stats

A live snapshot of the gallery content:

  • Image count and total image size on disk.
  • Video count and total video size on disk.
  • Combined total size.
  • Date and time of the most recent upload.
  • Number of users, comments, and tags (if applicable).

Admin Panel → Display Tab Admin

These settings take effect immediately in the live gallery and are saved to your browser so they persist across sessions.

Display Settings (Toggles)

Title Neon GlowEnables or disables the animated neon glow effect on the page title.
Top Header (logo + title)Show or hide the hero section containing the site logo, main title, and subtitle text.
Recent Uploads SectionShow or hide the horizontal recent-files strip at the top of the page.
Search BarShow or hide the search and filter bar above the main gallery.
Hover: Date & SizeShow or hide the date and file-size overlay that appears when hovering a gallery card.
Show filename on hover – RecentsDisplay the filename on hover inside the Recent Uploads strip.
Show filename on hover – GalleryDisplay the filename on hover inside the main gallery grid.

Layout Spacing (Sliders)

Gallery GapControls the spacing (0–32 px) between cards in the gallery grid and the recent strip. The current value is shown next to the label.
Card RadiusControls the corner rounding (0–32 px) of gallery cards and other UI elements. Set to 0 for sharp corners, or 32 for fully pill-shaped.

Batch Selection Admin

Click the checkbox icon in the toolbar to enter selection mode. In this mode:

  • Click any gallery card to select it (a blue checkbox appears). Click again to deselect.
  • A sticky action bar appears at the bottom of the page showing how many files are selected.

Action bar buttons:

  • Select All – select every visible file in the gallery.
  • Deselect All – remove all selections.
  • Delete Selected – permanently delete all selected files. A confirmation prompt appears first.
  • Add to VIP – assign selected files to a VIP group (see below).
  • Cancel – exit selection mode without any action.
Warning: Deletion is permanent and cannot be undone. Make sure you have backups before bulk-deleting files.

Edit & Delete from Lightbox Admin

When viewing an image in the lightbox, two extra buttons appear in the toolbar:

Edit Image Opens the image editor. Available operations: Rotate Left (90°), Rotate Right (90°), Rotate 180°, Flip Horizontal, Flip Vertical. Changes are applied server-side to the source file and the thumbnail cache is cleared automatically.
Delete Permanently deletes the currently viewed file from the server. A confirmation prompt appears. The lightbox closes automatically and the gallery refreshes.

Managing VIP Groups Admin

VIP groups are code-protected collections of images shown between the recent strip and the main gallery — only to users who enter the correct code.

Creating a Group

  1. Open the Admin Panel → Tools tab.
  2. Click Manage Groups on the VIP Groups card.
  3. Enter a Group name (displayed to the visitor after unlocking) and an Access code.
  4. Click + Create. The new group appears in the list immediately.

Adding Files to a Group

Method A – Batch selection:

  1. Enter selection mode (checkbox icon in toolbar).
  2. Click the files you want to add.
  3. Click Add to VIP in the bottom bar.
  4. Choose the target group from the picker that appears.

Method B – From the VIP manager: assign files directly by group using the options inside the VIP manager panel.

Deleting a Group

Click the Delete button next to a group in the VIP manager. This removes the group and its code but does not delete the actual image files — they return to the main gallery.

Tip: Files assigned to any VIP group are automatically hidden from the main gallery for non-admin visitors. Only admins see all files at all times.

Logging Out Admin

Click the logout arrow button at the far right of the toolbar (next to the gear icon). The session is cleared on the server, the page reloads, and all admin controls are hidden.

Note: Display settings (toggles, sliders, theme, sort order, hover effect) are stored in your browser's localStorage, not in the admin session. They persist after logout and can be adjusted by any visitor with access to the URL.