How WooCommerce Transformed Cornforth's Wilderness Photography Site

Overview

Jon Cornforth, a landscape and wilderness photographer, was working off an outdated website that failed to do justice to his striking prints and exciting tours. He already had a WordPress blog and wanted to centralize everything under one modern site. His goal was to create an online gallery where visitors could easily browse, preview in real life settings, and purchase prints in various sizes and frames without confusion. To pull this off, Kool Kat Web Designs suggested using WordPress paired with WooCommerce as an e-commerce engine, then adding custom templates and code to bring Jon's vision to life.

Key Challenges

• Cater to both horizontal and vertical images with inconsistent aspect ratios in a grid layout.
• Create dynamic previews that show how prints look in homes, offices, or hotels on product pages.
• Manage product variations like size and framing options without cluttering the product page.
• Stay within a robust but flexible system using WooCommerce hooks and filters.

Our Approach

We started by registering a new image size for vertical shots withadd_image_sizein WordPress, while keeping the default WooCommerce thumbnail for horizontal prints. A simple height vs width check determined which image to load in templates. For the category archive pages we removed default titles and buttons and leveraged thewoocommerce_before_subcategory_titlehook. Then we plugged in thejQuery Isotopeplugin to pack these custom thumbnails into a puzzle-like mosaic that responds to window resizing.

Single Product Page Tweaks

In each product template, we injected environment preview images right after the add-to-cart button viawoocommerce_after_add_to_cart_button. Licensing info was added usingwoocommerce_after_add_to_cart_form. A custom product-image.php template shuffled the logic so that visitors see how prints look on walls.

Variant Options in Cart

Instead of showing size and frame selectors on the product page, we hid them with CSS and let users choose in the cart. A custom variable.php file mimicked the WooCommerce JS widget, but our own script intercepted changes and pushed them to the cart. We also swapped out the core cart update hook by unhookingwoocommerce_update_cart_actionand added our own function during init so selections would stick.

Results

Within days of launch, Jon reported a smoother checkout and fewer support requests. The responsive grid drew visitors deeper into the gallery. Previewing prints on real walls reduced order hesitation. Add-to-cart rates climbed and the overall feel matched Jon's brand aesthetic. The streamlined codebase also made future tweaks faster.

Conclusion

This project shows how a mix of core Hooks, filters, template overrides, and a touch of jQuery can turn a standard WooCommerce install into a custom gallery and sales platform that fits a photographer’s needs. It's not about redoing everything—it's about picking the right spots to override and letting the rest run on rock-solid WooCommerce foundations.