Liuren Magic Sanctuary - Photo Gallery Management

πŸ“‚ Folder Structure

/images/gallery/
β”œβ”€β”€ 2026/
β”‚   β”œβ”€β”€ festival-apr-04/          # Lunar 3/18 Birthday (Apr 4, 2026)
β”‚   β”œβ”€β”€ festival-jul-05/          # Lunar 6/22 Attainment Day (Jul 5, 2026)
β”‚   β”œβ”€β”€ workshop-spring/          # Teaching sessions and workshops
β”‚   β”œβ”€β”€ guojiao-ceremony/         # Initiation ceremonies
β”‚   └── community-gathering/      # Community events and lineage meetings
β”œβ”€β”€ 2027/                         # Future year folders
└── README.md                     # This file

πŸ“Έ Adding New Images

Step 1: Prepare Images

Image Specifications:

Image Optimization Tools:

Remove EXIF Metadata (Privacy):

Step 2: Organize in Correct Folder

Place images in the appropriate event folder:

Create new folders as needed for different events.

Step 3: Update gallery-data.js

Open /gallery-data.js and add entries for each new image:

{
  id: "festival-apr-04-2026-01",
  src: "images/gallery/2026/festival-apr-04/altar-setup-01.jpg",
  caption: "六壬仙師θͺ•θΎ°ζ—₯ - Liuren Immortal Master Birthday celebration at Fuying Hall",
  captionZh: "六壬仙師θͺ•θΎ°ζ—₯ζ…Άη₯ - 伏英逨供ε₯‰η₯žε£‡",
  date: "2026-04-04",
  category: "festival",
  event: "Lunar 3/18 Birthday"
},

Field Descriptions:

Step 4: Upload to GitHub

Using Git command line:

# Navigate to project folder
cd path/to/Liuren

# Add new images
git add images/gallery/2026/

# Update metadata file
git add gallery-data.js

# Commit with descriptive message
git commit -m "Add photos from Festival Apr 4 2026"

# Push to GitHub
git push

Using GitHub Desktop:

  1. Open GitHub Desktop
  2. Select changed files (images + gallery-data.js)
  3. Write commit message
  4. Click "Commit to main"
  5. Click "Push origin"

Step 5: Verify on Website

After pushing, wait 1-2 minutes for GitHub Pages to rebuild, then visit:

πŸ›‘οΈ Image Protection & Privacy

What's Protected:

What's NOT Protected:

Privacy Guidelines:

Optional Watermarking:

To add watermarks to images before upload:

πŸ“Š Repository Size Management

Current Limits:

Best Practices:

Check Repository Size:

# Check folder size
du -sh images/gallery/

# Check total repo size
du -sh .git/

πŸ”„ Creating New Year Folders

When starting a new year:

# Create 2027 folder structure
mkdir -p images/gallery/2027/{festival,workshop,ceremony,community}

# Or create specific event folders
mkdir -p images/gallery/2027/festival-mar-24

❓ Troubleshooting

Images not showing on website:

  1. Check file path in gallery-data.js matches actual location
  2. Ensure file names don't have spaces or special characters
  3. Wait 2-3 minutes after push for GitHub Pages to rebuild
  4. Hard refresh browser (Ctrl+F5 / Cmd+Shift+R)

Images too large to upload:

  1. Resize to 1200px max width
  2. Compress to ~300KB per file
  3. Consider using JPG instead of PNG for photos

Git push fails:

πŸ“ž Need Help?

For questions about photo gallery management:

Last updated: December 2025