← ClaudeAtlas

github-pr-screenshot-embedlisted

Use when embedding a screenshot or image in a GitHub PR description or comment, especially for a PRIVATE repo. Fire when the user says "the screenshot is a broken image in the PR", "embed this in the PR", "the image doesn't render for reviewers", "add a before/after image to the PR", or when a raw.githubusercontent.com link shows as a broken image. Skip for GitLab MRs — GitLab rewrites uploaded paths differently and needs its own upload step.
damson/hard-won-skills · ★ 1 · Code & Development · score 67
Install: claude install-skill damson/hard-won-skills
# Embed screenshots in a GitHub PR (private repos) Private-repo image embeds break in one specific, silent way: the image host you pick decides whether the browser can authenticate. Get the host wrong and every reviewer sees a broken-image icon while the link looks correct to you (your browser is already authenticated). The rule: **use `github.com/<owner>/<repo>/raw/<sha>/<path>`, pinned to a commit SHA.** GitHub authenticates that host with the reader's browser cookies, so anyone with repo access renders it. ## Procedure ### 1. Commit the image into the PR branch Commit the screenshot into the repo (e.g. under `docs/screenshots/`) on the PR branch and push. You need its path and the **commit SHA** that contains it: ```bash git rev-parse HEAD # the SHA to pin ``` ### 2. Build the embed URL ``` https://github.com/<owner>/<repo>/raw/<sha>/<path-to-image> ``` Use it in standard markdown in the PR description or comment: ```markdown | Before | After | |---|---| | ![before](https://github.com/OWNER/REPO/raw/<sha>/docs/screenshots/before.png) | ![after](https://github.com/OWNER/REPO/raw/<sha>/docs/screenshots/after.png) | ``` **Never use `raw.githubusercontent.com`** for a private repo. That host is token-authenticated only and never receives browser cookies, so the embed is a broken image for every reader even though it resolves for you via a token. ### 3. Pin the SHA, never the branch Use the commit SHA in the path, not the branch name. A squash-merge deletes the b