Merge branch 'document-fix-for-social-media-preview-images'

* document-fix-for-social-media-preview-images:
  Add the uploaded image from Pull Request transitive-bullshit#594
  Document the fix for 401 unauthorized Social media preview images

readme.md

@@ -47,6 +47,7 @@ This project requires a recent version of Node.js (we recommend >= 16).
 3. `npm install`
 4. `npm run dev` to test locally
 5. `npm run deploy` to deploy to vercel 💪
+6. Disable *Deployment Protection* in Vercel Web Dashboard. ([See more below](#vercel Configuration))
 
 I tried to make configuration as easy as possible — All you really need to do to get started is edit `rootNotionPageId`.
 
@@ -58,6 +59,15 @@ In order to find your Notion workspace ID (optional), just load any of your site
 
 I recommend setting up a collection on your home page that contains all of your articles / projects / content. There are no structural constraints on your Notion workspace, however, so feel free to add content as you normally would in Notion.
 
+### [Vercel Configuration]
+#### Enabling social media preview images
+**❗❗❗Social media preview images won't work by default in Vercel❗❗❗**
+👉 You need Login to Vercel to disable Vercel Authentication from `Project -> Settings -> Deployment Protection`
+
+<img width="600" alt="Vercel Deployment Protection setting which causes social media preview image function endpoint to return 401 Unauthorized" src="https://github.com/transitive-bullshit/nextjs-notion-starter-kit/assets/5691777/9cce3b60-7102-4c34-a422-9f6572155c10">
+
+💡 If you forget to do this your site will return `401 Unauthorized` responses when crawlers are trying to retrieve the images
+
 ## URL Paths
 
 The app defaults to slightly different URL paths in dev vs prod (though pasting any dev pathname into prod will work and vice-versa).