Re: Product cards alignment

Solved

Product cards alignment

xeliporit12
Excursionist
12 0 2
As you can see, the price of each product is not aligned. I want it positioned at the bottom. How can I achieve this?
NebulaKing742_0-1725098756159.png

 

Accepted Solutions (4)
BSSCommerce-B2B
Shopify Partner
1953 561 561

This is an accepted solution.

@xeliporit12 ,

Step 1. Go to Admin -> Online store -> Theme > Edit code

Step 2. Find the file theme.liquid.

Step 3. Add this code above </body>

<style>
 .card__content .card__information { 
     display: flex; 
     flex-direction: column; 
     justify-content: end; 
 }
</style>

B2B Wholesale Solution: Streamline your B2B operation with advanced features like wholesale registration forms, custom pricing.


B2B Portal, Quote, Net 30: Speed up purchasing and streamline your quotation process with advanced features like quick order, request for quote.


B2B Lock Password Protect: Easily control access to pages, products, and pricing with robust features.


BSS Commerce - Full-service eCommerce Agency I Use Shopify for 1$ in the first month now

View solution in original post

BSSCommerce-B2B
Shopify Partner
1953 561 561

This is an accepted solution.

You can add this code after 

BSSCommerceB2B_0-1725100101592.png

.card__content .card__information { 
     display: flex; 
     flex-direction: column; 
     justify-content: end; 
 }
 .card .card__media img {
    object-fit: contain;
 } 
 .card__content {
   flex-grow: unset;
 }
 .card__inner {
   flex-grow: 1;
 }

B2B Wholesale Solution: Streamline your B2B operation with advanced features like wholesale registration forms, custom pricing.


B2B Portal, Quote, Net 30: Speed up purchasing and streamline your quotation process with advanced features like quick order, request for quote.


B2B Lock Password Protect: Easily control access to pages, products, and pricing with robust features.


BSS Commerce - Full-service eCommerce Agency I Use Shopify for 1$ in the first month now

View solution in original post

BSSCommerce-B2B
Shopify Partner
1953 561 561

This is an accepted solution.

Of course, you can add more this code

.card__inner {
  background: white!important;
}

Hope it helps 😍

B2B Wholesale Solution: Streamline your B2B operation with advanced features like wholesale registration forms, custom pricing.


B2B Portal, Quote, Net 30: Speed up purchasing and streamline your quotation process with advanced features like quick order, request for quote.


B2B Lock Password Protect: Easily control access to pages, products, and pricing with robust features.


BSS Commerce - Full-service eCommerce Agency I Use Shopify for 1$ in the first month now

View solution in original post

BSSCommerce-B2B
Shopify Partner
1953 561 561

This is an accepted solution.

@xeliporit12, use this code

.footer__copyright {
  display: none!important
}

B2B Wholesale Solution: Streamline your B2B operation with advanced features like wholesale registration forms, custom pricing.


B2B Portal, Quote, Net 30: Speed up purchasing and streamline your quotation process with advanced features like quick order, request for quote.


B2B Lock Password Protect: Easily control access to pages, products, and pricing with robust features.


BSS Commerce - Full-service eCommerce Agency I Use Shopify for 1$ in the first month now

View solution in original post

Replies 10 (10)

BSSCommerce-B2B
Shopify Partner
1953 561 561

@xeliporit12 , Can you kindly share you store url and password?

B2B Wholesale Solution: Streamline your B2B operation with advanced features like wholesale registration forms, custom pricing.


B2B Portal, Quote, Net 30: Speed up purchasing and streamline your quotation process with advanced features like quick order, request for quote.


B2B Lock Password Protect: Easily control access to pages, products, and pricing with robust features.


BSS Commerce - Full-service eCommerce Agency I Use Shopify for 1$ in the first month now

xeliporit12
Excursionist
12 0 2

@BSSCommerce-B2B, i've sent it in private chat 🙂

BSSCommerce-B2B
Shopify Partner
1953 561 561

This is an accepted solution.

@xeliporit12 ,

Step 1. Go to Admin -> Online store -> Theme > Edit code

Step 2. Find the file theme.liquid.

Step 3. Add this code above </body>

<style>
 .card__content .card__information { 
     display: flex; 
     flex-direction: column; 
     justify-content: end; 
 }
</style>

B2B Wholesale Solution: Streamline your B2B operation with advanced features like wholesale registration forms, custom pricing.


B2B Portal, Quote, Net 30: Speed up purchasing and streamline your quotation process with advanced features like quick order, request for quote.


B2B Lock Password Protect: Easily control access to pages, products, and pricing with robust features.


BSS Commerce - Full-service eCommerce Agency I Use Shopify for 1$ in the first month now

xeliporit12
Excursionist
12 0 2

It worked! Thank you so much. Can you help me center the image please?

xeliporit12_0-1725099983022.png

 

BSSCommerce-B2B
Shopify Partner
1953 561 561

This is an accepted solution.

You can add this code after 

BSSCommerceB2B_0-1725100101592.png

.card__content .card__information { 
     display: flex; 
     flex-direction: column; 
     justify-content: end; 
 }
 .card .card__media img {
    object-fit: contain;
 } 
 .card__content {
   flex-grow: unset;
 }
 .card__inner {
   flex-grow: 1;
 }

B2B Wholesale Solution: Streamline your B2B operation with advanced features like wholesale registration forms, custom pricing.


B2B Portal, Quote, Net 30: Speed up purchasing and streamline your quotation process with advanced features like quick order, request for quote.


B2B Lock Password Protect: Easily control access to pages, products, and pricing with robust features.


BSS Commerce - Full-service eCommerce Agency I Use Shopify for 1$ in the first month now

xeliporit12
Excursionist
12 0 2

Work like a charm, but I would like the white background if possible please 🙂

BSSCommerce-B2B
Shopify Partner
1953 561 561

This is an accepted solution.

Of course, you can add more this code

.card__inner {
  background: white!important;
}

Hope it helps 😍

B2B Wholesale Solution: Streamline your B2B operation with advanced features like wholesale registration forms, custom pricing.


B2B Portal, Quote, Net 30: Speed up purchasing and streamline your quotation process with advanced features like quick order, request for quote.


B2B Lock Password Protect: Easily control access to pages, products, and pricing with robust features.


BSS Commerce - Full-service eCommerce Agency I Use Shopify for 1$ in the first month now

xeliporit12
Excursionist
12 0 2

You are the best man. I really appreciate that 😊 One last question how can i remove this part from my page ?

xeliporit12_2-1725100924078.png

 

 

BSSCommerce-B2B
Shopify Partner
1953 561 561

This is an accepted solution.

@xeliporit12, use this code

.footer__copyright {
  display: none!important
}

B2B Wholesale Solution: Streamline your B2B operation with advanced features like wholesale registration forms, custom pricing.


B2B Portal, Quote, Net 30: Speed up purchasing and streamline your quotation process with advanced features like quick order, request for quote.


B2B Lock Password Protect: Easily control access to pages, products, and pricing with robust features.


BSS Commerce - Full-service eCommerce Agency I Use Shopify for 1$ in the first month now

xeliporit12
Excursionist
12 0 2

Thank you so much man! You've made it look amazing. I really appreciate your hard work 😊