Challenges

For Kaffekapslen it has always been important to have a fast-loading website – both for SEO and conversion rate and to provide the best user experience for their customers. Kaffekapslen has spent a huge amount of time since migrating from Magento 1 to Magento 2, to optimize their frontend, but could never really achieve the results they were looking for with the Magento Luma theme. The loading time on the website caused a huge frustration to the client and we wanted to provide Kaffekapslen with a solution that exceeds their expectations. 

Solution

Hyvä implementation

We have recently been quite hyped about Hyvä themes (and for good reason). So, when Kaffekapslen was recently working on a new design in connection with their brand-new visual identity, it just made sense for us to recommend implementing their new design with Hyvä. Kaffekapslen has always spent a lot of time optimizing every part of the Magento site, including page speed. It proved to be a great idea, as their website has achieved excellent page speed results. As we can see from their Google Analytics report, when Hyvä was uploaded on the 15th of September the average Page Load Time decreased, and then again in October when we uploaded a few tweaks, they consistently hit an average below 2 seconds!

 

There is a stark contrast to the previous design implementations we have done with Kaffekapslen. The starting page speed score was very low and required our team's hard work to clean up the bloated Luma theme, and even more - trying to further optimize the frontend code.

In addition to the great results that we achieved on page load time, we also extended and customized features to fulfill Kaffekapslen’s eCommerce needs and wants. At the same time, we also did a thorough cleanup of unused 3rd party modules in connection with upgrading Magento to 2.4.4 to properly uninstall vendor-bundled extensions which were never used on the site.

Custom GA4 and GTM eCommerce event integration

Because of the changes we made to the “Add-to-cart" functionality, the previous analytics tracking, for Add-to-cart, was no longer working. Therefore, we had to re-implement the Add-to-cart event in the datalayer.

Furthermore, we extended the datalayer to contain an event for subcategories, as the default implementation does not distinguish the main category and a subcategory from each other.

100% Custom design 

We implemented 100% custom design collaborating closely with Kaffekaplen’s UI/UX designer. The result is a beautiful, user-friendly design that was smooth and efficient to implement and will be easy to maintain in the future, following the best practices of Alpine.js and Tailwind CSS which Hyvä is based on.

In close cooperation with Kaffekapslen's designer we made sure that each page was optimized, and to not ruin the impressive results of the Hyvä theme.

The results

Kaffekapslen now has a lightning-fast and intuitive website they can be proud of. The website’s average page load time has been reduced to under 2 seconds, it has impressive results in Google Lighthouse reports, and the site is fully optimized for an excellent user experience. Hyvä proved to be everything that it promised to be, and the client will enjoy an easier-to-maintain and extend frontend in the future. Even with implementing a custom design with Hyvä, upgrading the Magento version, implementing custom features, and further optimizing by removing unused 3rd party extensions, the project was still delivered in 3 months, which we don’t think would have been possible using the Luma theme. The whole project wouldn't have been possible without the hard work of our dedicated team and the experienced guys at https://www.kaffekapslen.dk/.