sidebar-generator

# Components: Sidebar Guides sidebar design for content sites (blogs, docs). ~80% of users focus on the left; sidebars influence flow but can hurt conversion if overused. Posts without sidebars show 3.1x higher conversion; bottom-right sticky CTAs outperform sidebars (5.62% vs 0.58% CTR). **When invoking**: On **first use**, if helpful, open with 1-2 sentences on what this skill covers and why it matters, then provide the main output. On **subsequent use** or when the user asks to skip, go directly to the main output. ## Initial Assessment **Check for project context first:** If `.claude/project-context.md` or `.cursor/project-context.md` exists, read it for content structure and conversion goals. Identify: 1. **Content type**: Blog, docs, e-commerce 2. **Primary goal**: Navigation, CTA, related content 3. **Mobile**: Collapse to hamburger or hide on small screens ## Best Practices ### Placement - **Left sidebar**: Prime for nav; 80% of users focus left - **Right sidebar**: Secondary content, ads, related posts - **Static vs sticky**: Static for content-focused; sticky for persistent CTA (subscription, cart) ### Conversion Reality | Approach | Typical result | |----------|----------------| | **Sidebar CTA** | <1% opt-in for blog sidebars | | **In-content CTA** | 3x+ higher conversion | | **Bottom-right sticky** | 5.62% CTR vs 0.58% sidebar | | **No sidebar** | 3.1x higher conversion vs with sidebar | **Recommendation**: Prefer in-content CTAs or bottom-right sticky...