38 lines
1.6 KiB
Markdown
38 lines
1.6 KiB
Markdown
# Social Preview Images Todo
|
|
|
|
## Goal
|
|
|
|
Fix WhatsApp and social link previews so the site no longer shows the
|
|
Vue-looking favicon and instead uses Rabbi Gerzi branded images.
|
|
|
|
## Todo
|
|
|
|
- Prepare replacement assets:
|
|
- `frontend/rabbi_gerzi/public/favicon.png` at `512x512`.
|
|
- `frontend/rabbi_gerzi/public/favicon.ico` with common small icon sizes.
|
|
- Optional `frontend/rabbi_gerzi/public/favicon.svg`.
|
|
- Optional `frontend/rabbi_gerzi/public/apple-touch-icon.png` at `180x180`.
|
|
- `frontend/rabbi_gerzi/public/assets/social-preview.png` at `1200x630`.
|
|
- Update `frontend/rabbi_gerzi/index.html`:
|
|
- Point favicon links at the replacement files.
|
|
- Add Open Graph title, description, type, URL, image, width, and height.
|
|
- Add Twitter card title, description, and image tags.
|
|
- Use `https://rabbigerzi.com/assets/social-preview.png` for the absolute
|
|
preview image URL.
|
|
- Add or update a Cypress check that verifies:
|
|
- favicon metadata points at the intended files,
|
|
- `og:image` and `twitter:image` are present,
|
|
- page title and description metadata match the site.
|
|
- Run frontend verification from `frontend/rabbi_gerzi/`:
|
|
- `npm run test:e2e -- --spec cypress/e2e/home.cy.ts`
|
|
- `npm run format`
|
|
- `npm run lint`
|
|
- `npm run type-check`
|
|
|
|
## Notes
|
|
|
|
- WhatsApp may cache old previews after deploy. If that happens, rename the
|
|
social image file, for example to `social-preview-v2.png`, and update
|
|
`index.html` to force a fresh scrape.
|
|
- Public files in Vite are served from the site root, so
|
|
`public/assets/social-preview.png` becomes `/assets/social-preview.png`.
|