2 min read
How to Add Photos

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.

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.

  1. Run the script:
    npm run import-photos -- /path/to/your/images
  2. 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"

That’s it! Your photos are now imported.

Manual Upload Steps

If you only want to add a single photo manually:

  1. Prepare your Image: Place your image file in the public/photos directory (e.g., public/photos/my-photo.jpg).

  2. Create a Content File: Create a new .md file in src/content/photos.

  3. 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 the public folder).
    • category: The category for grouping photos (e.g., “Nature”, “Tech”, “Travel”).
  4. Save: Once saved, the photo will automatically appear in the photography section, grouped by its category.

Comments

No comments yet. Be the first!