Rabbi_Gerzi/social-preview-todo.md

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.