Smart Excerpts in WordPress Themes

WordPress Themeing

"Smart Excerpts in WordPress Themes" is part 1 of 3 in the series WordPress Themeing

A series of posts covering some techniques I used or created while building out my new Matt2015 theme (a Twenty Fifteen child theme which you can download for free or a small contribution here). This series will give you useful code snippets, best practices, and include a series on monetizing freemium WordPress themes.

What are Archive Excerpts in WordPress?

WordPress, though no longer merely a blogging platform, has always had a strong focus on the users experience of blog posts. It’s emphasis on post categorization, tagging, and archive pages helped set it apart from every other CMS in its early days.

One central part of that user experience is how users can get an overview of your posts. If you write 1,500+ word posts with several images (like most of my posts are), then having all of that text appear on your Archive pages really doesn’t help your users have an easy overview of your posts.

For that reason, many want instead to have each post on the Archive page (whether it’s the Post Archive, Tag archive, or Category Archive) show only an excerpt of the post with the title and perhaps a featured image.

Generally speaking, the standard way excerpts show is to create them manually in the Post Edit screen when you write your post. The problem is, many users don’t even know they have that option. By default, the “Excerpt” metabox is hidden for all users. You have to know to click on “Screen Options” and enable the Excerpt box there. Then, authors have to create their excerpts manually, and there is no limit to how long or short they might be.

With all of that uncertainty, many premium theme developers don’t want to assume that users will use the Excerpt metabox. Or even if they did, the variety of the length of the excerpt can cause trouble if your theme has a more uniform look to the Archive page. For this reason, most premium themes will dedicate a section of their options page to handle excerpt settings. But how they output them onto the page varies a lot.

I’ve also seen themes use the settings in the “Settings > Reading” page to handle this. But that setting is intended for RSS feeds, not archive pages. Further, it doesn’t do anything about excerpt length.

With all of that uncertainty, it’s no wonder that excerpts are often overlooked or underused.

Introducing Smart Excerpts in WordPress Themes

archive-layouts

One of the first features I tackled when creating Matt2015 was creating settings for the Archive pages. I was surprised that Twenty Fifteen doesn’t come with any settings for excerpts or excerpt length at all. My solution in the end, I call “Smart Excerpts” simply because it is a robust way to handle excerpts regardless of what a post author writes.

If you’re a Theme Developer, here’s the fully-documented Gist of my Smart Excerpts function.

Or here’s the vanilla code version:

<?php
$yoastdesc = get_post_meta(get_the_ID(), '_yoast_wpseo_metadesc', true);
$excerptlength = get_theme_mod('excerpt_length', 25);
$excerpt = get_the_excerpt();
$content = get_the_content();
$screenreader = '<a href="' . get_permalink() . '"><span class="screen-reader-text">' . get_the_title( ) . '</span>Read More &hellip;</a>';
					
if(!empty($yoastdesc)) {
	$trimyoast = wp_trim_words($yoastdesc, $excerptlength, $screenreader);
	echo $trimyoast;
	} elseif(has_excerpt() == true) {
		$trimexcerpt = wp_trim_words( $excerpt , $excerptlength, $screenreader  );
		echo strip_shortcodes($trimexcerpt); 
	} else {
		$trimmed_content = wp_trim_words( $content, $excerptlength, $screenreader );
		echo strip_shortcodes($trimmed_content);						
	}
?>

Here’s the major things I wanted to accomplish with Smart Excerpts in Matt2015:

  1. Settings should be in the Customizer so users can see the changes immediately.
  2. The best excerpt should appear according to the post authors intent.
  3. There shouldn’t be any weird code or shortcodes or stray media appearing in the excerpt.
  4. If the post author doesn’t do anything at all about excerpts, something should still appear and look consistent with other excerpts on the Archive page.

Another reason why excerpts are really important in Matt2015 is because I also added three different Archive layouts: Full Text, Excerpt, and what I call “Fancy Rollover” which also employs the excerpt feature.

Customizer Settings

customizer

I’ll have a post later in this series dedicated to building out settings in the Customizer, so I won’t go into detail about the code for this. Instead, I want to highlight why putting excerpt settings in the Customizer is best (IMHO).

First off, from various WordCamps and articles, various folks at Automattic (the folks that create and lead all development of WordPress Core) have communicated that the Customizer is to be the primary way Themes are customized. This means that using the Customizer really should be considered “best practice.”

Some theme authors might immediately object and say “There’s no way I can fit all my options into the Customizer!” I think Automattic’s question (and mine!) to them would be: Why do you want to cram so many options into your theme? Another really important mantra of WordPress development is “Decisions not Options.” Basically, you need to consider that every option you provide in your theme requires your users to make a choice. Every choice they make bogs down their overall experience and keeps them from launching. If nothing else, there is also now support for “Panels” in the Customizer which greatly expands how much you can fit into the Customizer comfortably.

With all that in mind, I wanted to make sure that Matt2015 put the excerpt options in the Customizer and made the choice as pain-free as possible. One of the added benefits of the Customizer that makes the choice a lot less painful is being able to see the change live. I don’t believe that every decision the user makes is a burden. Instead, if you empower the user with choices they didn’t expect and surprise them with ease of use, then the decision becomes a pleasure rather than a burden.

I feel like that’s what the Smart Excerpts do in Matt2015. Perhaps you don’t think about your excerpts much. But once you’re in the Customizer and you see how you can change the look and feel of the Archive Styles combined with Smart Excerpts and excerpt length you feel in control of your site.

So while part of the appeal of Matt2015 is to add more settings to Twenty Fifteen for added flexibility I also kept the spirit of “Decisions not options” in mind. In this case the Archive Styles, Smart Excerpts, and Excerpt length are just two settings. But combined they allow for great variety in your Archive pages.

Choosing the Best Excerpt

This is the real “meat and potatoes” of this feature. If you choose to use excerpts for your Archives, I wanted them to be consistent regardless of whether you created your own excerpts manually or not. In the end, this is the logic this feature implements:

  1. If the post author created a meta description using Yoast’s SEO for WordPress for this post, then use that as the excerpt (read on for why I prioritize this as primary).
  2. If a meta description isn’t available, look for the manually created excerpt and use that instead.
  3. If neither of those is available, take the first lines of the content of the post, stip out any shortcodes or media, and truncate it according to the excerpt length set in the Customizer Settings.

In the end, this means that every excerpts post in the archive pages will have a uniform length and general appearance.

YoastSEOYou’ll notice that I set the Yoast Meta Description as the primary excerpt. I did this for two main reasons: (1) I can’t imagine NOT using that plugin on a site; and (2) If I’m going to take the time to craft the meta description anyway, why double that work by creating a separate excerpt?

I’m certain there will be SEO experts who feel like the meta description should be different than the excerpt and want to have the flexibility to use both interchangably. I considered creating setting for the prioritization of Smart Excerpts, but in the end they currently require no settings at all and work perfectly as expected.

But in the end, I know that even I sometimes don’t take the time to create a meta description, so I had to build in some fall backs. And naturally some will not be using Yoast’s SEO for WordPress (I can’t image why not, but it happens!). That’s why there are the two additional fallbacks.

Again, see the Gist link above to see the whole function with inline documentation.

Making (Mostly) Everyone Happy

Whether you’re building out a plugin or a theme for WordPress, you constantly have to balance who you want to make the most happy. Will it be the visitors to the site? The end-user who builds their site from your theme? Or are you just looking for kudos from other WordPress developer!?

In this case, I’m pretty happy with the balance here. Smart Excerpts are built into the theme so the end user doesn’t have to do anything at all except play with the layout settings. The end user sees a consistent excerpt free of random code. And developers get to fork and hack this little function to their hearts delight.

But most of all, readers like you can grab Matt2015 and build something awesome with it right away. Go download it here, or check out the full demo site here. Thanks!

Series NavigationCreating User-Friendly Styled Content in WordPress >>

CC BY-NC-SA 4.0Smart Excerpts in WordPress Themes by Matt Cromwell is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.

There are 4 comments Join the conversation

Comments are closed.