Overview
Comparison pages (such as "Your Brand vs. Competitor") need to stay current as your product evolves and as you learn more about your competitive positioning. This guide covers how to update content, swap out design sections, or fully redesign a comparison page in Flint.
Updating Comparison Table Content
To update the content in a comparison table or feature list:
- 1.Navigate to the comparison page in the editor
- 2.Click the table or feature section on the canvas to select it
- 3.Use the AI chat to describe the change:
In the comparison table, update the "Integrations" row to show 200+ for us instead of 100+.Or for larger updates:
Update the comparison table to reflect our new pricing: our entry plan is now $49/month. Also add a new row for "AI-powered automation" which we support and the competitor does not.Replacing or Adding Sections
To replace an existing section with a different layout or design:
Replace the current side-by-side comparison section with a table design that shows feature-by-feature comparison across three columns: our product, Competitor A, and Competitor B.To add a new section to the page:
Add a customer quote section after the comparison table that highlights a testimonial about switching from [Competitor Name] to us.Redesigning the Comparison Page
For a full redesign of the comparison page:
- 1.Reference a design you like - Provide a URL or screenshot of a comparison page design you want to use as inspiration:
Redesign this comparison page to look similar to this design: [URL or screenshot]. Keep all the existing content but apply the new layout.- 2.Describe the new layout - Alternatively, describe the design you want in plain terms:
Redesign this comparison page with a dark hero section that includes a bold headline and a short summary of why we win. Follow it with a clean feature comparison table on a white background. End with a CTA section.- 3.Review and refine - After the redesign, review the result on the canvas and use follow-up prompts to adjust specific elements.
Creating Competitor-Specific Variants
If you want separate comparison pages for each competitor:
- 1.Build one comparison page as your template
- 2.Ask Flint to duplicate it for each competitor:
Duplicate this comparison page to /compare/us-vs-hubspot and update all references to the competitor to say HubSpot.For bulk creation of multiple comparison pages at once, see the ABM Workflow guide, which uses a similar CSV-driven approach.
Design Tips for Comparison Pages
- •Lead with your strengths - The first section after the hero should highlight your most compelling differentiators, not just a feature checklist.
- •Keep tables scannable - Limit comparison tables to the most important features. Too many rows reduce impact.
- •Use social proof - Add customer quotes or case study references specific to customers who switched from the competitor.
- •End with a strong CTA - Make it easy for the reader to take the next step with a prominent button or form at the bottom of the page.
