diff --git a/replit.md b/replit.md index 4e77324..97661ad 100644 --- a/replit.md +++ b/replit.md @@ -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)