- This topic has 3 replies, 2 voices, and was last updated 4 years, 11 months ago by
.
Hello,
there is a problem with the word division in the blogpost preview on the home page. It breaks some of the words incorrectly and without a hyphen. (as you can see on the screenshots) How can we fix this?
Thank you in advance!
Michi
Hi Michi,
I hope you are well today and thank you for your question.
To resolve this you can add the excerpt for those posts in the Excerpt field of the posts as described in the below page.
https://www.wpbeginner.com/glossary/excerpt/
Best regards,
Shufflehound teamDear Shufflehound team,
we are already using the excerpt function. It is not about the description of the article but about the headlines.
Wordpress just divides the headlines randomly without a hyphen.
E.g. the word “headline” should be divided like
head-
line
if it doesn’t fit in one line. What happens on our page is random division, e.g.
headl
ine
without the hyphen. (As marked in the screenshots from my original post)
I would be very thankful if you could help out with this problem as well. How can we achieve correct word separation automatically in our blogpost headlines on the home page?Best regards,
Michi
You have to achieve this by developing custom CSS code as described in the below pages.
https://css-tricks.com/almanac/properties/h/hyphenate/
https://justmarkup.com/articles/2015-07-31-dealing-with-long-words-in-css/#final-solution
You can achieve it by adding the following CSS code in the Custom CSS code option of your theme on the below path.
Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code
#page-container .blog-list .post-title h2 { -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; word-wrap: break-word; overflow-wrap: break-word; -ms-word-break: break-all; word-break: break-all; word-break: break-word; }
