Jump to content

Product Attributes Drop Down Box Width


sean_mac

Recommended Posts

I'be veen wrecking my brain the last few hours with this, maybe I'm stupid, who knows.

 

Does anyone out there know where I would go to edit the width of the dropdown box for product attributes on the front office?

 

I am designing a shop based on custom print and want to offer choices like A3 A4 and 8.5 x 11 etc, but the product attributes box is not wide enough to look neat. I've checked product TPL and Theme.css file (which is an un-nested mess to go through) but I can't find the code for the width of the attributes drop down box.

 

any help out there would be greatly appreciated as I have solved all my other problems posted so far. I thought it might be in form fields but I don't see it there either. Maybe I need ot add code somewhere?

Link to comment
Share on other sites

I'be veen wrecking my brain the last few hours with this, maybe I'm stupid, who knows.

 

Does anyone out there know where I would go to edit the width of the dropdown box for product attributes on the front office?

 

I am designing a shop based on custom print and want to offer choices like A3 A4 and 8.5 x 11 etc, but the product attributes box is not wide enough to look neat. I've checked product TPL and Theme.css file (which is an un-nested mess to go through) but I can't find the code for the width of the attributes drop down box.

 

any help out there would be greatly appreciated as I have solved all my other problems posted so far. I thought it might be in form fields but I don't see it there either. Maybe I need ot add code somewhere?

 

That really depends on your theme. Could you provide url to your store?

Link to comment
Share on other sites

That really depends on your theme. Could you provide url to your store?

I am using Prestashop 1.7.1.2 and on the classic theme which I have modified up to now (crudely but it worked) lol.

 

I'll set it live for a few mins so you can see it. if you go in and view any of the products you will see the product attributes dropdown is squashed and very ugly to look at. I want to widen this a bit and give it a neater look.

 

Head wrecked lol..

Edited by sean_mac (see edit history)
Link to comment
Share on other sites

Well, if you mean the width of this dropdown, then look at .product-variants>.product-variants-item select in your css. Default width is set to 3.75 rem ~~ approximately 4 letters

 

a6e3VTu0Gcvl0B8r8utYf8vmCKsnlD.png

Which css file am I going to, theme.css?

Link to comment
Share on other sites

yep, look for this string:

 

.product-variants>.product-variants-item select{border:1px solid #ebebeb;height:2.5rem;width:3.75rem}

I found it there, god bless your eyesight lol, made appropriate changes but nothing happened, still looking at the ugly little drop down.

Link to comment
Share on other sites

I found it there, god bless your eyesight lol, made appropriate changes but nothing happened, still looking at the ugly little drop down.

 

You have to clear the cache, both on server ( Advanced Parameters > Performace > Clear Cache) and on your browser. If you are using chrome, then open developers tools. Once it's open, right-click on refresh button, and select Empty cache and hard reload option. 

 

Faded_Short_Sleeves_T-shirt_2017-07-24_1

Link to comment
Share on other sites

You have to clear the cache, both on server ( Advanced Parameters > Performace > Clear Cache) and on your browser. If you are using chrome, then open developers tools. Once it's open, right-click on refresh button, and select Empty cache and hard reload option. 

 

Faded_Short_Sleeves_T-shirt_2017-07-24_1

Yep, did that too, it's still there, like an alien staring into my pitiful soul lol

Link to comment
Share on other sites

Well, it looks ok to me - I can see the dropdown with 10rem width. It's probably caching issue with your browser. See these 2 screenshots:

 

THE_KOREAN_10_PACK_2017-07-24_11-21-04.p

ok, then it's official, my browser hates me with a blood boiling vengeange lol. Thanks for all your help mate, you're a star! Does your fre module work on my version of prestashop by the way? It looks very useful to me in case I ever need to restore this site.

Link to comment
Share on other sites

It's a pain in the butt, I can stil lsee the squashed dropdown even with google chrome, firefox etc. I'm gonna do a full clen out of this pc and look again.

 

That's really strange. It may be related to your CDN provider (According to http headers on theme.css file it's served from Incapsula). CDN network uses many edge servers, and the server closest to you may still cache old version of this file. The server closest to me (prague) obviously returns new/updated version, since I can see it correctly.

 

Try to log-in to the CDN admin panel and clear cache. Anyway, the cdn cache should expire in a few hours, so even if you dont take any action it will correct itself eventually. 

 

And yes, my module works on 1.7 just fine. Definitely give it a try - if you need any assistance, don't hesitate to contact me here or via email

Edited by DataKick (see edit history)
Link to comment
Share on other sites

That's really strange. It may be related to your CDN provider (According to http headers on theme.css file it's served from Incapsula). CDN network uses many edge servers, and the server closest to you may still cache old version of this file. The server closest to me (prague) obviously returns new/updated version, since I can see it correctly.

 

Try to log-in to the CDN admin panel and clear cache. Anyway, the cdn cache should expire in a few hours, so even if you dont take any action it will correct itself eventually. 

 

And yes, my module works on 1.7 just fine. Definitely give it a try - if you need any assistance, don't hesitate to contact me here or via email

That's great to know, there aren't many free modules out there and some are quite expensive. I'm quite out of date with my coding skills but who knows, with a bit pf refreshing I might get to making modules myself at some point. One hting that does bug me about prestashop is the theme layouts, example, if I want three columns full width of the page it's alot of messing around. 

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...