We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more

How to remove white space from product page?

Solved

How to remove white space from product page?

Emiway
Trailblazer
263 0 50

I want to remove this white space from my product page. 

URL plugmydrip.com

IMG-20240601-WA0007.jpg

Accepted Solutions (2)
PageFly-Amelia
Shopify Partner
626 165 238

This is an accepted solution.

You can use this code instead

.product-form__buy-buttons {
   margin-top: -20px;
  }

 

Please let me know if it works by giving it a Like or marking it as a solution!


➜ Optimize your Shopify store with PageFly Page Builder (Free plan available) 
➜ Weekly updated Shopify tutorials on YouTube 


All features are available from Free plan. Live Chat Support is available 24/7.

View solution in original post

devcoders
Shopify Partner
1654 190 499

This is an accepted solution.

Hi @Emiway 

 

- Go to Online Store -> Theme -> Edit code.
- Find the file assets/theme.css and paste the code below at the bottom of the file.

 

.product-form__buy-buttons {
margin-top: -30px;
}

 

devcoders_0-1717249774195.png

 

Shopify Developer: Helping eCommerce Stores
If you need assistance with your store, feel free to contact us at devcodersp@gmail.com
WhatsApp No: +91 8516919310 If my assistance was helpful, please consider liking and accepting the solution. Thank you!

View solution in original post

Replies 9 (9)

niraj_patel
Shopify Partner
2391 516 516

Hello @Emiway 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
@media screen and (max-width: 767px) {
  .product-form__buy-buttons {
      margin-top: -1rem;
  }
  .product-form {
      row-gap: 0 !important;
  }
}
</style>
Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com

devcoders
Shopify Partner
1654 190 499

Hi @Emiway 

- Go to Online Store -> Theme -> Edit code.
- Find the file assets/theme.css and paste the code below at the bottom of the file."

 

@media screen and (max-width: 749px){
.product-form__buy-buttons {
margin-top: -30px;
}
}

 

devcoders_0-1717240018670.png

 

Shopify Developer: Helping eCommerce Stores
If you need assistance with your store, feel free to contact us at devcodersp@gmail.com
WhatsApp No: +91 8516919310 If my assistance was helpful, please consider liking and accepting the solution. Thank you!
Emiway
Trailblazer
263 0 50

Not Working On Dekstop 

devcoders
Shopify Partner
1654 190 499

This is an accepted solution.

Hi @Emiway 

 

- Go to Online Store -> Theme -> Edit code.
- Find the file assets/theme.css and paste the code below at the bottom of the file.

 

.product-form__buy-buttons {
margin-top: -30px;
}

 

devcoders_0-1717249774195.png

 

Shopify Developer: Helping eCommerce Stores
If you need assistance with your store, feel free to contact us at devcodersp@gmail.com
WhatsApp No: +91 8516919310 If my assistance was helpful, please consider liking and accepting the solution. Thank you!
devcoders
Shopify Partner
1654 190 499

Hi @Emiway 

Great to hear that the issue has been resolved! If my assistance was helpful, please consider liking and accepting the solution. Feel free to reach out if you have any further questions.

Shopify Developer: Helping eCommerce Stores
If you need assistance with your store, feel free to contact us at devcodersp@gmail.com
WhatsApp No: +91 8516919310 If my assistance was helpful, please consider liking and accepting the solution. Thank you!
niraj_patel
Shopify Partner
2391 516 516

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
  .product-form__buy-buttons {
     margin-top: -3rem;
  }
</style>
Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

Shopify Partner || Helping eCommerce Stores
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution.
- For further discussion contact: Email ID- info@techlyser.com

PageFly-Amelia
Shopify Partner
626 165 238

Hello @Emiway 

This is Amelia at PageFly - Shopify Advanced Page Builder app.

 

You can try the following steps I have provided to help you solve the problem you are facing:

Step 1: Online Stores > Themes > Edit code

Step 2: Choose file base.css or theme.css

Step 3: Add code

 

 

@media screen and (max-width: 768px){
.product-form__buy-buttons {
   margin-top: -20px;
  }
}

 

 

 

Hoping my solution helps you solve your problem.

Best regards,

Amelia | PageFly

Please let me know if it works by giving it a Like or marking it as a solution!


➜ Optimize your Shopify store with PageFly Page Builder (Free plan available) 
➜ Weekly updated Shopify tutorials on YouTube 


All features are available from Free plan. Live Chat Support is available 24/7.

Emiway
Trailblazer
263 0 50

Not Working On Dekstop ..

PageFly-Amelia
Shopify Partner
626 165 238

This is an accepted solution.

You can use this code instead

.product-form__buy-buttons {
   margin-top: -20px;
  }

 

Please let me know if it works by giving it a Like or marking it as a solution!


➜ Optimize your Shopify store with PageFly Page Builder (Free plan available) 
➜ Weekly updated Shopify tutorials on YouTube 


All features are available from Free plan. Live Chat Support is available 24/7.