How To Add Post Titles To Read More Links In Blogger
Add interest to your "read more" links by including each post's title |
We can configure the text displayed for the Jump Link (which links to the post's item page) by editing the Blog Posts gadget in Design>Page Elements. However, I've also found it useful to add the title of the post beside the Jump-Link text to clarify the title of the post to which it links.
If you're reading this post on the home page, you'll see an example of this in action a few lines below.
This is a very easy customization and the modified Jump-Link will inherit any current style you've applied to this section. Here's how to add this featre in a single, simple step.
Go to Design>Edit HTML in your Blogger dashboard and check the Expand widget templates box. Using your browser's search function (usually CTRL or CMD + F), locate the following section of code:
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
</b:if>
Replace this with the following:
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"' expr:title='data:post.title'><data:post.jumpText/> <data:post.title /></a>
</div>
</b:if>
Preview the change you've just made - if all is well, you should now see the title of your post displayed beside the text you've chosen for your Jump-Link. You can then proceed to Save your template and enjoy this quick and easy tweak to your Blogger template.
I hope you find this post useful for customizing your own Blogger-based sites. Please feel free to leave your comments and opinions below.