Case Study: Designing & Developing Yala Designs on BigCommerce

Yala logo

Heavily-Customized Theme Development on BigCommerce

IntuitSolutions developed a heavily-customized theme for The high volume of customizations made this project not only fun to develop but also a soaring success. The attention to detail found within the designs made every element consistent with Yala’s brand and feel. From the bee’s flight path graphic within each Mega Menu panel, to the tiny flowers surrounding each active top-level menu item.

Extensive Page Layout Customizations

The most heavily customized pages are Yala’s Category pages. Not only is the page layout itself unique and customized – note the beautiful pattern within the sidebar – but we added a lot of eye-catching page functionality and gave the entire site a great level of visual depth.

Some of our favorite functional customizations to the Category pages include our ever-popular Image Swap on Hover. When hovering your mouse over any product image, you’ll see it quickly swap out for an alternative view. Does this product come in any other colors? If it does, a swatch will be loaded showing you each of the color variations below the main product image, and clicking one of these color swatches will load the corresponding image of the product, replacing the main image. See it in action here!

Back to that beautiful pattern in the sidebar filters – it’s notoriously difficult to style these sections with the way BigCommerce is set up, and you don’t see it often. This was an important part of the Yala design aesthetic and we were able to include it for them!

“The attention to detail found within the designs made every element consistent with Yala’s brand and feel, from the bee’s flight path graphic within each Mega Menu panel to the tiny flowers surrounding each active top level menu item.”– Aaron Nowlen, Developer, IntuitSolutions

BigCommerce Dynamic Product Tags

We also created a system for dynamic badges in the top right corner of each product. This way, our client can add a badge that lets customers know instantly from the category page that this is a “New” product or a “Sale” item.

Another interesting feature that was built for Yala is the Store Locator. Using our custom functionality, Yala is able to add or remove store locations carrying their products in a snap, and they don’t need to consult a developer when adding or removing locations. While our Monthly Managed Plans are a great value, we also want our customers to be able to handle what they want to handle, and this functionality makes it easy.

Custom “New” and “Sale” tags for

BigCommerce Custom Wholesale Login Customization

We created a custom login page for Yala to separate wholesale customers from standard returning retail customers. This allows the wholesale customers to login to their wholesale account at a separate location than the retail login. New customers can also request to be placed into a Wholesale Customer group with specified payments available.

Once logged in, our code uses advanced conditional logic sitewide to separate the wholesale experience and the retail experience. The product pages display the MSRP, and then the Wholesale price if you’re logged in as Wholesale – both prices are contained within the same listing, so no more duplicate listings.

Additionally, different promotional banners will be shown if a customer is logged in as part of a Wholesale/Dropship customer group. This allows you to target specific customers and give the right deals to the right people.

Finally, we topped off the development by installing our One Page Checkout for BigCommerce, along with a few tweaks. We added a field, for Wholesale customers only, to enter a PO number. Conversely, options for Gift Wrap, Message, and Gift Certificate will only be available to retail customers. A note of “ALL SALES FINAL” appears for each product in the Clearance category, and a single button option can empty the entire cart if desired.

Make Your BigCommerce Store Beautiful

Ready for beautiful, functional customizations like Yala Designs? Give us a call at 866.590.4650 or shoot us a message below!

Contact Us

Related Post

Olark Widget Preloader