Callaghans, a respected accounting and financial planning firm based in Belconnen, approached me with a challenge. Their existing website, originally developed in React, featured a modern design and a number of interactive tools that clients found useful. While the overall look and feel of the site aligned with their brand, the underlying tech stack created a bottleneck: the Callaghans team couldn’t easily make updates themselves. Even small changes required reaching out to a developer, which wasn’t practical or sustainable.
The site itself was functionally rich, including a financial planning package comparison tool, a dynamic pricing guide that allowed users to select services and generate a downloadable PDF estimate, embedded forms and videos, team bios with popup detail views, and accordion-style FAQs and toggles for streamlined navigation and easier access to common questions. The brief was clear: rebuild the website in WordPress, match the design pixel-for-pixel, and retain all functionality – while making the backend fully editable for the in-house team.
Approach and Enhancements
While the instruction was to closely replicate the original site design, the rebuild also created opportunities for refinement. The pricing guide, for example, was not only recreated to match the original functionality but enhanced to allow users to email the generated PDF estimate to themselves, improving user experience and encouraging conversion.
Team members are now managed through a custom post type, with a department taxonomy assigned to each. This structure allows for department-specific team grids to be dynamically added to relevant pages, ensuring the right people appear in the right context. The popup functionality to view extended bios was retained and rebuilt using lightweight, editable components in Elementor and ACF.
Key interactive features such as embedded forms, video embeds, and accordion sections were re-implemented using WordPress/Elementor for easier maintenance. The financial planning package comparison tool was achieved using Elementor a minimal code to provide a clean, manageable interface within WordPress.
By combining custom fields, taxonomies, and flexible design components, the new WordPress site empowers the Callaghans team to update content independently without compromising on the polished feel or functionality of the original build.
Outcome
The transition from React to WordPress has been a success for Callaghans. The website retains all the custom features their clients appreciate while giving the internal team the autonomy they previously lacked. Updates can now be made in-house as needed, without relying on a developer for routine changes.
Callaghans are very happy with the result. The new site looks and functions just like the original – but now it works for their business too.
- Callaghans
- Location: Belconnen
- 2025
- Built with: WordPress, Elementor, Gravity Forms, Advanced Custom Fields
- Rebuilt a custom React website in WordPress with a pixel-perfect match to the original design.
- Made the site fully editable via WordPress, eliminating the need for developer intervention.
- Recreated and enhanced the pricing tool with email functionality for downloadable estimates.
- Provided a sustainable, long-term solution aligned with the client's technical comfort level.
Before and After
