Variable option title

[Klarity]

Hi,

I was wondering if there is a way to get the attribute titled to show on a variable product page next to the drop-down list in the same way that is does on Neighborhood. I’ve attached a few screen shots to help with the explanation. The information i am entering wont be clear to the user without this Attribute title showing.

Many thanks

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Hi

Sure, add this to your custom css:

.woocommerce div.product form.cart .variations td.label {
  display: block;
  text-align: left;
  width: 40px;
}
.woocommerce div.product form.cart .variations td.label label {
  line-height: 60px;
}

– Kyle

[Klarity]

Hi Kyle,

thanks that’s awesome!
My next question i think is related so left it in this post (sorry if this is wrong?)

Is it possible to show the filter titles, using the ‘mobile filter’ layout.
Please see ref image.

Cheers,

Pete

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Yes the filters will show when you have products on the page with the filters assigned

– Kyle

[Klarity]

Hi Kyle,

Yep got the filters working. It’s just their titles which arn’t being pulled from the widgets. Is it possible to show this?

Many thanks

Pete

[Kyle – SUPPORT]

Add this to your custom css:

.sf-mobile-shop-filters .widget > .widget-heading {
  display: block;
}

– Kyle

[Klarity]

Perfect – thanks for this!

[Kyle – SUPPORT]

no problem 🙂

[Klarity]

hi Kyle,

since the update this css has stopped working

.woocommerce div.product form.cart .variations td.label {
display: block;
text-align: left;
width: 40px;
}
.woocommerce div.product form.cart .variations td.label label {
line-height: 60px;
}

[Kyle – SUPPORT]

Seems to be fine? http://d.pr/i/18BBL/2sjNNYjA

– Kyle

[Klarity]

Sorry, i should have been more specific.
Im trying to get ‘Top Finish’ and ‘Base finish’ on the same lines

Many thanks,

[Mohammad – SUPPORT]

Hi,
Please use this custom css code:-

.woocommerce div.product form.cart .variations td.label {
 width: 85px !important;
}

Thanks
Mohammad