Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

How to adjust the height of the variation dropdown on product page & get rid of underline across site?


Edwardxu

Question

Site URL: https://www.edxulondon.com/

Hello, I have 2 questions. My website is: www.edxulondon.com

1. How do I adjust the height of the variation dropdown on product page? please see photo, the dropdowns are thicker than the purchase button (0.4em), i want to make them all the same thickness.

2. I injected code before to get rid of all the underlines on hyperlinks before, for some reason they all came back yesterday. I think the codes I used no longer works, could you kindly advise how to get rid all the underlines?

Thank you so much in advance!

Screenshot 2021-03-12 at 18.51.37.png

Link to comment

15 answers to this question

Recommended Posts

  • 0
3 hours ago, Edwardxu said:

Site URL: https://www.edxulondon.com/

Hello, I have 2 questions. My website is: www.edxulondon.com

1. How do I adjust the height of the variation dropdown on product page? please see photo, the dropdowns are thicker than the purchase button (0.4em), i want to make them all the same thickness.

2. I injected code before to get rid of all the underlines on hyperlinks before, for some reason they all came back yesterday. I think the codes I used no longer works, could you kindly advise how to get rid all the underlines?

Thank you so much in advance!

Screenshot 2021-03-12 at 18.51.37.png

Please send the product site url

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Youtube Gallery for Squarespace
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0
56 minutes ago, Edwardxu said:

Hi, thanks for your reply. The products are currently hidden because they are not fully ready. But I made 1 product available to public now so you can see.

https://www.edxulondon.com/shop-1/p/fang-bangle

try

.ProductItem-details .variant-select-wrapper, .ProductItem-details .product-quantity-input input {
    padding: 0.5rem;
}
.product-details .variant-select-wrapper:after {
  height: 0.75rem;
  width: 0.75rem;
}
.ProductItem-details .variant-option-title, .ProductItem-details .variant-out-of-stock, .ProductItem-details .quantity-label {
  margin-bottom: 1em;
}

image.png.b2f34bad7f95c91767402fa62c91f9b6.png

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Youtube Gallery for Squarespace
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
  • 0
29 minutes ago, bangank36 said:

try


.ProductItem-details .variant-select-wrapper, .ProductItem-details .product-quantity-input input {
    padding: 0.5rem;
}
.product-details .variant-select-wrapper:after {
  height: 0.75rem;
  width: 0.75rem;
}
.ProductItem-details .variant-option-title, .ProductItem-details .variant-out-of-stock, .ProductItem-details .quantity-label {
  margin-bottom: 1em;
}

image.png.b2f34bad7f95c91767402fa62c91f9b6.png

Thank you so much! It worked perfectly! I have a few more questions, hope you would be able to help:

1. Currently, there is a huge gap between the product and additional information section, are you able to help to reduce it to look more normal?

2. In the additional information section, I injected an 'expandable features' code block to make the writing expand. However, the size only works in H3. I am wondering whether you could help me to reduce it to H4?

3. I injected code before to get rid of all the underlines on hyperlinks. But for some reason they all came back a few days ago. I think the codes I used may no longer work, do you know how to get rid of all these underline again?

Thank you so much in advance!! 

Screenshot 2021-03-13 at 12.44.01.png

Link to comment
  • 0
On 3/13/2021 at 7:51 PM, Edwardxu said:

Thank you so much! It worked perfectly! I have a few more questions, hope you would be able to help:

1. Currently, there is a huge gap between the product and additional information section, are you able to help to reduce it to look more normal?

2. In the additional information section, I injected an 'expandable features' code block to make the writing expand. However, the size only works in H3. I am wondering whether you could help me to reduce it to H4?

3. I injected code before to get rid of all the underlines on hyperlinks. But for some reason they all came back a few days ago. I think the codes I used may no longer work, do you know how to get rid of all these underline again?

Thank you so much in advance!! 

Screenshot 2021-03-13 at 12.44.01.png

Do you still need help on this? We will take a look

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment
  • 0
17 hours ago, creedon said:

@Edwardxu

Go to Commerce > Related Products > Section Title.

Type in all capital letters. Save.

845546394_ScreenShot2021-03-25at5_07_39PM.png.bda759805b1158a2b2b9f044dc9b1112.png

Let us know how it goes.

Thanks! Silly me, didn't notice I could change it there.

I have another question and i am wondering whether you can help? I am using a 7.1 site, so I can't adjust how many related products to show per row. I want to show 5 products but on the same row, are you able to help?

https://www.edxulondon.com/shop-1/p/fang-ring

Screenshot 2021-03-26 at 17.58.05.png

Link to comment
  • 0
1 hour ago, creedon said:

Add the following to Store Settings > Advanced > Page Header Code Injection for the store page.


<style>

  @media screen and ( min-width : 768px ) {
  
    .products.collection-content-wrapper .list-grid {
    
      grid-template-columns : repeat( 5, minmax( 0, 1fr ) );
      grid-row-gap : unset;
      
      }
    }
    
  </style>

Let us know how it goes.

Hi Thanks for your reply. Unfortunately it says 'Syntax error on line' after i put in the codes, and all my other CSS code became invalid. Any advice?

Screenshot 2021-03-26 at 21.07.34.png

Link to comment
  • 0
7 hours ago, creedon said:

You put the code in Design > Custom CSS instead of where I suggested. That is why you are getting the syntax error.

If you want to put the code in Design > Custom CSS then remove the <style> and </style>. Although I didn't test the code for use in Design > Custom CSS.

Hi Creedon, Thanks for getting back to me, you are right! I am so sorry, I completely miss that and put in the wrong place. So the code does work, but now on my main product list page, it also shows 5 items per row, which is very tight. Could we change it back to 4 rows on the main product list page but keeping 5 for the related products? Sorry for all these questions, I really appreciate your help!

Link to comment

Create an account or sign in to comment

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

×
×
  • Create New...