Blog Posts Guide
Post Structure
Basic Post Structure
Every post requires specific frontmatter configuration. Create posts in the _posts directory using the format YYYY-MM-DD-title.md.
Post Layouts
1. Standard Layout
Standard layout displays the header at the top of the post with no background image.
2. Overlay Layout
Overlay layout features a full-width header with background image and text overlay.
3. Sidebar Variations
Posts can include a sidebar on either side or none at all.
Post Components
1. Header Components
Post headers can be customized using the header include component.
2. Featured Images
Featured images appear below the header and can be configured in the frontmatter.
3. Post Meta Information
Meta information includes date, author, comments, and likes.
Post Features
1. Comments System
Enable or disable Disqus comments for individual posts.
2. Post Navigation
Navigate between posts using previous/next links.
3. Related Posts
Display related posts based on categories and tags.
Sidebar Widgets
1. Available Widgets
Sidebar can include various widgets configured in _data/sidebar.yml.
Best Practices
1. Image Guidelines
- Use optimized images in WebP format
- Recommended header image dimensions: 1920x1080px
- Featured image dimensions: 800x600px
- Compress images for web performance
2. SEO Optimization
- Write descriptive titles
- Include meaningful excerpts
- Use relevant categories and tags
- Optimize image alt text
- Include meta description
3. Content Structure
- Use proper heading hierarchy
- Break content into sections
- Include relevant images and media
- Format code blocks properly
- Add internal and external links
Examples
1. Standard Post Example
Example of a standard post configuration.
2. Overlay Post Example
Example of an overlay post with sidebar.