How can I justify the text in my blog posts?

[Ben_Neorai_Gate]

Hey everyone,

I'm trying to justify the text in my blog post. I don't know how! Any help, please? 

This is my store:

https://asade.co.il/

This is the blog:

https://asade.co.il/blogs/%D7%94%D7%A4%D7%99%D7%A0%D7%94-%D7%94%D7%99%D7%A8%D7%95%D7%A7%D7%94

Thanks a lot guys!

[shreyhweb]

@Ben_Neorai_Gate 

i don't understand the requirement. please share me the screenshot. where to justify text on your blog post? 

[saurav9005]

Hi,

include this style in your css file.  OR in theme.liquid

<style>

.card__information .article-card__excerpt {

text-align:justify;

}

</style>

[Shay]

To clarify on @saurav9005  solution, you can actually post your CSS styling directly by using the Theme Editor (for all 2.0 themes). It looks like you are using the Sense theme, which supports this option.

• To add this CSS style, please open your theme in your admin under Online Store > Themes
• Customize the theme file
• Navigate to the Blog template
• Select Blog Posts from the left hand side
• Scroll to the custom CSS section in the settings for the section
• Paste the CSS, but remove the <style> and </style> tags

.card__information .article-card__excerpt {

text-align:justify;

}

•  Save changes and review

[Ben_Neorai_Gate]

Thanks Shay, yes this works great but only in the blog main page, it's now working on the blog post page, it says:

[Ben_Neorai_Gate]

I'm sorry I had a typo in my previous reply, and I can't edit it, I meant to write that it's not working on the blog post page. It's working only on the blog's main page.

I'm adding the screenshot again:

[Shay]

Hi @Ben_Neorai_Gate 

Try this one for the blog page itself:

article {
  text-align: justify;
}

This will affect the alignment of all the content below the header and navigation. You can edit the blog post content itself in the admin under Online Store > Blogs and justify the text in the content editor there.  

[Ben_Neorai_Gate]

Thank you! 😀

[Ben_Neorai_Gate]

Hi again, I thought this issue was solved, but I guess not. I don't know why but somehow the code is not affecting the entire blog post. You can check the screenshots, and please let me know if you have any idea how I can overcome this:

I really appreciate your help! 

[Melinda5]

I tried this and it works, however it also applies it to my title. Is there any css code I can use to make it not apply to the blog title? It makes it look funny. Thanks!! 

[Shay]

Hi @Ben_Neorai_Gate and @Melinda5 

Thank you for the screenshots showcasing the issues you are seeing! If the CSS styling is not working properly, please remove it from your theme and try using HTML styling on the page content instead. I recommend copying and pasting your blog content into a word document before making any changes, to ensure you have an easy recovery of the blog content.

You can use this free HTML editor to apply justified styling to the page content specifically: https://html5-editor.net.

You can copy and paste the entirety of your blog page into the text editor on the right side of the display, make any changes you want and then copy the HTML version on the left side back into your blog's page editor, replacing the text you had. You can also manually add the styling shown in my screenshot below if you are comfortable. 

Adding HTML content to your pages is very easy, you can view your HTML content by clicking the <> button above the text editor for your blogs and pages. 

When you activate the HTML editor, you will then see the same content, but in HTML format:

Replace the original content with the HTML justified content and save your changes. 

[Ben_Neorai_Gate]

Thanks again @Shay , you're super helpful.

I don't know what but still, this seems to work only on some blog posts, and not on all of them.

If you have any clue why - lol - please share with me heh! Otherwise, I guess I will have to deal with that as it is and that's it

[Ben_Neorai_Gate]

I appreciate your help! 🙂