Skip to content

Instantly share code, notes, and snippets.

@benjamin-hull
Created October 30, 2012 21:43
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save benjamin-hull/3983268 to your computer and use it in GitHub Desktop.
Save benjamin-hull/3983268 to your computer and use it in GitHub Desktop.
<!-- Using static navigation -->
<ul id="eCommerceNavBarMenu">
<li class="topLevel navfirstitem"><a class="topLevel" href="/online/shop/new-in">New
In</a></li>
<li class="topLevel">
<a class="topLevel" href="/online/shop/shoes">Shoes</a>
<div class="ecommerceMegaMenu Shoes c4">
<!-- floated parents need a width (total of children) -->
<div class="c1">
<!-- container 1 -->
<ul class="topLevel">
<li class="subLevel navfirstitem"><strong>Shop By Category</strong></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/shoes/heeled-shoes">Heeled Shoes</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/shoes/platform-shoes">Platform Shoes</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/shoes/flat-shoes">Flat Shoes</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/shoes/party-shoes">Party Shoes</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/shoes/court-shoes">Court Shoes</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/shoes/peep-toe-shoes">Peep Toe Shoes</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/shoes/trainers">Trainers</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/shoes/wedge-shoes">Wedge Shoes</a></li>
</ul>
</div>
<div class="c2">
<!-- container 2 -->
<ul class="topLevel">
<li class="subLevel navfirstitem"><strong>Get Inspired</strong></li>
<li class="subLevel"><a class="subLevel" href="/online/shop/new-in">New
Arrivals</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/best-sellers">Best Sellers</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/control/eCommerceContent?contentId=SP_TRENDS_HUB">Trends</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/killer-heels">Killer Style</a></li>
</ul>
</div>
<div class="c3"><!-- container 3 -->
<img src=
"/osafe_theme/images/user_content/images/MegaMenu/2012/20121019_grange.jpg" alt=
"Grange - ladies trainer" width="180" height="210" border="0" /></div>
<p><a href=
"http://prod.modainpelle.com/online/control/eCommerceProductDetail?productId=GRANGE">
This week&acirc;&euro;&trade;s top rated shoe 'Grange' received top marks from
customers for look and quality &Acirc;&raquo;</a></p>
</div>
</li>
<li class="topLevel">
<a class="topLevel" href="/online/shop/boots">Boots</a>
<div class="ecommerceMegaMenu Boots c4">
<!-- floated parents need a width (total of children) -->
<div class="c1">
<!-- container 1 -->
<ul class="topLevel">
<li class="subLevel navfirstitem"><strong>Shop By Category</strong></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/boots/heeled-boots">Heeled Boots</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/boots/ankle-boots">Ankle Boots</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/boots/flat-boots">Flat Boots</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/boots/shoe-boots">Shoe Boots</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/boots/wellington-boots">Wellington Boots</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/boots/wedge-boots">Wedge Boots</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/boots/calf-boots">Calf Boots</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/boots/knee-high-boots">Knee High Boots</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/boots/winter-boots">Winter Boots</a></li>
</ul>
</div>
<div class="c2">
<!-- container 2 -->
<ul class="topLevel">
<li class="subLevel navfirstitem"><strong>Get Inspired</strong></li>
<li class="subLevel"><a class="subLevel" href="/online/shop/new-in">New
Arrivals</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/best-sellers">Best Sellers</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/control/eCommerceContent?contentId=SP_TRENDS_HUB">Trends</a></li>
</ul>
</div>
<div class="c5"><!-- container 3 -->
<img src=
"/osafe_theme/images/user_content/images/MegaMenu/2012/20121003_hiker.jpg" alt=
"Hiker - ladies knee high boot" width="180" height="240" border="0" /></div>
<p><a href=
"http://prod.modainpelle.com/online/control/eCommerceProductDetail?productId=HIKER">
Get country chic this winter with equestrian inspired boot styles
&Acirc;&raquo;</a></p>
</div>
</li>
<li class="topLevel">
<a class="topLevel" href="/online/shop/sandals">Sandals</a>
<div class="ecommerceMegaMenu Sandals c7">
<!-- floated parents need a width (total of children) -->
<div class="c1">
<!-- container 1 -->
<ul class="topLevel">
<li class="subLevel navfirstitem"><strong>Shop By Category</strong></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/sandals/flat-sandals">Flat Sandals</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/sandals/heeled-sandals">Heeled Sandals</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/sandals/wedge-sandals">Wedge Sandals</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/sandals/gladiator-sandals">Gladiator Sandals</a></li>
</ul>
</div>
<div class="c6"><!-- container 2 -->
<img src=
"/osafe_theme/images/user_content/images/MegaMenu/2012/20121003_free_delivery.gif"
alt="Grange - ladies trainer" width="180" height="180" border="0" /></div>
</div>
</li>
<li class="topLevel">
<a class="topLevel" href="/online/shop/bags">Bags</a>
<div class="ecommerceMegaMenu Bags c7">
<!-- floated parents need a width (total of children) -->
<div class="c1">
<!-- container 1 -->
<ul class="topLevel">
<li class="subLevel navfirstitem"><strong>Shop By Category</strong></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/bags/shoulder-bags">Shoulder Bags</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/bags/clutch-bags">Clutch Bags</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/bags/cross-body-bags">Cross Body Bags</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/bags/tote-bags">Tote Bags</a></li>
</ul>
</div>
<div class="c2"><!-- container 2 -->
<img src=
"/osafe_theme/images/user_content/images/MegaMenu/2012/20121003_milobag.jpg" alt=
"Milobag - must-have ladies bag" width="180" height="180" border="0" /></div>
<p><a href=
"http://prod.modainpelle.com/online/control/eCommerceProductDetail?productId=MILOBAG">
Studs are a must-have feature on accessories for Autumn/Winter, Milobag is really
versatile and a great day-to-evening bag &Acirc;&raquo;</a></p>
</div>
</li>
<li class="topLevel">
<a class="topLevel" href="/online/shop/accessories">Accessories</a>
<div class="ecommerceMegaMenu Accessories c7">
<!-- floated parents need a width (total of children) -->
<div class="c1">
<!-- container 1 -->
<ul class="topLevel">
<li class="subLevel navfirstitem"><strong>Shop By Category</strong></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/accessories/scarves">Scarves</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/accessories/gift-ideas">Gift Ideas</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/accessories/shoe-care">Shoe Care</a></li>
</ul>
</div>
<div class="c2"><!-- container 2 -->
<img src=
"/osafe_theme/images/user_content/images/MegaMenu/2012/20121003_gift_voucher.gif"
alt="Gift Vouchers" width="180" height="110" border="0" /></div>
<p><a href=
"http://prod.modainpelle.com/online/control/eCommerceProductDetail?productId=GIFT_VC_50">
The perfect gift for the shoe lover in your life &Acirc;&raquo;</a></p>
</div>
</li>
<li class="topLevel">
<a class="topLevel" href="/online/shop/wedding">Wedding</a>
<div class="ecommerceMegaMenu Wedding c8">
<!-- floated parents need a width (total of children) -->
<div class="c1">
<!-- container 1 -->
<ul class="topLevel">
<li class="subLevel"><a class="subLevel" href=
"/online/shop/wedding/bridesmaid-shoes">Bridesmaid Shoes</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/wedding/bridal-shoes">Bridal Shoes</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/wedding/wedding-shoes">Wedding Shoes</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/wedding/bridal-accessories">Bridal Accessories</a></li>
</ul>
</div>
</div>
</li>
<li class="topLevel">
<a class="topLevel" href="/online/shop/brands">Brands</a>
<div class="ecommerceMegaMenu Brands c11">
<!-- floated parents need a width (total of children) -->
<div class="c9">
<!-- container 1 -->
<ul class="topLevel">
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/adele-marie">Adele Marie</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/armani">Armani</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/ash">Ash</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/australia-luxe">Australia Luxe</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/bronx">Bronx</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/camper">Camper</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/daniel">Daniel</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/diesel">Diesel</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/enzo">Enzo</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/fly-london">Fly London</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/hunter">Hunter</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/juicy-couture">Juicy Couture</a></li>
</ul>
</div>
<div class="c10">
<!-- container 2 -->
<ul class="topLevel">
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/lotus">Lotus</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/lotus-from-australia">Love from Australia</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/gift-ideas">Gift Ideas</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/luxury-rebel">Luxury Rebel</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/miz-mooz">Miz Mooz</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/riva">Riva</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/rubber-duck">Rubber Duck</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/sam-edelman">Sam Edelman</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/scholl">Scholl Care</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/smith-and-canova">Smith and Canova</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/tory-burch">Tory Burch Ideas</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/brands/zandra-rhodes">Zandra Rhodes</a></li>
</ul>
</div>
</div>
</li>
<li class="topLevel">
<a class="topLevel" href="/online/shop/sale">Sale</a>
<div class="ecommerceMegaMenu Sale c14">
<!-- floated parents need a width (total of children) -->
<div class="c1">
<!-- container 1 -->
<ul class="topLevel c12">
<li class="subLevel navfirstitem"><strong>Shop By Category</strong></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/sale/sale-boots">Sale Boots</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/sale/sale-shoes">Sale Shoes</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/sale/sale-sandals">Sale Sandals</a></li>
<li class="subLevel"><a class="subLevel" href=
"/online/shop/sale/sale-bags">Sale Bags</a></li>
</ul>
</div>
<div class="c13"><!-- container 2 -->
<img src=
"/osafe_theme/images/user_content/images/MegaMenu/2012/20121003_sale.gif" alt=
"Autumn Reductions - Sale now on" width="180" height="180" border="0" /></div>
</div>
</li>
</ul>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment