Image Gallery Publisher

Image Gallery Publisher

Purpose

Use this skill to turn a user-supplied theme into a published GitHub Pages gallery update. The gallery is one site with many batches; each batch has a theme, each image has a category, and all categories render as filters on the same webpage. Categories are open-ended and must not be hardcoded to any prior batch.

Default Gallery Repo

• GitHub repo: https://github.com/silvere/Tryimage2
• Git remote: https://github.com/silvere/Tryimage2.git
• Pages URL: https://silvere.github.io/Tryimage2/
• Pages source: main branch, repository root.
• If the current working directory is not already this gallery, clone it and work there:

git clone https://github.com/silvere/Tryimage2.git
cd Tryimage2

Workflow

1. Resolve the target gallery repo.

   • Default to the current working directory only when it contains assets/gallery.json and its origin remote is silvere/Tryimage2.
   • Otherwise clone or open https://github.com/silvere/Tryimage2.git.
   • Keep all batches in this same site unless the user explicitly asks for a separate repo.
   • If the repo lacks scripts/import-gallery-batch.mjs, copy the bundled script from this skill into scripts/ and commit it with the gallery update.

2. Turn the user's theme into a batch plan.

   • Use the requested image count; default to 15 if unspecified.
   • If the user names categories, honor them exactly unless they conflict with safety or platform constraints.
   • If the user does not name categories, infer categories from the current theme. Do not reuse old categories by default.
   • Category count is flexible. Use one category for a focused batch, or multiple categories when it helps browsing.
   • Treat examples such as "对比反差", "创意组合", or "真实场景" as ordinary category candidates, not fixed modes.
   • For each image, produce: title, category, categoryLabel, description, and a vivid image prompt.
   • Avoid real trademarks/logos and readable text unless the user explicitly wants them and it is safe.

3. Generate images with image2.

   • Use the image_gen tool directly for each prompt.
   • Prefer horizontal poster prompts unless the user specifies another format.
   • Generated image files are saved by Codex under .codex/generated_images/...; preserve originals and copy images into the repo.

4. Prepare a batch metadata JSON.

   • The import script expects:

{
  "theme": "主题名",
  "batchId": "optional-stable-slug",
  "items": [
    {
      "source": "image-01.png",
      "category": "category-id",
      "categoryLabel": "分类名",
      "title": "图片标题",
      "description": "一句话描述",
      "prompt": "完整生图提示词"
    }
  ]
}

5. Import into the gallery.
   • Run from the repo root:

node scripts/import-gallery-batch.mjs --metadata path/to/batch.json --images path/to/generated-images

• If the repo lacks this script, copy scripts/import-gallery-batch.mjs from this skill into scripts/.
• The script copies originals to assets/images/<batchId>/, creates lightweight WebP thumbnails in assets/thumbs/<batchId>/, appends assets/gallery.json, and rebuilds assets/contact_sheet_image2.jpg when ImageMagick is available.

6. Verify locally.

   • Run a static server, for example python3 -m http.server 4173 --bind 127.0.0.1.
   • Check /, assets/gallery.json, and at least one newly imported image return HTTP 200.
   • Stop the server after checking.

7. Publish.

   • Check git status --short and commit only site files, batch metadata, imported images, thumbnails, and any needed script update.
   • Use a clear message such as Add <theme> gallery batch.
   • Push to origin main.
   • Verify GitHub Pages is enabled from the main branch root:

gh api repos/silvere/Tryimage2/pages --jq '{url:.html_url, source:.source}'

• If Pages is not enabled, configure it from main branch root:

gh api --method POST repos/silvere/Tryimage2/pages \
  -f source[branch]=main \
  -f source[path]=/

• Return the GitHub repo URL and Pages URL: https://github.com/silvere/Tryimage2 and https://silvere.github.io/Tryimage2/.

Existing Gallery Contract

• assets/gallery.json is the source of truth.
• categories[] controls filter tabs and can grow with any new category.
• batches[] records each generation run.
• items[] records images and must include id, batch, category, number, title, image, and description.
• items[].thumb should point to a lightweight thumbnail when available; cards should use thumbnails and reserve originals for preview/download.
• The static page should render category tabs dynamically from JSON, so new categories appear on the same website without editing HTML.
• The homepage should render a limited page of cards first and expose a "load more" control rather than inserting every image into the DOM at once.

Script

Bundled script:

node ~/.codex/skills/image-gallery-publisher/scripts/import-gallery-batch.mjs --metadata batch.json --images generated-dir --root repo-dir

Prefer the repo-local copy when it exists so future collaborators can run the same workflow from the repository.