How to Move The Add to Wishlist Button to the Left?

Solved

How to Move The Add to Wishlist Button to the Left?

atmosphaera
Shopify Partner
36 0 8

Hello friends, I would like to know how to move the add to wishlist button to be aligned to the left like everything else on this page. See below. 

 

Add2WishlistButton_CenterIt.png

 

URL: www.atmosphaera.co

Theme: Taste V2

 

 

Theme: Taste V.14
URL: https://www.atmosphaera.co/?_ab=0&_fd=0&_sc=1
Accepted Solution (1)

BSS-TekLabs
Shopify Expert
391 123 131

This is an accepted solution.

- Here is the solution for you
- Please follow these steps:

step.png


- Then find the base.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

.Vtl-WishlistButton__AddToWishlist {
 float: left !important;
}


- Please add the above code to the last line of the theme.css file.
- Here is the result you will achieve:

BSSTekLabs_0-1719063263325.png

 

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

If our suggestions are useful, please let us know by giving it a like or marking it as a solution .
For give Gift to customers and Upsell in Cart, check out Salepify: Free Gifts with purchase

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 3 (3)

BSSCommerce-TA
Shopify Expert
123 24 24

Hi @atmosphaera, you can move the Add to Wishlist Button to the Left by following these steps: 

1. Navigate to Online store => Themes => Edit code

1.png

2. Find base.css file on Assets folder and add this code to the end of the file : 

 

.Vtl-WishlistButton__AddToWishlist {
   justify-content: flex-start !important;
}

 

In case you only want button on the left in desktop mode, add this code snippet:

 

@media screen and (min-width: 750px) {
   .Vtl-WishlistButton__AddToWishlist {
       justify-content: flex-start !important;
   }
}

 

And here is the result : 

BSSCommerceTA_0-1719063120497.png

Hope this can help you.

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

SIMICART: Mobile App Builder |Ironwork Theme - Coming Soon | 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

BSS-TekLabs
Shopify Expert
391 123 131

This is an accepted solution.

- Here is the solution for you
- Please follow these steps:

step.png


- Then find the base.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

.Vtl-WishlistButton__AddToWishlist {
 float: left !important;
}


- Please add the above code to the last line of the theme.css file.
- Here is the result you will achieve:

BSSTekLabs_0-1719063263325.png

 

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

If our suggestions are useful, please let us know by giving it a like or marking it as a solution .
For give Gift to customers and Upsell in Cart, check out Salepify: Free Gifts with purchase

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


BSS Commerce - Full-service eCommerce Agency
atmosphaera
Shopify Partner
36 0 8

thank you so much for taking the time to help me!

Theme: Taste V.14
URL: https://www.atmosphaera.co/?_ab=0&_fd=0&_sc=1