🐾 Bindi's Adventures — User Manual

Complete guide to managing the interactive map, calendar, gallery & postcard popups

📋 Table of Contents

  1. How It Works
  2. File Overview & Locations
  3. Understanding trips.json (All Fields)
  4. Using the Adventure Builder
  5. Editing an Existing Trip
  6. Editing trips.json Directly
  7. Editing from Your Phone (GitHub)
  8. Adding & Managing Photos
  9. The Postcard Popup (Flip Card)
  10. Stamp Icons (Per-Location)
  11. Map / Calendar / Gallery Views
  12. Tags & Filtering
  13. Publishing Changes (Git Push)
  14. Troubleshooting
  15. Fan Submissions ("Where's Bindi?")
  16. Quick Reference Cheat Sheet
  17. Custom Domains
  18. New Features Reference
  19. Backup & Disaster Recovery
  20. Park Database Admin (parks.json)
  21. Change Log

1. How It Works

Bindi's Adventures page (BindiTails.com/adventures.html) shows an interactive map, calendar, and photo gallery of all trips. It reads data from one file: trips.json.

To add/edit a trip: Update trips.json → push to GitHub → site updates in ~2 minutes automatically.

Key features:

2. File Overview & Locations

FileWhat It DoesEdit?
trips.jsonAll trip data (the only file you regularly edit)✅ Yes
adventures.htmlPublic map/calendar/gallery page❌ Don't touch
adventure-builder.htmlAdmin tool to create/edit trips❌ Don't touch
adventure-manual.htmlThis manual!❌ Don't touch
images/All photos for the site✅ Add photos here

📂 Two Copies — Kept in Sync

LocationPurpose
C:\BindiTails™\Live Git repo — push from here
C:\BindiTails™\website\Backup copy — same files, just in case
💡 Both folders have the same files. If you can't find something in one, check the other!

3. Understanding trips.json (All Fields)

Each trip is a JSON object. Here's the full schema with every field:

{
  "lat": 35.0456,
  "lng": -90.0490,
  "title": "Graceland — Memphis, TN",
  "date": "2025-08-09",
  "displayDate": "August 9, 2025",
  "caption": "Bindi channeled her inner Elvis 🕶️",
  "photo": "images/graceland.jpg",
  "photos": ["images/graceland.jpg", "images/graceland2.jpg"],
  "address": "Graceland, Memphis, TN",
  "directions": "https://www.google.com/maps/search/?api=1&query=Graceland",
  "link": "https://www.facebook.com/BindiTails™/posts/graceland",
  "aboutPlace": "Home of the King! Elvis lived here from 1957 until 1977.",
  "bindiThoughts": "10/10 would sniff again. Elvis had great taste. 🕶️",
  "postmark": "Memphis, TN",
  "stampIcon": "🎸",
  "tags": ["music", "landmark", "road trip"],
  "locationGroup": "Memphis"
}

Field Reference

FieldWhat It IsRequired?
lat / lngGPS coordinates (auto from map click)Recommended
titleName of the stop✅ Yes
dateDate in YYYY-MM-DD format✅ Yes
displayDateHow date shows on site ("August 9, 2025")Auto-fills
captionShort fun one-linerOptional
photoPrimary photo path (shown first)Optional
photosArray of ALL photo paths (enables carousel)Optional
addressHuman-readable address/place nameOptional
directionsGoogle Maps link (auto-generated from address)Auto-fills
linkSocial media post, website, any URLOptional
aboutPlaceFun fact about the locationOptional
bindiThoughtsBindi's diary entry (write in her voice!)Optional
postmarkCity/State for postcard stampAuto-fills from address
stampIconCustom emoji for the stamp (see Section 10)Optional (auto-picks)
tagsArray of category tags for filteringOptional
locationGroupGroup name for related stopsOptional
⚠️ JSON Rules — Don't Forget!

4. Using the Adventure Builder

EASIEST METHOD

🖥️ Go to: BindiTails.com/adventure-builder.html

  1. Click the map where the trip happened → lat/lng auto-fills
  2. Fill in: Title, Date, Caption
  3. Add photos: Type photo path + click "Add Photo" (add multiple!)
  4. Address: Type place name → directions link auto-generates
  5. Link: Paste Facebook/Instagram post URL
  6. About This Place: Fun fact about the location
  7. Bindi's Diary Entry: Write in Bindi's voice!
  8. Postmark City: e.g., "Memphis, TN" (auto-fills from address)
  9. Stamp Icon: Leave blank for auto-pick, or type an emoji
  10. Click "🐾 Add to trips.json"
  11. Click "⬇️ Download Updated trips.json"
  12. Replace the file in C:\BindiTails™\
  13. Push to GitHub (see Section 13)
💡 Duplicate detection: The builder warns you if a trip with the same title+date or same photo already exists.

5. Editing an Existing Trip

EASY

✏️ Edit Trip Feature (in the Builder)

  1. Open BindiTails.com/adventure-builder.html
  2. Click "📂 Load existing trips.json" → paste your current trips.json
  3. Find the trip in the list on the right
  4. Click the ✏️ Edit button next to it
  5. All fields load back into the form — make your changes
  6. Click "💾 Save Changes"
  7. Download the updated file and push

Use this to: Fix wrong photos, update diary entries, change addresses, add tags, etc.

6. Editing trips.json Directly

MEDIUM

📝 Quick Copy-Paste Method

  1. Open C:\BindiTails™\trips.json in Notepad or VS Code
  2. Copy an existing entry (everything from { to })
  3. Paste it before the last ]
  4. Add a comma after the previous entry's }
  5. Change the values to your new trip
  6. Save and push to GitHub

Adding multiple photos to a trip:

"photo": "images/graceland.jpg",
"photos": [
  "images/graceland.jpg",
  "images/graceland-bindi.jpg",
  "images/graceland-gates.jpg"
],
💡 The photo field is the "primary" (shown first). The photos array has ALL photos including the primary. The carousel shows ◀ ▶ arrows when there's more than one.

7. Editing from Your Phone (GitHub)

EASY

📱 No Laptop Needed

  1. Open: github.com/susanbuchanan-75287/BindiTails/edit/master/trips.json
  2. Log in with your GitHub account
  3. Edit the JSON (add/modify entries)
  4. Tap "Commit changes"
  5. Site auto-deploys in ~2 minutes! ✅

8. Adding & Managing Photos

Option A: Local images folder (recommended)

  1. Put the photo in C:\BindiTails™\images\
  2. Name it simply: graceland.jpg (lowercase, no spaces)
  3. In trips.json use: "photo": "images/graceland.jpg"
  4. Commit and push BOTH the image AND trips.json

Option B: Multiple photos per trip

  1. Add all photos to the images/ folder
  2. In trips.json, fill both fields:
"photo": "images/trip-main.jpg",
"photos": ["images/trip-main.jpg", "images/trip-2.jpg", "images/trip-3.jpg"]

Option C: Social media URL (quick but may break)

Right-click any photo on Facebook/Instagram → "Copy image address" → paste as the photo value.

⚠️ Social media links can break if the platform changes URLs. Local images (Option A) are more reliable.

9. The Postcard Popup (Flip Card)

When you click a paw marker on the map, it shows a flippable postcard:

📷 Front Side (Photo Side)

📮 Back Side (Stamp Side)

💡 Click anywhere on the postcard to flip it! The buttons also work.

10. Stamp Icons (Per-Location)

Each stamp automatically picks an icon based on the trip's tags or title:

Location TypeIconWhat Triggers It
Dog parks🐕Tag "dog park" or title contains "dog park"
Battlefields⚔️Tag "battlefield" or title contains "battlefield"
Museums🏛️Tag "museum" or title contains "museum"
Universities🎓Tag "university" or title contains "virginia tech"
Music landmarks🎸Title contains "graceland" or "elvis"
Pet stores🛒Tag "pet store" or title contains "petsmart"
Camps/daycare🏕️Tag "camp" or title contains "camp bow"/"dogtopia"
Bars/restaurants🍻Tag "bar" or title contains "bark bar"/"uptown pup"
Road stops🚗Tag "rest area" or title contains "rest area"/"quiktrip"
Parks/nature🌳Tag "park" or "nature"
Default🐾Anything else

Custom override:

To force a specific icon, add "stampIcon": "🎸" to the trip in trips.json, or fill in the "Stamp Icon" field in the builder.

11. Map / Calendar / Gallery Views

The adventures page has three views — toggle with the buttons at the top:

12. Tags & Filtering

Add tags to any trip in trips.json:

"tags": ["dog park", "dallas", "friends"]

The filter bar at the top of the adventures page lets visitors filter by tag. Tags also determine the stamp icon (see Section 10).

13. Publishing Changes (Git Push)

From your laptop — open PowerShell or Terminal:

cd C:\BindiTails™
git add .
git commit -m "Add new trip: Graceland"
git push origin master

The full workflow:

  1. Make your changes (edit trips.json, add images)
  2. Open PowerShell (right-click Start → Terminal)
  3. Run the commands above (change the commit message to describe what you did)
  4. Wait 1-3 minutes → check the live site

If git says "nothing to commit":

Your changes are already pushed! Check the live site.

If git asks for credentials:

Use your GitHub username and a Personal Access Token (not your password). You can create a token at: github.com/settings/tokens

💡 Don't forget the backup! After pushing, also copy the changed files to C:\BindiTails™\website\ so both locations stay in sync.

14. Troubleshooting

Map is blank / no pins showing

Photo not showing

Postcard not flipping

Changes not appearing on live site

Stamp showing wrong icon

15. Fan Submissions ("Where's Bindi?")

Fans email photos to Hello@BindiTails.com via the button on the homepage.

  1. Save the photo to C:\BindiTails™\images\
  2. Open the Adventure Builder
  3. Fill in details from the email → Add to trips
  4. Download, replace, push
⚠️ Check that fan photos are appropriate before posting. No kids' faces without permission!

16. Quick Reference Cheat Sheet

🚀 Add a New Trip (5 Steps)

  1. Go to BindiTails.com/adventure-builder.html
  2. Click map + fill form + "Add to trips.json"
  3. Download updated trips.json
  4. Replace C:\BindiTails™\trips.json
  5. Push: cd C:\BindiTails™ && git add . && git commit -m "New trip" && git push origin master

✏️ Fix a Mistake (5 Steps)

  1. Open builder → Load trips.json → click ✏️ Edit on the trip
  2. Make changes → "💾 Save Changes"
  3. Download → Replace → Push

📷 Add Photos to Existing Trip

  1. Put photo(s) in C:\BindiTails™\images\
  2. Edit trips.json — add paths to the "photos" array
  3. Push (commit both the image files AND trips.json)

🔗 Important Links


17. Custom Domains

🌐 Domain Names (Porkbun — registered May 2026)

DomainPurposePoints To
BindiTails.com🏠 Primary siteGitHub Pages (custom domain)
BindiTails.dog🐕 Alternate/fun domainURL forward → BindiTails.com
barkparks.dog🗺️ Bark Ranger MapsURL forward → BindiTails.com/trail-maps.html
binditales.dog🔀 Typo protectionURL forward → BindiTails.com

Primary Site: BindiTails.com (GitHub Pages)

🐕 .dog Domains — All URL Forwards via Porkbun

🔥 Disaster Recovery — If Redirects Break

  1. Log in to Porkbun: porkbun.com — username: buchana3
  2. Go to Domain Management → click the affected domain
  3. URL Forwarding tab → re-enter the forward URL from the list above
  4. Leave wildcard checked ✅
  5. If main site (BindiTails.com) is down: Check GitHub Pages settings — ensure custom domain is set and HTTPS enforced

Email Forwarding (Future — not yet set up)

Account Access

🛠️ Troubleshooting Guide

ProblemCauseFix
BindiTails.com shows 404 "no GitHub Pages site here" CNAME file missing from repo, or GitHub Pages custom domain setting cleared 1) Check repo has CNAME file containing BindiTails.com
2) Go to Settings → Pages → re-enter BindiTails.com → Save
3) Ensure "Enforce HTTPS" is checked
BindiTails.dog / barkparks.dog shows "connection not secure" Porkbun SSL certificate hasn't provisioned yet (takes 10-15 min after setting up forwards) Wait 15 minutes. If still broken: Porkbun → Domain → SSL tab → check status. The _acme-challenge TXT records handle auto-provisioning.
BindiTails.dog doesn't redirect at all URL forwarding not set or DNS records wrong Porkbun → Domain Management → BindiTails.dog → URL Forwarding → should show forward to https://BindiTails.com. If DNS tab shows A records pointing to 185.199.x.x, delete them — those conflict with forwarding.
barkparks.dog goes to wrong page Forward URL incorrect Porkbun → barkparks.dog → URL Forwarding → should be https://BindiTails.com/trail-maps.html
Site loads but looks broken (no CSS/images) Mixed content or wrong base URL Hard refresh (Ctrl+Shift+R). Check browser console for errors. All links should be relative (no hardcoded domain in HTML).
Changes not showing on live site Didn't push to GitHub, or Pages hasn't rebuilt 1) git push origin master
2) Check Actions tab for build status
3) Hard refresh browser (Ctrl+Shift+R)
4) Wait 2-5 min for GitHub Pages deploy
"DNS check unsuccessful" in GitHub Pages settings DNS propagation delay or wrong records Wait 5-10 min, click "Check again". Verify with dnschecker.org that A records show 185.199.108/109/110/111.153
Domain expired / not renewing Auto-renew off or payment failed Porkbun → Domain Management → check auto-renew is ON for all 3 .dog domains. Update payment method if needed.

💡 Pro tip: If something breaks and you're panicking — the site still works at susanbuchanan-75287.github.io/BindiTails while you fix the custom domain. That URL always works.

18. New Features Reference

📱 QR Check-In System

🏆 Pack Leaders (Leaderboard)

💎 Hidden Gems

ℹ️ NPS Pet Policy Popup

🏛️ BARK Rangers Filter

🔗 Gem Deep-Linking

📤 Social Sharing (Nearby Places)

19. Backup & Disaster Recovery

💾 How Your Site Is Backed Up

LocationWhatProtection Level
GitHub.com (cloud) Full site code + every version ever committed ☁️ Survives house fire, laptop death, everything. This is your #1 backup.
C:\BindiTails™\BindiTails™\ (laptop) Working copy with uncommitted changes 💻 Local only — lost if laptop dies. Push often!
Firebase Firestore (cloud) User check-ins, stamps, leaderboard data ☁️ Google-managed. Automatic backups.
💡 Golden Rule: If it's been pushed to GitHub, you cannot lose it. Git keeps EVERY version of EVERY file forever. Even deleted files can be recovered.

🔄 How to Make a Safe Backup (Before Risky Changes)

Before making big changes, create a safety branch:

  1. Open terminal in C:\BindiTails™\BindiTails™\
  2. git checkout -b backup-may31 (creates a named snapshot)
  3. git checkout master (go back to working branch)
  4. Now make your changes on master. If things break:
  5. git checkout backup-may31 -- . (restores ALL files from backup)
  6. git commit -m "Reverted to backup" && git push origin master
💡 Quick undo (last commit only): git revert HEAD --no-edit && git push origin master

🤦 "I Fat-Fingered Something" — Quick Fixes

MistakeFix
Deleted a file by accident git checkout HEAD -- filename.html (restores from last commit)
Messed up a file and already saved git checkout HEAD -- filename.html (same — resets to last pushed version)
Pushed something broken to live site git revert HEAD --no-edit && git push origin master
(un-does last commit, pushes fix)
Deleted CNAME file (site goes 404!) Create file CNAME containing just BindiTails.com
git add CNAME && git commit -m "Restore CNAME" && git push origin master
Wait 30-60 seconds for site to come back.
Accidentally committed secrets/passwords Change the password immediately. Then: git revert HEAD --no-edit && git push. Note: the old version still exists in git history — that's why you change the password FIRST.
Everything is broken and I don't know what I did Nuclear option: git log --oneline -10 (find last good commit), then git reset --hard abc1234 && git push --force origin master. ⚠️ This erases recent history!

🔥 Full Disaster Recovery (Laptop Stolen/Destroyed)

Everything you need to rebuild from scratch:

  1. Get a new computer — Windows, Mac, or Linux all work
  2. Install Git: git-scm.com/downloads
  3. Clone the site:
    git clone https://github.com/susanbuchanan-75287/BindiTails.git
    (This downloads EVERYTHING — all files, all history, the entire site)
  4. That's it. The site is still live on GitHub Pages the whole time. Nothing was lost.

Account Access You'll Need:

ServiceUsernameWhere Passwords Live
GitHub susanbuchanan-75287 Your email for password reset
Porkbun (.dog domains) buchana3 Email: susanabuchanan@yahoo.com
GoDaddy (BindiTails.com DNS) Your GoDaddy account Same email for reset
Firebase (check-in data) Google account Project: see admin.html for project ID
ElevenLabs (voice) API key in environment variable Regenerate at elevenlabs.io if lost
⚠️ CRITICAL FILES — Never delete these:
  • CNAME — contains BindiTails.com. Site goes 404 without it!
  • data/parks.json — all 209 parks (your main database)
  • trips.json — all adventures
  • index.html — homepage

📋 Monthly Maintenance Checklist

20. Park Database Admin (parks.json)

📍 File Location & Structure

File: data/parks.json — currently 209 parks

Each park object has these fields:

FieldTypeDescription
namestringDisplay name (must be unique)
statestring2-letter code: TX, CA, PR, DC, etc.
lat, lngnumberGPS coordinates (Google Maps → right-click → "What's here?")
visitedbooleantrue if Bindi has been there
bucketbooleantrue if it's on the bucket list
npsbooleantrue = official NPS BARK Ranger park
rulesstringDog rules summary
descstringShort description
websitestringPark website URL
imgstringImage URL (or "" for auto-generated)

➕ Adding a New Park

Open data/parks.json and add to the end of the array (before the last ]):

{
  "name": "My New State Park",
  "state": "TX",
  "lat": 30.1234,
  "lng": -97.5678,
  "visited": false,
  "bucket": true,
  "nps": false,
  "rules": "Leashed dogs on all trails.",
  "desc": "Beautiful park with great hiking.",
  "website": "https://example.com",
  "img": ""
}
💡 How to get lat/lng: Google Maps → right-click the park → "What's here?" → copy the numbers.
💡 nps: true vs false: Set nps: true ONLY for official NPS sites that have the BARK Ranger program. State parks, local dog parks = nps: false

✏️ Marking a Park as Visited

Find the park in data/parks.json, change:

"visited": false  →  "visited": true

Then commit and push:

git add data/parks.json
git commit -m "Mark [Park Name] as visited"
git push origin master

🗺️ Map Filter Reference

Filters on trail-maps.html:

ButtonShowsLogic
🌍 All ParksEverything (209)No filter
🏛️ BARK RangersNPS parks you haven't visited or bucket-listednps && !visited && !bucket
🐾 Bindi's VisitedParks Bindi has been tovisited === true
🎯 Bucket ListDream parks to visitbucket === true
🐕 Local & FunNon-NPS parks (state/local/dog parks)nps === false
📍 Not Yet ExploredParks not visited AND not on bucket list!visited && !bucket

Type filters (second row): Dog Parks, National Parks, State Parks, Historic, Trail, Beach, Forest, Zoo

Zoom behavior: BARK Rangers and All Parks exclude Alaska/Hawaii from zoom bounds so contiguous US fills the screen. If geolocation is on, filters zoom to your nearest parks.

💎 Managing Hidden Gems

File: hidden-gems.html — edit the hiddenGems array (~line 160-398)

Also in: trail-maps.html — the nearbyGems array (~line 791-823)

⚠️ Keep both in sync! If you add a gem to hidden-gems.html, also add name/lat/lng/state/type to the nearbyGems array in trail-maps.html so it appears on park popup cards.

Gems link format: hidden-gems.html#Gem Name (URL-encoded). The page auto-scrolls and highlights.

📊 Current Park Inventory (as of May 31, 2026)

21. Change Log

📝 Recent Changes

DateChangeCommit
May 31, 2026 Terms & Privacy footer link added to ALL 14 public pages + nav links fixed on gallery/shop/activities/hidden-gems 61afd7f
May 31, 2026 Nav consistency: fixed Adventures & Bark Ranger pages to match site-wide nav (Hidden Gems, Pack Leaders, Check-In links) 2b9a14b
May 31, 2026 BARK Map: default shows US (not bucket list), type icons horizontal above map, removed personal filters (Visited/Bucket/Local) 8bea958
May 31, 2026 Hidden Gems: Unsplash photos on all cards, postcard popup modal (photo LEFT + info RIGHT), share button, removed BringFido links 278f244
May 31, 2026 BARK Map: WCAG accessibility — ARIA roles, 44px touch targets, sr-only labels, focus-visible outlines 7850b6e
May 31, 2026 BARK Map: side-by-side layout (filters sidebar LEFT, map RIGHT) 7884e1b
May 31, 2026 Added Graceland Memphis TN (confirmed dog-friendly, visited) — 344 total 6f4b27d
May 31, 2026 🎉 ALL 50 STATES + DC + PR covered! 343 total parks/gems 0e00e62
May 31, 2026 Added OH/MI/VA gems: Colonial Williamsburg, Lakenenland, Field of Corn (303) 8e6a29b
May 31, 2026 Added hidden gem photo ops: LOVE signs, WV swings, roadside icons (289-295) d549f86
May 31, 2026 Added 64 state parks (30 WV + 34 nationwide) + Cadillac Ranch (274) 30871f0
May 31, 2026 Added 15 state parks + 2 Puerto Rico NPS sites (209 total) 72d8a38
May 31, 2026 BARK Rangers filter: excludes visited/bucket, zooms contiguous US only 72d8a38
May 31, 2026 NPS info panel: translucent glass + forced black text 72d8a38
May 31, 2026 Gem links are now clickable (direct link to hidden-gems.html#name) a99cd9c
May 31, 2026 SMS/Facebook/Messenger share on nearby place cards e39c3a5
May 31, 2026 Website + phone + directions on nearby hotels/dining/activities 402e410
May 31, 2026 Replaced useless NPS filter with Local & Fun + Not Yet Explored 402e410
May 31, 2026 Added Backup & Disaster Recovery section + DISASTER-RECOVERY.md b295dc3
💡 To see full history: git log --oneline -30 in terminal, or visit GitHub Commits

🐾 Bindi Tails Adventure Manual • Last updated: June 1, 2026
Need help? Open Copilot and ask! Or email Hello@BindiTails.com