Solved

How to change the location of the Add to Wishlist on the product?

smsigroup
Explorer
77 0 21


Good day!


How to change the location of the Add to Wishlist on the product?

https://scholl-shoes.com.ph/


Thank you!

 

smsigroup_0-1717052491380.png

 

Accepted Solution (1)

BSSCommerce-HDL
Shopify Expert
733 242 254

This is an accepted solution.

Hi @smsigroup

You can try this code by following these steps:

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code
Step 2: Search file base.css, theme.css, styles.css or theme.scss.liquid

Step 3: Insert the below code at the bottom of the file -> Save 

.product-card__overlay.d-flex.justify-content-center.flex-column.product-card__overlaytop {
    right: unset !important;
}

Here is result: 

BSSTechVenture_0-1717053494166.png

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

If our suggestions are useful, please let us know by giving it a like, marking it as a solution, or donating here .


B2B Solution & Custom Pricing | Product Labels by BSS


Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency

View solution in original post

Replies 10 (10)

ProtoMan44
Shopify Partner
290 22 35

@smsigroup thanks to posting here, you need to add CSS:
but you header also distubed.

.product-card--style4 .product-card__overlaytop {
    right: unset;
    left: 0;
}

ProtoMan44_0-1717052817023.png

 

- A thirsty developer passionate about supporting the community. If you'd like to, you can buy me a

Coffee

.
- Your Shopify Solution Specialist Get a Quote at Dev444- Chat On Whatsapp
Crafting exceptional e-commerce experiences to elevate your online presence. Let's build your success story together!
smsigroup
Explorer
77 0 21

@ProtoMan44 

Thank you for the reply.

- Where do i paste the code for the Add to Wishlist?
- How do i fix the header?

ProtoMan44
Shopify Partner
290 22 35

@smsigroup if it work so please mark it as solved , thanks 😊

- A thirsty developer passionate about supporting the community. If you'd like to, you can buy me a

Coffee

.
- Your Shopify Solution Specialist Get a Quote at Dev444- Chat On Whatsapp
Crafting exceptional e-commerce experiences to elevate your online presence. Let's build your success story together!
smsigroup
Explorer
77 0 21

@ProtoMan44 

Where do i paste the code for the Add to Wishlist?
How do i fix the header?

 
 
ProtoMan44
Shopify Partner
290 22 35

@smsigroup put it ant css file or create a style tag and use it.

also add :

header {
    width: 100% !important;
}

 

ProtoMan44_0-1717053718516.png

 

- A thirsty developer passionate about supporting the community. If you'd like to, you can buy me a

Coffee

.
- Your Shopify Solution Specialist Get a Quote at Dev444- Chat On Whatsapp
Crafting exceptional e-commerce experiences to elevate your online presence. Let's build your success story together!
smsigroup
Explorer
77 0 21

@ProtoMan44 

Thank yoou!

BSSCommerce-HDL
Shopify Expert
733 242 254

This is an accepted solution.

Hi @smsigroup

You can try this code by following these steps:

Step 1: Go to Shopify Admin -> Online Store ->Theme -> Edit code
Step 2: Search file base.css, theme.css, styles.css or theme.scss.liquid

Step 3: Insert the below code at the bottom of the file -> Save 

.product-card__overlay.d-flex.justify-content-center.flex-column.product-card__overlaytop {
    right: unset !important;
}

Here is result: 

BSSTechVenture_0-1717053494166.png

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you 😍

If our suggestions are useful, please let us know by giving it a like, marking it as a solution, or donating here .


B2B Solution & Custom Pricing | Product Labels by BSS


Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency
smsigroup
Explorer
77 0 21

@BSSCommerce-HDL 

Thank you very much for help.

BSSCommerce-HDL
Shopify Expert
733 242 254

Hi @smsigroup,
We're happy to see that our suggestion helped you solve the issue.

Should you need any further information, please do not hesitate to contact us by tagging directly at Community post. We will check and let you know soon.

Thanks in advance 😍

If our suggestions are useful, please let us know by giving it a like, marking it as a solution, or donating here .


B2B Solution & Custom Pricing | Product Labels by BSS


Need help from our expert? Kindly share your request with us via community@bsscommerce.com


BSS Commerce - Full-service eCommerce Agency
ProtoMan44
Shopify Partner
290 22 35

@awaissandhu422 hen aa ki , per kendy pakistanio nu lanta q pehndia........

- A thirsty developer passionate about supporting the community. If you'd like to, you can buy me a

Coffee

.
- Your Shopify Solution Specialist Get a Quote at Dev444- Chat On Whatsapp
Crafting exceptional e-commerce experiences to elevate your online presence. Let's build your success story together!