Member Avatar for Squidge

Hi All,

I am creating an "About Us" portfolio page for a company. On this page will be a small bio and a photo.

The bio is not a problem, uploading and storing/calling the image is not a problem, as i already have code i can reuse.

The part i am struggerling to get my head around, as just cant seem to imagine the functions, is how to choose/select a photo to link to the bio from what is available in a "photo" folder on the server.

Images would need to be changable -> this would be from an Admin section.

I am not after code, just a kinda flow process.

Thanks in advance.

  • 3 Contributors
  • 3 Replies
  • 194 Views
  • 1 Hour Discussion Span
  • Latest Post Latest Post by Squidge

Dani AI

Generated

A practical, production-ready pattern is to separate image files from the link that a bio uses: keep files on disk (or object storage) and keep a small images table with metadata (filename, alt text, sizes, uploader, timestamp). 's "change image → thumbs → select → update DB" is the right UI pattern, and 's point about enumerating the photo folder can be the source of images when first importing — but avoid scanning the raw folder on every admin page load.

A concise admin workflow:

  1. Admin area shows bios with an Edit action.
  2. Edit opens a modal/gallery (thumbnails + metadata). Thumbnails should be clickable, but also include an explicit Select button for accessibility and keyboard users.
  3. Selecting an image updates the bio record to point at an image_id (not a raw filename), shows an immediate preview, and records the previous image for rollback.
  4. New uploads create an original plus pre-generated resized thumbnails, populate the images table, and appear in the gallery.
  5. On save, invalidate caches or change the image filename/version to force CDN/browser refresh.

Key operational notes and cautions:

  • Generate thumbnails at upload time and serve them instead of on-the-fly resizing for performance.
  • Validate MIME types, limit file size, strip executable bits and unsafe EXIF data, and store files with collision-free names (UUIDs or hashes).
  • Prefer keeping metadata in the DB so the gallery can sort/filter (by date, unused, uploader) without expensive directory scans; run a periodic job to detect and cleanup orphaned files.
  • Keep a default fallback image for missing files and implement simple versioning (or store previous image_id) so changes can be rolled back quickly.

Common gotchas: scanning a large folder on each admin request is slow; caching the gallery list or reading metadata from the DB fixes this. Also ensure admin-only endpoints are protected (auth, CSRF tokens) and that image URLs include cache-busting on update to avoid stale display.

Recommended Answers

All 3 Replies

Member Avatar for TonyG_cyprus

Sorta...
click on 'change image' link->
opens page of thumbs->
click on thumb->
updates db table to link to pic to show with portfolio.

Member Avatar for lukas.vandendijssel

Make an admin section which lists your bios. Place an edit button next to the bios and make a PHP page which loops through the folder and shows your pictures and maybe a thumbnail. Put a select button next to each image and add some PHP code to the button which connects the image to the bio (for example through a database, Bio1 > Image764.jpg).

Just an idea.

EDIT: I was typing when TonyG posted his answer.

Edited by lukas.vandendijssel
Member Avatar for Squidge

hahaha many thanks to both.

@TonyG,

Wolud this need the thumb image to be a button?

@Lukas,

Thanks for the link, will have a look through that.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.