Files
orion/docs/getting-started/platform-homepage-quick-start.md
Samir Boulahtit 83a6831b2e feat: add platform homepage and content management system with improved UI
Implemented a comprehensive CMS for managing platform homepage and content pages:

- Platform homepage manager with template selection (default, minimal, modern)
- Content pages CRUD with platform defaults and vendor overrides
- Sidebar navigation for Content Management section
- Dedicated API endpoints for creating, updating, deleting pages
- Template support for customizable homepage layouts
- Header/footer navigation integration for content pages
- Comprehensive documentation for platform homepage setup
- Migration script for creating initial platform pages

UI improvements:
- Fixed action buttons styling in content pages table to match design system
- Added proper hover states, rounded corners, and better contrast
- Increased button size and padding for better usability

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-11-28 07:17:30 +01:00

6.0 KiB

Platform Homepage - Quick Start Guide

Quick reference for setting up and customizing the platform homepage and content pages.


🚀 Quick Setup

Step 1: Create Platform Pages

Run the seeder script to create all default platform pages:

python scripts/create_platform_pages.py

This creates:

  • Platform Homepage (modern template)
  • About Us
  • FAQ
  • Contact Us
  • Terms of Service
  • Privacy Policy

Step 2: Verify Pages

Visit your platform homepage:

http://localhost:8000/

Visit content pages:

http://localhost:8000/about
http://localhost:8000/faq
http://localhost:8000/contact
http://localhost:8000/terms
http://localhost:8000/privacy

Step 3: Customize (Optional)

Change homepage template:

UPDATE content_pages
SET template = 'minimal'  -- or 'default', 'modern'
WHERE slug = 'platform_homepage' AND vendor_id IS NULL;

Update homepage content:

UPDATE content_pages
SET content = '<p>Your custom homepage content...</p>'
WHERE slug = 'platform_homepage';

📄 Available Templates

Homepage Templates

Template Style Best For
default Professional, feature-rich Comprehensive showcase
minimal Clean, simple Minimalist branding
modern Animated, gradient-heavy Tech-forward platforms

Content Page Template

All content pages use platform/content-page.html:

  • Breadcrumb navigation
  • Responsive design
  • Enhanced prose styling
  • Dark mode support

🎯 Common Tasks

Add New Content Page

from app.core.database import SessionLocal
from app.services.content_page_service import content_page_service

db = SessionLocal()

page = content_page_service.create_page(
    db,
    slug="careers",
    title="Careers",
    content="<h1>Join Our Team</h1><p>...</p>",
    vendor_id=None,  # Platform page
    is_published=True,
    show_in_header=True,
    show_in_footer=True,
    display_order=4
)

db.close()

Update Page Content

content_page_service.update_page(
    db,
    page_id=page.id,
    title="New Title",
    content="<h1>Updated Content</h1>",
    meta_description="New description"
)

Change Navigation Visibility

# Show in header menu
content_page_service.update_page(
    db,
    page_id=page.id,
    show_in_header=True,
    display_order=2
)

# Remove from footer
content_page_service.update_page(
    db,
    page_id=page.id,
    show_in_footer=False
)

🔍 Verification

Check Database

-- List all platform pages
SELECT id, slug, title, template, is_published, show_in_header, show_in_footer
FROM content_pages
WHERE vendor_id IS NULL
ORDER BY display_order;

Test Navigation

  1. Visit homepage: http://localhost:8000/
  2. Check header menu (should show: About, FAQ, Contact)
  3. Scroll to footer (should show all pages)
  4. Click links to verify they work

Test Dark Mode

  1. Click moon icon in header
  2. Verify all pages render correctly in dark mode
  3. Toggle back to light mode

📝 Page Content Examples

Homepage Content

<p class="lead">
    Welcome to our multi-vendor marketplace platform.
    Connect with thousands of vendors and discover amazing products.
</p>
<p>
    Join our growing community of successful online businesses today.
</p>

About Us Content

<h2>Our Mission</h2>
<p>We're democratizing e-commerce...</p>

<h2>Our Values</h2>
<ul>
    <li><strong>Innovation:</strong> Constantly improving</li>
    <li><strong>Transparency:</strong> No hidden fees</li>
</ul>

FAQ Content

<h2>Getting Started</h2>

<h3>How do I create an account?</h3>
<p>Contact our sales team...</p>

<h3>What are your pricing plans?</h3>
<p>We offer flexible pricing...</p>

🎨 Customization Tips

Custom Homepage Template

  1. Create new template:

    app/templates/platform/homepage-custom.html
    
  2. Extend base template:

    {% extends "platform/base.html" %}
    
    {% block content %}
    <!-- Your custom layout -->
    {% endblock %}
    
  3. Update database:

    UPDATE content_pages
    SET template = 'custom'
    WHERE slug = 'platform_homepage';
    

Customize Navigation Order

UPDATE content_pages
SET display_order = 1
WHERE slug = 'about';

UPDATE content_pages
SET display_order = 2
WHERE slug = 'faq';

UPDATE content_pages
SET display_order = 3
WHERE slug = 'contact';

Result in header: About | FAQ | Contact


🐛 Troubleshooting

Homepage shows 404

Fix: Run seeder script

python scripts/create_platform_pages.py

Navigation menu is empty

Fix: Update navigation flags

UPDATE content_pages
SET show_in_header = true, show_in_footer = true
WHERE slug IN ('about', 'faq', 'contact')
AND vendor_id IS NULL;

Content not updating

Fix: Clear any caching and restart server

# If using uvicorn with reload
# Changes should auto-reload

# If manual restart needed
pkill -f uvicorn
uvicorn main:app --reload

📚 Full Documentation

For complete details, see:


Checklist

After setup, verify:

  • Homepage loads at http://localhost:8000/
  • All content pages are accessible
  • Header navigation shows correct pages
  • Footer navigation shows all pages
  • Dark mode works
  • Mobile responsive design works
  • SEO meta tags are present
  • Links in navigation work correctly

🎉 You're Done!

Your platform homepage and content pages are now set up and ready to customize!

Next Steps:

  1. Customize homepage content via admin panel at /admin/platform-homepage
  2. Manage all content pages at /admin/content-pages
  3. Add your own branding and colors
  4. Create additional content pages as needed
  5. Set up analytics tracking