Why: Tailor the display of your content items to create a unique experience for your subscribers. Customizing detail page templates allows you to highlight the information that matters most to your audience.
Navigate: App Station > Page Builder > Detail Page Templates
Quick Start
Navigate to App Station and select Page Builder.
Click on Detail Page Templates.
Choose the content type you want to customize (e.g., Recipe, Meal Plan).
Click Create Template to start a new layout or select an existing template to edit.
Use the block palette to add, configure, or reorder blocks as needed.
Overview of Detail Page Templates
Detail page templates are flexible layouts that determine how individual content items like recipes, meal plans, and resources are displayed in your app. Each template consists of reusable blocks that can be customized to show specific data points.
Key Features
Block-Based Composition: Build layouts using configurable blocks.
Multi-Content Type Support: Customize templates for various content types.
Visual Builder: Utilize a drag-and-drop interface for easy management.
Configuration Flexibility: Each block can be independently configured to suit your needs.
Customizing Your Detail Page Template
Creating a New Template
In App Station, go to Page Builder and select Detail Page Templates.
Click on Create Template.
Choose the content type (e.g., Recipe, Meal Plan) and enter a name for your template.
Optionally, mark it as the default layout for that content type.
Click Create to save your new template.
Adding and Configuring Blocks
Once you have created or selected a template, you can add blocks to it:
Use the block palette on the left side of the builder to browse available blocks.
Click Add next to a block to include it in your layout.
To configure a block, click on it in the layout list. The configuration panel will appear on the right.
Adjust the settings for each block as needed. Common options include toggling visibility for elements like images, titles, and ratings.
Screenshot needed: The block palette in the Detail Page Template builder
Reordering Blocks
To change the order of blocks in your template:
Click and hold the handle (⋮⋮ icon) next to the block you want to move.
Drag it to the desired position in the layout.
Release to drop it in place. The order saves automatically.
Enabling and Disabling Blocks
You can control which blocks are visible on your detail pages:
Toggle the switch next to the block name to enable or disable it.
Disabled blocks will not render on the page, allowing you to customize the display without deleting blocks.
Deleting a Template
To delete a content layout:
Open the template in the builder.
Click the Delete Template button (red) if it is not marked as default.
Confirm the deletion. Remember, you cannot delete a default template unless you set another template as the default first.
Available Block Types
Here are some common block types you can use in your templates:
recipe-header: Displays the recipe title, image, and metadata.
recipe-ingredients: Shows the list of ingredients with scaling options.
recipe-steps: Provides step-by-step cooking instructions.
meal-plan-header: Displays the meal plan title and engagement features.
resource-header: Shows the resource title and engagement features.
Each block type comes with specific configuration options that allow you to tailor the display to your audience's needs.
Best Practices for Customization
Start Simple: Begin with essential blocks and add more as needed.
Preview Changes: Always preview your content layouts with real content to ensure they look as expected.
Mobile Optimization: Ensure your blocks render well on mobile devices for a seamless user experience.
Related Features
Page Builder System - Learn more about the overall architecture of the Page Builder.
Block Management - Explore how to manage and configure blocks effectively.