Shopify themes, liquid, logos, and UX
Hi there,
I'm wondering how to jusify the text on my pages in the Dawn theme? I've seen similar questions posted in the forum for other themes, and have tried adding different codes but haven't had any luck.
My website is https://ferngroveflorals.myshopify.com
Solved! Go to the solution
This is an accepted solution.
Please Go to Online Store->Theme->Edit code then go to assets/base.css ->paste below code at the bottom of the file.
.rte>p {
margin-top: 0;
text-align: justify !important;
}
Thanks!
This is an accepted solution.
Please Go to Online Store->Theme->Edit code then go to assets/base.css ->paste below code at the bottom of the file.
.rte>p {
margin-top: 0;
text-align: justify !important;
}
Thanks!
Hii, @driedfloralart
Paste this code on top of the base.css file.
.rte>p {
text-align: justify !important;
}
Thank You.
Thank you 🙂
The text on the Pages in the About Menu ("About Us" , "Our Services") looks great, however the text in the product descriptions still appears left aligned. Can this text also be Justified?
I'm also wondering if there's also workaround where I can opt to keep some fields as they were before, namely the Home Page Rich Text Description.
Please Go to Online Store->Theme->Edit code then go to assets/base.css ->paste below code at the bottom of the file.
.product__info-container>div {
margin: 1.5rem 0;
text-align: justify !important;
}
Thanks!
Thanks - tried this and the text still displays as left aligned in product description. Should I delete the previous Justify code that you recommended?
No, Please share screenshot what do you want !
Thanks!
Essentially I'm looking to have paragraphs of text display as Justified. The below is a screenshot of the text as it appears in the product descriptions - Instead of left aligned I'd like it to display as Justified. I think the code(s) you've given me work really wel for the text on the pages but not for the text in each product description.
Please add the code in your css file
.product__description.rte div {
text-align: justify !important;
}
Hope it will help to solve your issue
Just noticed that the product images are now out of alignment, and show the edge of the next product image
Hey @driedfloralart
You can try this code
media screen and (max-width: 749px) {
.grid--peek .grid__item:first-of-type {
padding-left: 1.5rem;
padding-right: 1.5rem;
}
}
Thanks 🙂 Should I first remove the previous codes that I just added? I'm conscious that the more I code I add the more the website speed slows (sorry I don't really know anything about coding 😉
for mobile product page image
Please Go to Online Store->Theme->Edit code then go to assets/base.css ->paste below code at the bottom of the file.
@media screen and (max-width: 749px) {
.product-section .page-width { padding: 0 0rem !important;}
.product__info-wrapper {
padding-left: 0;
padding-bottom: 0;
padding: 0 1.5em!important;
}
}
Thanks - looks better!. Any solutions to the justifying the text in the product description?
product description already justified.
Oh thanks for that - now it is 🙂
RE; When viewed on desktop, the Rich Text on the home page looks out of alignment now (screenshot 1) - would ideally like it to be centered like it was originally whilst keeping the 'description' fields - ie paragraphs - justified (screenshot 2):
Screenshot 1:
Screenshot 2
Okay.
You just need to add this
.rich-text__text.rte p {
text-align: center !important;
}
Hi,
I've got the same issue with the contributor and I tried the code you provided. However, it didn't work for my pages. Please advice if there is any other solution to justify the text on my page in the Dawn Theme 2.0.
Thanks,
Hello,
is possible use this code only with some page?
Thank you for your kind attention,
Elena
Hi, I used your solution (thanks BTW) but it hasn't worked on the mobile version - only the desktop. What do I need to do to get it to justify on both platforms?
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024