In this case, the Before and After images are nearly identical, and that’s the point. This client had gone through a major rebranding, changing the company name, logo, brand colors, etc. They had hired a large agency to create a new website for them with the new branding. The agency delivered a completed site only days before critical press releases went live, so when the client realized that the back end of the site didn’t work at all the way they wanted, they had no choice but to move forward with the site as delivered.
They limped along with the site for almost a year before reaching out to me to help them address the underlying issues. They were happy with the design of the site already, but the agency had created a custom theme that was an awkward mix of hard-coded parts of the theme files along with Advanced Custom Fields that were intended to make it easier for a non-tech user to update the site, but instead made the site very hard for the client to manage.
Transition Custom Theme To Divi Theme
After several discussions to be sure I understood exactly what wasn’t working for them, and how the site used to work when they felt it was easier to maintain, we agreed that everything they wanted to retain could be accomplished by using the Divi theme, completely removing the custom theme. We also were able to remove all of the Advanced Custom Fields, which the client felt had unnecessarily restricted them from making on-the-fly design choices.
All work was done on a staging server to ensure that they client’s high traffic shipping cart was not affected during the switch-over. We re-created the custom theme to a nearly pixel-perfect state, using only Divi. Any minor variations were approved by the client before it went live.
Transition Custom Shopify Theme to Turbo and Design Seamless Flow
In addition to the theme switch, one of the goals of this client was to make the transition more seamless between their WordPress site, which housed their many years of content, and their Shopify site, which they used for product sales. The prior agency had been tasked with this, and had used a robust set of metafields to create the design and functionality that was needed. (In their defense, that is one of the few tools that Shopify gives you to accomplish that level of customization.) After more discussions with the client, who was very frustrated with having to use actual HTML just to update their product descriptions, we agreed that removing those customizations completely and utilizing the Turbo theme from Out Of The Sandbox would give them the level of customization they needed, with a very easy drag-n-drop interface.
The Turbo theme comes with a single custom product template, and the client needed 8 different product templates for various collections. We created the additional product templates and added them to the theme, so that the client would have drag-n-drop abilities with 8 different product templates. Then the Turbo theme as a whole was customized to match the WordPress styling as closely as possible, making it seamless for the site visitor to move between the blog/content pages and the product pages – all without needing to be aware that they were switching platforms within the site.
In addition to the brand-matching on Shopify, we also added Buy Now buttons using the Shopify embed code in the WordPress sidebar. This embed code even allows for a slide-out cart to appear on the WordPress side of the site, without any need for an ecommerce plugin on WordPress. This further helped to make the flow between WordPress and Shopify seamless for site visitors.
Throughout the project, the focus was kept on making the site very easy to manage for their small and mostly non-technical team. They needed to be able to very easily update products, add new products, feature new blogs, and test out new features like their podcast transcripts to make the podcast accessible to deaf audience members.
The client was very satisfied with the end product and has taken over full management of the site themselves, which was what they wanted originally.