This article shows you how to create pricing displays that change based on customer selections, locations, or other conditions.
1. Choose Your Pricing Display Type
Decide which type of dynamic pricing display works best for your business:
- Pricing tables: Compare different service tiers or product options
- Location-based pricing: Show different rates for different areas
- Conditional pricing: Display prices based on customer selections
- Time-sensitive pricing: Show special offers or seasonal rates
2. Set Up Basic Pricing Tables
Start by creating price lists and menus for your base pricing structure. This gives you the foundation for adding dynamic elements.
In your WordPress dashboard:
- Go to Pages and select the page where you want pricing
- Click Edit with Elementor or your page builder
- Add a Pricing Table widget
- Enter your service names and base prices
- Add descriptions for each pricing tier
3. Add Location-Based Pricing
For businesses serving different areas with different rates:
- Create separate pricing sections for each location
- Use CSS classes to hide/show sections based on user selection
- Add a dropdown menu at the top of your pricing page
- Set up JavaScript to show the relevant pricing when users select their location
Example structure:
- Dublin pricing section (hidden by default)
- Cork pricing section (hidden by default)
- Galway pricing section (hidden by default)
4. Create Conditional Pricing Displays
For services where price depends on customer choices:
- List all the variables that affect your pricing (size, duration, add-ons)
- Create input fields for each variable
- Set up calculations that update the displayed price automatically
- Use WordPress plugins like "Price Calculator" or custom JavaScript
Common conditional pricing factors:
- Project size or duration
- Number of people or items
- Delivery distance
- Service add-ons
5. Add Time-Sensitive Elements
To show limited-time offers or seasonal pricing:
- Create two versions of your pricing display
- Set start and end dates for special pricing
- Use scheduling plugins to automatically switch between versions
- Add countdown timers for urgency
6. Make Your Pricing Mobile-Friendly
Ensure your dynamic pricing works on all devices:
- Test all dropdowns and buttons on mobile
- Make sure text stays readable when prices update
- Keep calculation buttons large enough to tap easily
- Test the pricing logic on different screen sizes
7. Test Your Dynamic Elements
Before publishing:
- Test every combination of options
- Verify calculations are accurate
- Check that all prices display correctly
- Make sure the pricing works without JavaScript (for accessibility)
- Test on different browsers and devices
If you're still stuck with creating dynamic pricing displays, contact Web60 support for help with your specific pricing structure.
FAQ
Q: Can I create pricing that changes based on the visitor's location?
A: Yes, you can set up location-based pricing using dropdown menus or automatic location detection. This works well for service businesses with different rates in different cities.
Q: How do I add a price calculator to my WordPress site?
A: Use plugins like WP Cost Calculator or create custom forms with JavaScript calculations. Start with simple multiplication formulas and add complexity as needed.
Q: Can I hide prices from certain visitors?
A: Yes, you can set up conditional visibility based on user login status, location, or other criteria. This is useful for trade pricing or member-only rates.
Q: How do I create pricing tables that work on mobile phones?
A: Use responsive pricing table plugins or builders. Test that all buttons work with touch, text is readable, and tables don't become too narrow.
Q: Can I automatically update prices based on the time of year?
A: Yes, use WordPress scheduling features or plugins to switch between different pricing displays automatically. This works well for seasonal businesses.
Q: How do I make sure my pricing calculations are accurate?
A: Test every possible combination of options manually. Create a spreadsheet with your pricing logic first, then match your website calculations to it.
Q: What if my dynamic pricing stops working?
A: Check for plugin conflicts first, then verify your JavaScript code. Always include a static price list as backup so customers can still see your rates.
Last updated: 1 March 2026