Update documentation for adding articles and optimizing images

Add a new section to the documentation detailing the workflow for adding new articles, emphasizing image optimization and social sharing best practices.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: 23852c00-4779-460a-9e0c-d09fee4b6c92
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Event-Id: 9f692ab2-acb5-427e-ba41-cfd9b36aa00b
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/f209e72a-0939-48fa-84fc-57854de71967/23852c00-4779-460a-9e0c-d09fee4b6c92/nJrxImn
Replit-Helium-Checkpoint-Created: true
This commit is contained in:
sebastjanartic 2026-03-06 16:59:12 +00:00
parent ca071643e7
commit ab3b05448d

View File

@ -131,6 +131,26 @@ The official website for Folx Music Television (folx.tv). Dark-themed bento grid
- [ ] After deployment, ensure seed runs on the production database (may require manual trigger or additional setup)
- [ ] Verify live site at https://www.folx.tv shows updated content
## Adding Articles Workflow
When adding new articles:
1. **Always optimize images first**: Resize to max 1200px wide, quality 85%, target <300KB. Use `convert` command:
```
convert input.jpg -resize 1200x -quality 85 output.jpg
```
For OG/social sharing images, use 1200x630 crop:
```
convert input.jpg -resize 1200x630^ -gravity center -extent 1200x630 -quality 85 output.jpg
```
2. Copy optimized image to `client/public/uploads/`
3. Add article to `seedArticles` array in `server/seed.ts`
4. Add UPDATE migration at bottom of `seedDatabase()` function to update existing articles in production DB
5. If article already exists in DB, seed won't update it — must add explicit UPDATE SQL migration
6. Featured articles appear in homepage carousel; set `featured: false` for items that should not appear there
7. Videos use category "Video", news uses category "News"
8. Bunny CDN embeds: use `https://player.mediadelivery.net/embed/476412/{video-id}` — do NOT take text/title from Bunny, use user-provided text only
9. Facebook embeds: copy the iframe code as-is from user
10. After deploy, go to Facebook Sharing Debugger and click "Scrape Again" to refresh cache
## Important Notes
- Tailwind `object-[center_25%]` does NOT work — must use inline `style={{ objectPosition: "center 25%" }}`
- Horoscope widget navigates to /horoskop on click (no modal)