135 lines
2.9 KiB
Markdown
135 lines
2.9 KiB
Markdown
# Landing Page Models
|
|
|
|
## Overview
|
|
|
|
The Landing Page module provides a WYSIWYG page builder with GrapesJS editor integration, reusable block library, and MkDocs export functionality.
|
|
|
|
**Models (2):**
|
|
- LandingPage — GrapesJS editor output with MkDocs export
|
|
- PageBlock — Reusable block library
|
|
|
|
**Key Features:**
|
|
- GrapesJS WYSIWYG editor (desktop only)
|
|
- Visual + code editor modes
|
|
- MkDocs export (THEMED vs STANDALONE modes)
|
|
- SEO metadata (title, description, image)
|
|
- Reusable block library (6 default blocks)
|
|
- Jinja2 Material theme integration
|
|
|
|
See [Schema Reference](../schema.md#landing-pages) for complete field listings.
|
|
|
|
---
|
|
|
|
## Editor Modes
|
|
|
|
```prisma
|
|
enum EditorMode {
|
|
VISUAL // GrapesJS visual editor (default)
|
|
CODE // Raw HTML/CSS code editor
|
|
}
|
|
```
|
|
|
|
---
|
|
|
|
## MkDocs Export Modes
|
|
|
|
```prisma
|
|
enum MkdocsExportMode {
|
|
THEMED // Extends main.html, content block only (default)
|
|
STANDALONE // Full HTML document, no Jinja2 inheritance
|
|
}
|
|
```
|
|
|
|
**THEMED Mode:**
|
|
```html
|
|
{% extends "main.html" %}
|
|
{% block content %}
|
|
<div class="landing-page">
|
|
<!-- Page HTML here -->
|
|
</div>
|
|
{% endblock %}
|
|
```
|
|
|
|
**STANDALONE Mode:**
|
|
```html
|
|
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>Page Title</title>
|
|
<!-- Full HTML document -->
|
|
</head>
|
|
<body>
|
|
<!-- Page HTML here -->
|
|
</body>
|
|
</html>
|
|
```
|
|
|
|
---
|
|
|
|
## Page Blocks (6 default)
|
|
|
|
**1. Hero Section** (Headers)
|
|
- Schema: title, subtitle, backgroundImage, ctaText, ctaUrl
|
|
- Defaults: "Welcome to Our Campaign", "Get Involved"
|
|
|
|
**2. Text Block** (Content)
|
|
- Schema: heading, body
|
|
- Defaults: "About Us", "Tell your story here..."
|
|
|
|
**3. Features Grid** (Content)
|
|
- Schema: features[] (title, description, icon)
|
|
- Defaults: 3 features (Community Action, Advocacy, Volunteer)
|
|
|
|
**4. Call to Action** (Actions)
|
|
- Schema: heading, description, buttonText, buttonUrl
|
|
- Defaults: "Ready to Take Action?", "Join Now"
|
|
|
|
**5. Testimonials** (Content)
|
|
- Schema: quotes[] (text, author, role)
|
|
- Defaults: 2 quotes
|
|
|
|
**6. Contact Form** (Actions)
|
|
- Schema: heading, fields[] (name, type, required)
|
|
- Defaults: Name, Email, Message fields
|
|
|
|
---
|
|
|
|
## GrapesJS JSON Format
|
|
|
|
**blocks Field:**
|
|
```json
|
|
{
|
|
"pages": [
|
|
{
|
|
"id": "page-main",
|
|
"component": {
|
|
"type": "wrapper",
|
|
"components": [
|
|
{
|
|
"tagName": "section",
|
|
"classes": ["hero"],
|
|
"components": [
|
|
{
|
|
"tagName": "h1",
|
|
"content": "Welcome to Our Campaign"
|
|
}
|
|
]
|
|
}
|
|
]
|
|
}
|
|
}
|
|
]
|
|
}
|
|
```
|
|
|
|
---
|
|
|
|
## Related Documentation
|
|
|
|
- [Schema Reference](../schema.md#landing-pages) — Complete field listings
|
|
- [Seeding](../seeding.md) — Default page blocks
|
|
- [API Pages Routes](../../api/pages.md) — REST endpoints
|
|
- [Admin Landing Pages](../../admin/landing-pages.md) — Page list UI
|
|
- [Admin Page Editor](../../admin/page-editor.md) — GrapesJS editor UI
|
|
- [Public Landing Page](../../admin/public-landing.md) — Public page renderer
|