Recreate Shop Menu and Display Attribute Tile under swatch

Hello,

Thank you for contacting our support center.

1. You need to create HTML Block for your shop menu dropdown structure. You can see how it will look on this screenshot http://imgur.com/9wg1KPq
Then you need to past this block shortcoder ([html_block id=""]) and place it to the description field on Appearance -> Menus screen. Here is a screenshot of how it should look http://imgur.com/VKojiNW
If you want we can create you an example just provide us your admin access.

2. We can help you to show the name of the current attribute term name chosen on product variations as a free customization service, just set up child theme and provide your FTP access so we could do a few code changes.

Regards
Xtemos

It would be much easier for us to adapt this customization to your web-site when you will give us your server access, when you go live.

Thank you

Here is a code snippet that you need to add into your Custom CSS field in Theme Settings to show tooltips under swatches circles

.basel-swatch:before {
    display: block;
    opacity:0;
    visibility:hidden;
    border-radius:2px;
    position: absolute;
    top: -32px;
    left: 50%;
    background: #252525;
    color: white;
    font-size: 14px;
    font-weight: normal;
    text-transform: capitalize;
    content: attr(data-value);
    padding: 3px 8px;
    transform: translateX(-50%);
    transition: all 0.2s ease-in-out;
}

.basel-swatch:hover:before {
    opacity:1;
    visibility:visible;
    top: -27px;
}

Here is a code snippet that you need to add into your Custom CSS field in Theme Settings to show tooltips under swatches circles

Thanks!

Here is a code snippet that you need to add into your Custom CSS field in Theme Settings to show tooltips under swatches circles

For future release ) data-value – contains atribute slug, but not name or description.. For non-english sites, it’s not good ) because in the tooltip displays only english text =)