Personyze Wiki Personyze Wiki docs
Open Personyze
Actions & Content

Templates

Ready-made designs for Personyze actions, configured from the action menu without code. Browse the available templates by action type.

Updated 2 hours ago 3 min read
A
by Admin

What Templates Are

A template is a ready-made design for an action — the layout, styling, and behavior already built, with every option exposed in the action menu so you configure it without writing code.

Pick a template when you add an action, set its options, preview, and publish. The template controls how the content looks and behaves; the action’s audience and data-source settings control who sees it and what goes in it. The two are independent, so you can swap a template later without rebuilding your targeting.

Product Recommendations

Overlay Card Recommendations Slider

Image cards with the product name, brand, and price laid over the photo. Scrolls by native swipe on touch, and by arrows, dots, drag, or autoplay on desktop. The number of cards visible adapts to the screen, with a full corner-slot badge system (discount, low stock, best seller, price drop, wishlist) and optional blocks below the image — ratings, Add to Cart, social proof, and more.

Best for: visual, photo-led catalogs where the image should carry the card — fashion, homeware, travel.

The Overlay Card Recommendations Slider showing product cards with the product name, brand, and price overlaid on each photo
The Overlay Card Recommendations Slider.

Dark Premium Cards

Near-black cards with full-bleed photos, light text, and gold accents on the price, pagination dot, and Add to Cart button. Hovering lifts the card with a glow shadow and reveals the cart button. Same engine as the Overlay Card slider — only the defaults differ.

Best for: electronics, luxury, fashion, and gaming — any site with a dark or high-contrast design.

The Dark Premium Cards recommendations slider: near-black cards with full-bleed product photos, light text, gold prices, and vivid badges
Dark Premium Cards.

Clean Catalog Cards

The classic e-commerce look: photo on a white card, with the title, live view and sold counts, and price centered below it. Hovering lifts the card and reveals Add to Cart. Same engine as the other two sliders.

Best for: marketplaces and supply stores — catalogs with product cutouts on white backgrounds.

The Clean Catalog Cards recommendations slider: product photos on white cards with the title, view and sold counts, and price centered below the image
Clean Catalog Cards.

Recommendation Lists

Vertical lists rather than horizontal sliders — for sidebars, popups, and narrow columns. Two layouts (thumbnail beside the text, or image above it), a progressive Show More button, and optional Top-10 numbering.

Vertical Product List — Clean Catalog

White cards stacked vertically, with the photo, title, price, badges, and Add to Cart. Side or stacked layout, Show More / Show Less, and Top-10 numbering. Full reference for all three vertical list skins (Dark Premium and Compact Minimal share the engine).

Best for: sidebars, cart pages, popups, and any narrow space a horizontal slider won’t fit.

The Vertical Product List template in side layout: thumbnail beside the product title and price, with badges and a Show More button
Vertical Product List (side layout).

More Templates

Templates for other action types — popups and banners, countdown timers, social proof, open-time email — are being documented and will be listed here as they land.

In the meantime, the action guides cover what each action type can do:

Customizing a Template

The recommendation templates come in two families — horizontal sliders (Overlay Card, Dark Premium, Clean Catalog) and vertical lists — and within each family they run on one shared engine and differ only in their defaults. Any of them can be reshaped into another from the menu, so pick the one that starts closest to what you want.

Every template exposes its options in the action menu, and most also have Custom Style fields for CSS you add yourself.

One rule holds across all of them: if a style change doesn’t stick, the property is locked — either by a preset or to protect it from your site’s theme — and you need !important on your declaration for it to take precedence.