📄Page & template management

The Page & Template Management feature provides a centralized way to create, customize, and manage public-facing pages for your SaaS application. These pages often include pricing, features, or promotional content and are crucial for tenant acquisition.

---

🧭 Navigating to Page Management

To access page management:

1. Click on the SaaS menu on the sidebar.

2. Click on the Pages item in the sub-menu item.

This will bring you to the list of all existing pages.

---

➕ Creating a New Page

1. Click on the Create Page button.

2. In the form:

   • Name: Provide a name for the page.

   • Status: Choose between Draft or Archived or Published.

⚠️ Note: Only pages with the status Published can be selected and used as Landing Pages.

Click Save to create the page.

---

👁️ Preview and Upload Template

Once a page is created, actions are available in the rightmost Action column:

• Preview (Eye Icon): View the current version of the page in a new tab.

• Upload Template: Upload a .zip file to override the design/content of the page.

Uploading Templates

You can upload a fully custom template by clicking the Upload Template button.

• Upload a .zip file that includes an index.html and all related assets (CSS, JS, images).

• After upload, the system will use the uploaded content instead of the visual editor.

├── index.html
├── assets/
│   ├── css/
│   │   └── style.css
│   │   └── responsive.css
│   │   └── ......
│   ├── js/
│   │   └── main.js
│   │   └── utilities.js
│   │   └── ......
│   └── images/
│       └── logo.png
│       └── background.jpg
│       └── .......

Important Notes:

• index.html must be in the root of the archive.

• All styles, scripts, and images must reside inside the respective assets subfolders.

• Ensure all content is sourced from trusted origins, including any external files or CDNs.

Once uploaded, the page will use this custom template instead of the visual editor content and can be customized via the visual editor.

---

✨ Dynamic Template Variables

Uploaded templates support Blade-style templating with predefined variables.

✅ Available Variables

[
    // Global Variables
    'PAGE_BUILDER_BASE_URL',
    'PAGE_BUILDER_PAGE_URL',
    'SAAS_LOGO',
    'PACKAGES',

    // Package Variables (within each item of PACKAGES)
    'name',
    'description',
    'base_price',
    'recurring_period',
    'trial_period',
    'db_scheme',

    // Quota Variables (within each package's 'quotas')
    'quotas' => [
        'name',
        'description',
        'models',
        'limit',
    ]
]

---

🛠️ Using Blade Syntax in Templates

You can use standard Blade syntax to dynamically generate content within your uploaded HTML templates.

🌀 Looping Through Packages

@foreach($PACKAGES as $package)
    <div class="package">
        <h2>{{ $package['name'] }}</h2>
        <p>{{ $package['description'] }}</p>
        <p>Price: {{ $package['base_price'] }}</p>
    </div>
@endforeach

✅ Conditionals

@if($package['trial_period'])
    <p>Includes trial period support.</p>
@else
    <p>Subdomain only.</p>
@endif

📦 Accessing Nested Quotas

@foreach($package['quotas'] as $quota)
    <div class="quota">
        <h4>{{ $quota['name'] }}</h4>
        <p>{{ $quota['description'] }}</p>
        <p>Limit: {{ $quota['limit'] }}</p>
    </div>
@endforeach

---

✏️ Editing Page with Page Builder

You can also visually customize a page using the Landing Page Editor.

• Click on the Page Name from the list.

• This will open the Page Builder.

• Use the drag-and-drop interface to add or modify sections, text, and images.

• Click Save when you're done editing.