The 3 Studio
WorkPortfolioServicesInsights
BACK TO PORTFOLIO
Shopify Store Development

Kaaisha by Shalini Gupta

ROLE: Freelance Shopify DeveloperLuxury Womenswear & Occasion Wear
PROJECT OVERVIEW

Developed custom Liquid templates, mega menus, and interactive galleries for Kaaisha by Shalini Gupta's luxury boutique. Customized layouts to fit bridal and couture occasion wear with smooth product showcases.

THE CHALLENGE

Bridal outfits require booking consultations rather than direct buy-now clicks for highly custom fitting requests.

THE SOLUTION

We integrated a dynamic conditional buy button that switches between 'Buy Now' and 'Book Bridal Consultation' based on a product's tag configuration.

DELIVERABLES & FEATURES
  • Custom megamenu settings directly editable via Shopify Theme Customizer.
  • Custom checkout query forms to capture wedding dates and specific fitting requests.
  • Responsive collections optimized for touch screens on luxury mobile tablets.
  • Integrated design matching social feeds and style diaries.
DEV HIGHLIGHT & CODE QUALITY

Liquid schema setup allowing theme administrators to organize categories with nested links within the main menu block.

Theme Megamenu Navigation Settings Schemaliquid
{% comment %}
  Mega menu block definition schema allowing customizable title, links, and promo banners.
{% endcomment %}
{% for block in section.blocks %}
  {% if block.type == 'megamenu_item' %}
    <div class="megamenu-dropdown" id="menu-{{ block.id }}">
      <div class="grid grid-cols-4 gap-8 p-8">
        <div class="col-span-3 grid grid-cols-3 gap-6">
          {% for link in linklists[block.settings.menu_linklist].links %}
            <div>
              <h4 class="font-bold text-white uppercase mb-2">{{ link.title }}</h4>
              <ul class="space-y-1">
                {% for child_link in link.links %}
                  <li><a href="{{ child_link.url }}" class="text-[#888] hover:text-white transition-colors">{{ child_link.title }}</a></li>
                {% endfor %}
              </ul>
            </div>
          {% endfor %}
        </div>
        <div class="col-span-1">
          <a href="{{ block.settings.promo_url }}">
            <img src="{{ block.settings.promo_image | img_url: 'large' }}" alt="Promo Banner" class="w-full h-auto" />
          </a>
        </div>
      </div>
    </div>
  {% endif %}
{% endfor %}
PERFORMANCE STATS
MOBILE PAGESPEED
90/100
DESKTOP PAGESPEED95/100
AVG. LOAD TIME1.6s
TECH STACK USED
Shopify LiquidCustom Megamenu SchemaTheme DevelopmentMobile UX

READY TO SELL MORE?