The photos section is powered by content collections. You can manually add new photos by creating Markdown files, or use the automated bulk import script.
Bulk Upload Workflow (Recommended)
You can easily import an entire local directory of photos. The script will automatically copy the images, extract their dates, generate the necessary Markdown files, and categorize them based on their source folder.
- Run the script:
npm run import-photos -- /path/to/your/images - Options:
- By default, the script uses the immediate parent folder of each image as its
category. - You can specify a fallback category if the images are located directly in the source directory:
npm run import-photos -- /path/to/your/images --category "Vacation 2024"
- By default, the script uses the immediate parent folder of each image as its
That’s it! Your photos are now imported.
Manual Upload Steps
If you only want to add a single photo manually:
-
Prepare your Image: Place your image file in the
public/photosdirectory (e.g.,public/photos/my-photo.jpg). -
Create a Content File: Create a new
.mdfile insrc/content/photos. -
Add Frontmatter: Fill in the details about the photo:
--- title: "Sunset at the Beach" description: "A beautiful sunset captured last summer." date: "2024-05-22" image: "/photos/my-photo.jpg" category: "Nature" ---title: The title of the photo.description: (Optional) A caption or description.date: The date the photo was taken or added.image: The path to the image starting with/(relative to thepublicfolder).category: The category for grouping photos (e.g., “Nature”, “Tech”, “Travel”).
-
Save: Once saved, the photo will automatically appear in the photography section, grouped by its category.
Comments
No comments yet. Be the first!