WordPress themes can look great in the demos then when you start to build your site with one you find some features don’t quite match what you need. This was the case today for a client using the Milo theme for an online art portfolio.
The first changes involved setting up a child theme and tweaking the CSS to achieve a nicer layout. Next we added some social links and social sharing icons and contact details. The responsive layout of the site needed some work, so it would look good on different devices and screen sizes.
At the heart of the website are the galleries showing the client’s paintings and the theme uses Javascript to achieve fading transitions between the pictures in a gallery. This is a feature the client particularly likes, yet like any non-standard feature it leads to some awkward situations; in this case, how to implement social sharing links? Sharing the page url just links to the whole gallery, not the individual pictures, because of the Javascript gallery navigation. I found a technical solution, involving overriding some of the theme’s PHP and Javascript in our bespoke child theme and adding some PHP code to put a reference to the picture id in the social link’s query string, and a Javascript function to read the query string from the page’s url and jump to the corresponding picture in the gallery. Problem solved.
The final challenge was that the client wished to turn their art portfolio into an online shop so they could sell paintings. Woocommerce is the top choice for selling products through a WordPress website and the Milo theme is advertised as being Woocommerce-compatible. In practice this means the theme doesn’t prevent you using Woocommerce, but it doesn’t really integrate with it in any of the ways you might hope either. We started by adding a shopping basket link icon to the child theme which also displays how many products the customer has in their basket. Most importantly we added some PHP to enable a link between a gallery image and a Woocommerce product in the Content Management System, which displays to customers as an “add to basket” link beneath the gallery image. This lets us continue to use the slick Milo gallery as the main shop front for the website.
