Copia este prompt y pégalo en ChatGPT o Claude
Create a personal blog homepage:
1. HEADER
- Blog name/logo (left)
- Navigation: Home, About, Categories, Archive, Contact
- Search icon
- Dark/Light mode toggle
- Subscribe button
2. HERO SECTION
Option A - Featured post:
- Large featured post card
- Featured image (full-width)
- Category tag
- Title (large)
- Excerpt
- Author with avatar, date, read time
Option B - Personal intro:
- Author photo
- Welcome message
- Brief bio
- Latest post below
3. RECENT POSTS SECTION
- "Latest Articles" heading
- Grid of 6 posts (3 columns desktop)
- Each post card:
- Featured image
- Category tag
- Title
- Excerpt (2 lines)
- Author, date, read time
- Read more link
4. CATEGORY SECTION
- "Browse by Topic" heading
- Category cards or tags:
- Technology
- Design
- Life
- Travel
- Tutorials
- Post count per category
5. NEWSLETTER SECTION
- "Subscribe to my newsletter"
- "Get weekly updates on new posts"
- Email input + Subscribe button
- Privacy note
- Subscriber count (optional)
6. POPULAR/TRENDING
- "Most Read" sidebar or section
- List of 5 popular posts
- Numbered list with titles
7. ABOUT SIDEBAR (optional)
- Author photo
- Short bio
- Social links
- "Read more about me"
8. FOOTER
- Navigation links
- Social media icons
- Copyright
- "Built with [platform]"
Design: Clean, readable. Focus on typography. Good whitespace. Light theme with option for dark. Cómo usar este prompt
- 1 Copia el prompt de arriba
- 2 Pégalo en tu herramienta de IA favorita (ChatGPT, Claude, v0, etc.)
- 3 La IA generará el código del sitio web por ti
- 4 Personaliza e itera según tus necesidades
Más Prompts de Blog
Acerca de este Prompt de Blog
Este prompt Personal Blog Homepage está diseñado para ayudarte a crear rápidamente sitios web profesionales de blog usando herramientas de IA como ChatGPT, Claude, v0 de Vercel, Cursor y Bolt.new.
Ya seas desarrollador, diseñador o emprendedor, este prompt de IA gratuito te da una ventaja al crear personal blog homepage. Simplemente copia el prompt, pégalo en tu asistente de código IA favorito y personalízalo para tu marca.
Herramientas de IA Compatibles
- ChatGPT (GPT-4) - Excelente para generación detallada de código y explicaciones
- Claude 3 - Excelente para diseños web complejos y matizados
- v0 de Vercel - Perfecto para componentes React y Next.js
- Cursor - Ideal para codificación potenciada por IA en tu IDE
- Bolt.new - Prototipado rápido y apps full-stack
- Lovable - Constructor de sitios web IA fácil de usar
Etiquetas
Homepage Personal Featured Blog Prompt de IA Plantilla Gratis Constructor Web Diseño Web Prompt Copiar Pegar