How to Add a Line Break Before “Read More’ on a WordPress Archive


Here’s a really nice solution to a problem that looks more complex than it actually is.  If you are developing a WordPress theme, you may find that by default the ‘read more’ text appended to the end of each post snippet on your archive pages simply sits in line with the rest of the text. Your first instinct might be to go delving through entry.php and the associated templates. However, if you’re after a quick and easy solution, you can do everything through CSS. All you need to do is add the following line to your CSS file:


a.moretag {
 display: block;

All it does is change that specific class of ‘a tag’ to be shown as block, automatically pushing it onto the next line following the text. By using the .moretag class you will be restricting this to just the ‘Read More’ links, so all the other links on your website will be fine. To make it look a little neater, you could always add a bit of margin to the top too:


a.moretag {
 display: block;
 padding-top: 15px;

That’s it, all done!