From a basic brochure site to a full ecommerce site with a very detailed gate configuration wizard.
A colleague that I knew from WordCamps and other local WordPress events contacted me to update Killeen Engineering‘s basic brochure site to a full ecommerce site to improve the sales flow and conversions.
More power to the customer
The starting point was a brochure site with all the various gate types listed, including photos of each. As the final price depends on many factors (beginning with dimensions and automation preference), the customer may be surprised in the change from the base price. Customers contact the company and the sales person phoned them back and spent a lot of time talking through the options and the cost of each. This was expensive for the company hence they wanted to enhance the site to improve the quality of the leads coming to the sales team.
By allowing the customers configure the gate through an online wizard they will get a more accurate idea of the cost of their chosen gate. If they complete the wizard and submit the info to the sales team they are likely to be a strong lead that is close to making a purchase.
Gate Configurator
Variable products in WooCommerce are generally quite simple with few choices e.g. size and colour. Killeen needed a setup with a very large number of possible configurations so a variable product type was not an option.
I then discovered Advanced Product Fields for WooCommerce by Studio Wombat. I experimented with the free version before finding that I needed the Pro version. I quickly found that the €50 annual cost was great value.
The Product Fields admin area is similar to that of Advanced Custom Fields. Over time the field group for aluminium gates has expanded to 90 fields in 15 sections. The sections are used to break the configuration wizard into pages, and make the process less overwhelming.
Formula pricing
The dimensions of a gate is a critical part for the product price. The Pro version of Advanced Product Fields allows for a formula to determine the price of an option. For the dimensions the formula uses the values of the width and height fields and passes them to custom code.
The custom code returns a lookup table of widths and heights and the price for each combination. The plugin rounds up, looking at the next width or height up from what the user entered. This allows Killeen have “bands” of prices and can display the right price with the minimum number of cells in the lookup table.
Site settings
In the admin area I used CMB2 to create a site settings page.
The first block of settings allows the site admin upload a CSV file for the pricing lookup tables. My code converts this into the layout that the plugin requires. The pricing table differs for each gate base material type so there’s an upload setting for each.
Other settings include the phone number, links to social media pages, the default author image for blog posts and a YouTube video explaining the checkout options (as there are two deposit options, a financing option and pay full price option).
Global product information
I used CMB2 to create a Global Product Information settings page, with sections for Downloads, Included services, Motor information and Smart App information.
This is displayed in tabs on each product page alongside the product description (renamed ‘Specifications’).
Payment options
The gates that Killeen sells are not cheap so most people will finance the cost or pay a deposit. I installed Acoweb’s Deposits and Partial Payments plugin. I then purchased the Premium version so that deposits could be offered on the checkout page – customers can book a showroom visit (the sales team will receive the chosen gate configuration so have a great starting point), pay 5% now or pay 50% now.
Conclusion
This project was a fantastic opportunity with lots of learning experiences. Killeen’s in house graphic designer quickly produced SVG graphics each time a new one was needed. For each step of the gate configurator Killeen created a YouTube video to explain the options presented.
The Advanced Product Fields plugin was a life saver and extremely powerful. The plugin support team werre very responsive when I encountered issues (mostly my mistakes or misunderstandings).