Design TemplateField Types
Image
Display images in Pluslide templates using Image fields. Configure object fit, default images, and dynamic URLs for photos, logos, and visual content.
Image fields display visual content from URLs. Use them for photos, logos, avatars, and any visual elements.
Use Cases
- Product photos
- Profile avatars
- Logos and icons
- Diagrams and charts (as images)
Editor Settings
| Setting | Description |
|---|---|
| Default image | Default image URL (upload button available) |
| Object fit | How image fits container (Fill, Cover, Contain) |
Object Fit Modes
Original image: 400×300 (landscape)
Container: 200×200 (square)
┌─────────────────┐ ┌─────────────────┐ ┌─────────────────┐
│ Fill │ │ Contain │ │ Cover │
│ ┌─────────────┐ │ │ ┌─────────────┐ │ │ ┌─────────────┐ │
│ │ Stretched │ │ │ │ │ │ │ │ Cropped │ │
│ │ to fit │ │ │ │ Fits │ │ │ │ to fill │ │
│ │ (distorted) │ │ │ │ inside │ │ │ │ (no gaps) │ │
│ └─────────────┘ │ │ └─────────────┘ │ │ └─────────────┘ │
│ │ │ (letterboxed) │ │ │
└─────────────────┘ └─────────────────┘ └─────────────────┘| Mode | Behavior |
|---|---|
| Fill | Stretches image to fill container (may distort) |
| Contain | Scales to fit inside container (may have gaps) |
| Cover | Scales to fill container (may crop) |
Sizing Behavior
| Mode | Effect |
|---|---|
| Fixed | Image container has exact pixel dimensions |
| Fill | Fills parent container (only in Group/List) |
Note: Image fields do not support Hug sizing since images have fixed dimensions.
API Content Format
{
"content": {
"product_image": "https://example.com/product.jpg",
"company_logo": "https://example.com/logo.png"
}
}Supported Formats
- JPEG, PNG, GIF
- Remote URLs (https://)
Examples
Static Logo
A company logo that never changes:
- Upload via Default image button
- Mark as Static in field properties
- Use Contain to preserve aspect ratio
Dynamic Product Photo
Product images from API:
- Set a placeholder in Default image
- Use Cover to fill the container nicely
- Mark as Required if essential
Avatar in a Card
Profile photo inside a Group:
- Set Fixed width and height (e.g., 48×48)
- Use Cover for consistent appearance
- Add Border radius for circular avatars
Text
Display dynamic text in Pluslide templates using Text fields. Configure fonts, sizes, colors, alignment, and rich formatting for titles and content.
Shape
Add decorative elements to Pluslide templates using Shape fields. Create colored rectangles for backgrounds, dividers, and visual design elements.