Save $200 and book your WooConf ticket before June 30th!

WooConf takes place October 19-20 in Seattle, Washington.

3 WooCommerce stores with awesome product customizations

Written by Nicole Kohler on November 11, 2016 Blog, eCommerce inspiration, Managing products.

You want, we’re sure, every customer who purchases a product from your store to have an enjoyable shopping experience. You want to avoid broken links, slow pages, and abandoned carts.

The stakes get even higher for the shoppers who aren’t just browsing, but are creating the products they plan to purchase. Custom-created or personalized products can increase sales dramatically, but with their presence comes a need for product pages that go above and beyond the standard image gallery and add to cart button.

Whether you’re already selling products with optional personalization or are considering adding some custom creations for your store, we thought a little inspiration might prove useful. And, thanks to the WooCommerce Showcase, inspiration is never hard to find.

Here’s a look at three stores with some amazing customization options on their product pages, plus tips and extensions that will help you pull this off on your own store.

Design your own handcrafted pair of Qüero Handmade Shoes

This first example of product personalization is from a company that lives and breathes the concept of handmade goods. Qüero Handmade Shoes allows its customers to design a pair of men or women’s leather shoes online; upon ordering, each pair is handcrafted in Spain by an artisan with “generations of experience,” then shipped straight to your door.

captiuibibibib
Durable, one-of-a-kind, handcrafted leather shoes shipped from Spain to your doorstep.

Qüero’s customization process starts the moment a shopper views a product page. They’re first introduced to the shoe in question, and presented with a sample design as well as some introductory copy that discusses a few of the things that can be changed (like the color, sole thickness, and so on).

the product page
The start of a product page, this one for the women’s Jane Oxford — note the copy hinting at freedom of choice in color and sole options.

When “Customize This Shoe…” is clicked, the shopper is moved down the page to a cleanly-designed drop-down menu of options. Here they can choose everything from the colors to the pattern on the cap and toe of the shoe.

the customizer
The customization options are easy to read, and added tips in the question mark bubbles help first time buyers sort out exactly what they’re changing (and why they might want to change it).

Scroll back up just a bit, and each time you make a change or new selection, you’ll see both the top and bottom of your custom shoe:

your shoe preview
Your shoe preview updates automatically. This one’s quite a looker, hey?

There’s also an option on each page to apply a fabric to an entire shoe, which can save time for those indecisive shoppers (or those who simply don’t want to get into the fine details, like differing toe and heel colors).

heres that
Choose from a multitude of leathers and suedes based on color, which makes it easy to sort out what you’re going to get.

We love the straightforwardness of Qüero’s customizer, as well as how ingrained the concept of a custom shoe is from the start of every page. Designing your own leather shoes sounds like a bit of a daunting experience, but the product pages transform the process into something elegant and altogether enjoyable.

It’s one of those things you’ll want to show off, once your shoes are in hand (or, more appropriately, on your feet) — “I designed these myself! Want to see?”

Go for a ride in style with ELEVEN vélo

We were fortunate enough to share the ELEVEN vélo story on our blog earlier this year, but it’s worth having another look at how this maker of customized cycling wear allows shoppers to get the products they love.

caption here
Since 2001, ELEVEN vélo has been bringing custom cycling gear made from superfine Merino wool to customers from its home base in Sydney, Australia.

Choose a piece of cycling gear on the ELEVEN vélo store — say, a wool jersey with a full-length front zipper — and after a gallery of introductory photos, reviews, and fit information you’ll be taken right to the customization.

What we like about this take on personalization is how incredibly simple it is, both for the customer and for the shop. On the left side of the product page, you start with a flat black and white illustration of the product in question. Choosing C1 through C5 will update the illustration, and display a simple list of the colors you’ve chosen.

preview the colors you like for your jersey
Preview the colors you like for your jersey and change them at will.

Then, once you decide on colors you want, you merely look to the right side of the same screen. Instead of scrolling up or down to go from the preview to selection boxes, you glance from your C1 choice to the C1 box, and choose the same option you’ve already visualized.

pick your poison
Choose your colors, plus your sizing.

Again, the simplicity is what makes this one a winner. Customers surely want to see what the product they’re ordering is going to look like, but photo-realistic previews can potentially strain a server (especially if you have a lot of options!). This is one want to handle it quickly and still meet all their needs.

Create a one-of-a-kind Joolz stroller

One final store to take a peek at: Joolz, an Amsterdam-based brand that uses its theory of “positive design” to produce custom-made baby strollers.

caption
Right from the first moment you spend on the Joolz store, the customization aspect of your stroller is emphasized.

Joolz takes a step-by-step approach to customization with their product pages: when you click “Create Your Own Joolz,” you’ll be guided through choosing the stroller’s model, collection, fabric, and finally accessories.

The available options change with each selection, so if you return to the second step to choose a stroller from a different collection, you’ll then need to re-select your fabric in option three to see an accurate price and product preview.

you pick each item step by step
Pick each item step by step — Joolz guides you through the experience.

As you choose your stroller’s build, a photo above or to the side of the customizer — depending on your screen size — updates in real-time. When you reach the final step and are happy with the preview, it’s simply a matter of adding your custom Joolz to your cart and placing an order.

One thing we really enjoy about the Joolz customization experience: how smooth it works on mobile devices. Even if you change a lot of settings or have an awkward screen size, everything adjusts perfectly, allowing you to design from any device. Not every store can claim that!

Easy design even on mobile devices.
Easy design even on mobile devices.

Also, minimal scrolling is required to preview your custom stroller, thanks to where it appears on the screen (again, no matter your device). It’s this kind of thoughtfulness in design that we can’t help but appreciate.

How incredible customization is made possible with WooCommerce

There are quite a few ways to offer personalization, customization, or “kits” on your product pages. Here are a handful of WooCommerce extensions that we recommend trying, many of which these three stores are using:

  • Product Add-Ons – Add simple options like engraving, higher quality fabric, gift wrapping, or anything else you can think of via checkboxes, drop-down menus or radio buttons.
  • Composite Products – Allow your customers to create complex products with as many options or choices as you like — the key to building kits or multi-choice products.
  • Variation Swatches and Photos – Replace drop-down menus for colors or fabric styles with swatches or photos so shoppers can visualize their options.
  • Additional Variation Images – Even better: add photos for all your variants so there’s no question what will arrive in the mail.

Of course, you might have an idea for displaying personalization or custom products that goes beyond the scope of these extensions. If that’s the case, we recommend getting in touch with a developer (like one of our WooExperts) to build a custom solution.

Get inspired by these amazing stores

We hope this showcase of product customization has given you a few ideas for your own business. Whether you’re already offering custom designs and simply need to beef up your product pages or are just searching for inspiration, there’s a lot you can learn from here.

Looking for some more ideas? Swing on by the WooCommerce Showcase — there’s plenty more to see, from customizable products to unique subscription services to miniature jellyfish shipped on demand (really!).

Thanks for reading, and as always, leave any questions you have about this post in the comments.

11 Responses

  1. ecomlane
    November 12, 2016 at 12:07 am #

    Great idea’s! Thanks for sharing. This we help a lot of WooCommerce shops!

  2. Gerard A Thomas
    November 12, 2016 at 5:12 am #

    Hi Guys,

    Cheers for the mention on eleven.cc. It’s always nice when someone appreciated your work! 🙂

  3. Vandy
    November 12, 2016 at 8:47 am #

    Thanks your post, I got more idea to customize my site that using woocommerce plugin

    • Nicole Kohler
      November 14, 2016 at 5:31 pm #

      Glad we could inspire you Vandy. Drop us a note if you build something you’d like us to see!

  4. 24Seven Channel
    November 17, 2016 at 7:35 am #

    Great idea for product customization. We will suggest this post to our woocommerce clients.
    Thanks
    Regards
    24Seven Commerce
    Omnichannel eCommerce Retailing Platform.

  5. chapatti
    November 21, 2016 at 9:50 pm #

    For me this is the best product customization i have seen so far

  6. BLC
    November 22, 2016 at 6:49 pm #

    The Quero shoe optimizer is super cool!! Do you know what extension they used for that build process?

  7. Daniel
    November 23, 2016 at 7:41 pm #

    Great post!
    I would like to know how is it possible to make the shoe customization of querohms. Is there any plugin? I´d love to implement that on a craft shop website so the clients can choose from a variety of fabrics and see how it would look like on their products. Thanks for the information!

    • Nicole Kohler
      November 23, 2016 at 10:47 pm #

      Hey there Daniel — take a look at Composite Products, it’s an extension that might give you the functionality you’re looking for. https://woocommerce.com/products/composite-products/

      If that offers a bit too many options let me know and I can suggest some other solutions, but this will be the closest to what Quero has running 🙂

WooCommerce - the most customizable eCommerce platform for building your online business.

%d bloggers like this: