Shopify themes, liquid, logos, and UX
Hi, I have featured products on each collection. However, I am trying to make the Product Title, Price and "View Full Details" link to be center aligned in that block itself (both horizontally and vertically).
How can I do that?
Thanks in advance!
Solved! Go to the solution
This is an accepted solution.
Hello There,
1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:
.product__info-container {
text-align: center;
}
.product__info-wrapper.grid__item.scroll-trigger.animate--slide-in {
margin-top: 13%;
}
Hi, @boltandchisel.
Kindly Share your store URL and password.
Hi, @boltandchisel.
You can try this code: it will be helpful to you
Go to the Online Store->Theme->Edit code->Assets->base.css>Add this code at the bottom.
.product__info-container {
text-align: center;
margin-top: 150px;
}
Result:
If I managed to help you then, don't forget to Like it and Mark it as Solution!
Hello There,
Please share your store URL and password.
So that I will check and let you know the exact solution here.
Hello there,
You want like this.
Hello There,
1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:
.product__info-container {
text-align: center;
}
Ooh nice, thanks!
However, the current solution only aligns it to center horizontally.
Is it possible to make it move to the center vertically?
This is an accepted solution.
Hello There,
1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > base.css and paste this at the bottom of the file:
.product__info-container {
text-align: center;
}
.product__info-wrapper.grid__item.scroll-trigger.animate--slide-in {
margin-top: 13%;
}
Works perfectly, thanks!
Thank you for your response. It's good to know that it's worked for you. Kindly feel free to get back to me if you need any further assistance.
If helpful then please Like and Accept Solution.
This is Richard from PageFly - Shopify Page Builder App, I’d like to suggest this idea:
Online Store ->Theme ->Edit code
Assets ->Base.css
.product__info-container {
display: flex;
flex-direction: column;
align-items: center;
}
Hope you find my answer helpful!
Best regards,
Richard | 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)
All features are available from Free plan. Live Chat Support is available 24/7.
We recently spoke with Zopi developers @Zopi about how dropshipping businesses can enha...
By JasonH Oct 23, 2024A big shout out to all of the merchants who participated in our AMA with 2H Media: Holi...
By Jacqui Oct 21, 2024We want to take a moment to celebrate the incredible ways you all engage with the Shopi...
By JasonH Oct 15, 2024