Saturday, June 26, 2021

Tame Your Snippet

A cat. Poling its head through a big hole in a slice of bread.

Some bloggers (and I am one of them) are not too happy with the snippitization of their posts by the most recent crop of themes from Blogger.

Older themes (like this one) render the entire post on the home page or end at your jump break.

But the new responsive themes suck up the first few sentences, strip them of all formatting, hyperlinks, and paragraph breaks, and add a "read more" link that goes to the post's post page, automatically.

Text as rendered in a Blogger snippet without line breaks or formatting
 A snippet from the Notable theme

This unbroken block of type is not inviting and may discourage casual viewers from reading further. And look at where Blogger ended the snippet!

I can't solve this problem, but I have learned a few tricks to tame it a little bit.

You can still jump

The jump break still works, and has three benefits.

First of all, it lets you end your snippet early, at the place of your choosing.

Second, if you have many images in your post, using the jump break someplace after the first one will improve the performance of your blog.

Finally, if you set you blog feed to "jump break," the break will also truncate your feed. Your readers may appreciate this if they subscribe to your blog in a feed reader.

Truncating your feed also has the effect of luring subscribers and followers to your blog to finish the post. If you have designed things thoughtfully, those readers may be tempted to linger and explore further.

You can break up the flow

There's no way to get those paragraphs back, but you can indicate where they were in a stylish way.

The same snippet, but with some separation where the paragraphs were.
 Paragraphs!

That suggests to your readers that you are at least familiar with the idea of paragraphs.

I like to use the pilcrow ( ¶ ) for this, but you can swap in any symbol ( ❦ ) that is included in your typeface.

You must edit your post in HTML for this trick. In return, you get to make the pilcrow invisible to your blog, but not to your snippet.

Just copy this code and paste it at the ends of each of the first few paragraphs in HTML:

<span style="display: none;">&nbsp;¶&nbsp;</span>

"display:none" is a formatting command that hides the symbol from your blog.

But since the snippet strips away all your formatting, the symbol is no longer hidden there.

Paste the code at the exact end of your text. If the paragraph ends with a period, paste it right after that.

You can switch your blog theme

In 2010, Blogger introduced the "designer" themes, so called because they were made to work with the original Theme Designer (now "Customizer") introduced at the same time.

These themes are not responsive like the latest batch, but they are still robust and functional.

Further reading

3 comments:

  1. Thanks for this. It was my next point if investigation because of feed problems.

    ReplyDelete
  2. Line breaks in the post can also be reflected in the snippet, I believe. Think I tried this once. See here: https://bloggerbasics101.blogspot.com/2018/11/blogger-snippet-operator.html

    ReplyDelete
    Replies
    1. Just to be clear: I think Sam (and the link he provides) is saying that you can edit your theme so that the snippet will reproduce line returns. There's another option to reproduce links.

      If you are willing to do that, you can even replace the snippet with what you see on this blog: the full or partial blog post itself. At least for some blog themes that otherwise show snippets.

      Delete