Back to Documentation
Top 3 Table
Implementation Guide & Best Practices
Overview
The Top 3 Table is designed for "Best Of" roundup posts. It allows readers to compare three different tiers of products side-by-side: your top pick, a budget-friendly option, and a premium choice. This layout is one of the highest-converting formats for affiliate blogs.
How to Use
- Associate Tag: Enter your global associate tag first. It will be applied to all three products.
- Product Details: For each slot, enter the product name, ASIN (or full URL), and a short summary.
- Badge Text: Customize the badges. Slot 1 is orange (e.g., "Top Pick"), Slot 2 is green (e.g., "Best Value"), and Slot 3 is blue (e.g., "Premium Choice").
- Image Fallback: If an image doesn't appear automatically, paste a direct link in the Custom Image URL field for that slot.
Best Practices
- •Equalize Height: Try to keep your "Short Summary" text roughly the same length for all three products. This ensures the CTA buttons line up perfectly in a horizontal row.
- •Clear Differentiation: Use the Slot 2 green badge for your most affordable recommendation and Slot 3 blue for the most expensive. This visual hierarchy helps readers decide based on budget.
- •Mobile-First: Our generated table is fully responsive. On mobile devices, the cards will automatically stack vertically for a perfect reading experience.
Installation
Copy the generated HTML and paste it into your site's Custom HTML block. The CSS for the grid and cards is included inline, so no extra stylesheet is required.
Ready to build?
Start generating your custom widget now.