BAC Software Consulting Blog

How To Improve WordPress Excerpt Without a Plugin

How To Improve WordPress Excerpt Without a Plugin

In this tutorial I will show you how to enhance WordPress Excerpt by using simple functions and without the need of a plugin. WordPress Excerpt is an optional summary of your content.

The relationship between the Manual Excerpt, Automatic Excerpt, and Teaser is this: When a post has no manual excerpt and the post template uses the the_excerpt() tag, WordPress automatically generates an excerpt by selecting the first 55 words of the post followed by the unlinked ellipsis “[…]”. When the post template uses the the_content() tag, WordPress will look for the More tag and create a teaser from the content that precedes the More tag.

In WordPress, the_excerpt() template tag displays the excerpt of the current post with an un-linked ´[…]´ at the end. If you do not provide a manually written excerpt to a post, it will display an automatic excerpt which by default refers to the first 55 words of the post´s content. Also in the latter case, HTML tags and graphics are stripped from the excerpt´s content.

What about a Plugin? Yes, there are plugins that customize WordPress auto-generated excerpt. But haven´t you read my previous post about the disadvantages of going crazy adding plugins to your theme? In addition, aren´t you eager to learn and do things yourself?

How To: Change the Excerpt Length

From WordPress Version 2.8.0 and above you can change the excerpt length from the default 55 words. Open the functions.php file located in your current theme´s folder and add (copy and paste) the following code.

Code1 (Valid for WordPress Version >= 2.8.0)

<?php 
function custom_excerpt_length( $length ) {     
    return 35; //Change this number to any integer you like.
}
add_filter( 'excerpt_length', 'custom_excerpt_length' );
?>

How To: Change the Excerpt More String

By default, the excerpt more string at the end is set to ´[…]´. To change the default excerpt more string, add the following code to your theme´s functions.php file:

Code2 (Valid for WordPress Version >= 2.9.0)

<?php 
function custom_excerpt_more( $more ) {     
return ' ...'; // nicer without the brackets, but not very useful. 
}
add_filter( 'excerpt_more', 'custom_excerpt_more' );
?> 

Code2a (Valid for WordPress Version <= 2.8.x)

<?php 
function custom_excerpt_more( $excerpt ) {
    return str_replace( '[...]', '...', $excerpt );
}
add_filter( 'wp_trim_excerpt', 'custom_excerpt_more' );
?>

How To: Replace the Excerpt More String with a Link

By default WordPress outputs an un-linked “[…]” at the end of each excerpt, which is not useful for Accessibility and SEO purposes. Open your theme´s functions.php file, and add the following code.

Code3a (Valid for WordPress Version >= 0.7.1)

<?php 
function custom_excerpt($text)   
{   
    return str_replace('[...]', '<a href="'. get_permalink($post->ID) . '">' . '&raquo; Continue Reading.' . '</a>', $text); 
}   
add_filter('the_excerpt', 'custom_excerpt');  
?>

If you want to add the post title to your link in the excerpt, then add the following code to your theme´s functions.php file.

Code3b (Valid for WordPress Version >= 0.7.1)

<?php 
function custom_excerpt($text)   
{   
  return str_replace('[...]', ' &#8230;<br /><a href="'. get_permalink($post->ID) . '">' . 'Continue Reading: '. get_the_title() . '</a>', $text);  
}   
add_filter('the_excerpt', 'custom_excerpt');  
?>

If you are using WordPress Version 2.9 and above you can use the following code.

Code3c (Valid for WordPress Version >= 2.9)

<?php
function custom_excerpt_more($more)   
{  
   return ' <a href="'. get_permalink($post->ID) . '">' . '&raquo; Continue Reading.' . '</a>';
}   
add_filter('excerpt_more', 'custom_excerpt_more');  
?>

If you want to add the post title to your link in the excerpt, add the following code to your theme´s functions.php file.

Code3d (Valid for WordPress Version >= 2.9)

<?php
function custom_excerpt_more($more)   
{  
  return  ' &hellip;<br />' . '<a href="'. get_permalink($post->ID) . '">' . 'Continue Reading: '. get_the_title() . '</a>'; 
}   
add_filter('excerpt_more', 'custom_excerpt_more');  
?>

WARNING: You can ONLY add to your theme´s functions.phpCode3a, or Code3b, or Code3c, or Code3d, but not all or any combination.

How To: Change Excerpt Length Depending on the Category

If you want to modify the excerpt length based on the category, then add the following code to your theme´s functions.php file. Don´t forget to change the category ID to yours.

Code4a (Valid for WordPress Version >= 2.8.0)

<?php
function custom_excerpt_length($length) {
    if (in_category(4)) {  //For posts belonging to category ID 4
        return 65;
    } else {
        return 40; //for all others, return 40 words.
    }
}
add_filter('excerpt_length', 'custom_excerpt_length');
?>

If you want to modify the excerpt length based on multiple categories, then add the following code to your theme´s functions.php file instead. Don´t forget to change the category IDs to yours.

Code4b (Valid for WordPress Version >= 2.8.0)

<?php
function custom_excerpt_length($length) {
    if(in_category(array(4,40))) {  //For posts belonging to category IDs 4 and 40
        return 65; //return 65 words for the excerpt
    } else {
        return 40; //for all others, return 40 words.
    }
}
add_filter('excerpt_length', 'custom_excerpt_length');
?>

WARNING: You can ONLY add to your theme´s functions.phpCode1, or Code4a, or Code4b, but not all or any combination.

If there is a More tag in your post, then the excerpt word count stops at either where the More tag is placed, without the excerpt trailing characters, or your defined excerpt length, whichever comes first. Therefore make sure that you place the More tag outside your specified excerpt word count.

If you don´t know how to find the Category ID, then read this tutorial.

Troubleshooting

If you are having problems with any of the code blocks above, please note the following:

  1. The filters only work on excerpts that are automatically generated by WordPress. The filters do not affect the manually typed excerpts.
  2. The filters only work on excerpts that use the_excerpt() template tag.
  3. Check your plugins. Some plugins contain code that overrides the excerpt.

How To: Replace the_content() With the_excerpt

Never show full posts in the main page. In your theme, If you have the_content() template tag, make sure to use the More tag in your post. They work together, otherwise your posts will be shown in full in the main page which can dramatically slow page loading speed. For example let´s say you display 8 posts in your main page, and by showing every post in full, then it will take long time for the page to load and for the user to scroll. One way to reduce page load time, is to replace the_content() template tag with the_excerpt() template tag.

To do that, open the index.php file located in your theme´s folder and replace the the_content() with the_excerpt(). Also you could do the same for archive.php and search.php files. (DO NOT TOUCH page.php or single.php files.)

Code5

//The '...' can be anything inside. 
//Search and Replace the_content() template tag
<?php the_content('...'); ?>
 
//With the_excerpt() template tag
<?php the_excerpt('...'); ?>

NOTE: the_excerpt() template tag has no parameters. However, there is no harm from keeping them in case you wanted to revert back and use the_content() again. If you get any errors, then replace the_content(‘…’); with the_excerpt();.

To EMPHASIZE: the_content() template tag is used in conjunction with the More tag. Make sure to place the More tag somewhere at the beginning of the post. Otherwise, the whole content of the post will be displayed.

How To: Manually Add a Post Excerpt

To manually add an excerpt to a post, you need to login to your WordPress dashboard, find your post, and add the excerpt as shown in the picture below:

The Advantage of a Manual excerpt is that they are often used by search engines to describe search results. In this CASE, good excerpts increase and improve Website traffic. Also, WordPress preserves HTML formatting in manual excerpts which is not the case for the automatically generated excerpt. Another major drawback of the automatic excerpt is that the beginning of a post is usually an introduction and not a summary.

When using the manually typed excerpt feature, the ´[…]´ is not automatically added nor a link to a page containing the full post. However, to bypass this shortcoming you need to replace the_excerpt(); in your theme´s index.php (and also in your theme´s archive.php and search.php files) with the following code below. The beauty about this code is that it takes care of both scenarios: the manually added and the automatically generated excerpts; which means that you can have both manual excerpts and auto-generated excerpts for your posts with no issues.

Code6

//In your theme files: Search and Replace the_excerpt() template tag
<?php the_excerpt(); ?>
 
//With the following code:
<?php 
//Add Links to Manual and Automatic excerpts
if ( $post->post_excerpt ){ //If manual excerpt is added
    //Add a link at the end of the manual excerpt 
    the_excerpt();?>
    <p><a href="<?php the_permalink(); ?> "> &raquo; Continue Reading: <?php the_title() ?></a></p>
<?php }
else {//else, it is an automatic excerpt, then let the filter handle it.
     the_excerpt();
     }
?>       

How To: Only Display a Post´s Excerpt if it Exists

If you only want WordPress to display a manually added excerpt and you don´t want WordPress to automatically generate any excerpts for you, then in your theme files (index.php, archive.php and search.php), then follow the instructions in the code below:

Code7

//Replace the_excerpt() template tag 
<?php the_excerpt(); ?> 
 
//With this:
<?php if ( $post->post_excerpt ) the_excerpt(); ?>

General Warning

When you add several PHP code blocks in your theme´s funtions.php file, make sure that you don´t leave any whitespace (spaces, newline) before the opening PHP tag or after the closing PHP tag. Like so (the correct way):

<?php 
//Some Code here beetween the opening PHP tag (above) 
//and the closing PHP tag (below)...
?>
<?php 
//Some other Code here ...
?>

In the above code, if you leave any whitespace or a newline between lines 4 and 5, you will get the following error: Warning: Cannot modify header information – headers already sent by (… , in your login screen and after you login to your WordPress dashboard.

General Advice

Keep WordPress Up to Date. If you can, you should always have the latest version of WordPress. Upgrading to the latest version is necessary because upgrades usually include performance and security enhancements and also new features. Go and download the latest version.

Excerpt Definition Revisited

The manually typed excerpt is a short description of your post typed in the Excerpt field in your Administration Panels. The excerpt is used to describe your post in RSS feeds and is typically used in displaying posts summary in the main page, in search results, in archives, and category views. You must use the the_excerpt() template tag to display the contents of this field. If you do not type any information in the post´s Excerpt field, and you use the_excerpt() in your theme files, then WordPress will automatically generate the Excerpt of your post.

The excerpt should not be confused with the teaser. When typing a long post you can insert the <!--more--> Quicktag after a few sentences to act as a cut-off point. When the post is displayed, the teaser, followed by a hyperlink (such as Read the rest of this entry…), is displayed. Your visitor can then click on that link to see the full content of your post. the_content() template tag should be used to display the teaser.

How To preserve HTML Tags in WordPress Excerpt Without a Plugin

How To preserve HTML Tags in WordPress Excerpt Without a Plugin

WordPress Excerpt is a summary of your content. In this tutorial I will show you how to preserve HTML formatting for the automatically generated excerpts without the need of a plugin, and also choose what HTML tags to keep. For a manually typed excerpt, WordPress will keep all HTML formatting you have included in the excerpt. Also in this tutorial, I will show you a different way to change the excerpt_length and the excerpt_more filters.

This tutorial is the second part of this post: How To Improve WordPress Excerpt Without a Plugin.

The relationship between the Manual Excerpt and Automatic Excerpt is this: When a post has no manually typed excerpt and the post template uses the the_excerpt() tag, WordPress will automatically generate an excerpt by selecting the first 55 words of the post followed by the unlinked ellipsis “[…]”.

What about a Plugin? Yes, there are plugins that customize WordPress automatically generated excerpt. But haven´t you read my previous post about the disadvantages of unnecessarily adding plugins to your theme?

Manually Typed Post Excerpt

For a manually typed post excerpt, WordPress will keep all HTML tags you included in your excerpt. If you don´t know where and how to add a manual excerpt, read the section “How To: Manually Add a Post Excerpt” in this previous tutorial.

Automatically Generated Post Excerpt

In WordPress, if you do not provide a manually written excerpt to a post, WordPress will display an automatically generated excerpt. The problem with that, is WordPress will, by default, display the excerpt with the first 55 words of the post´s content, an un-linked ´[…]´ string at the end, and with all HTML tags stripped from the excerpt´s content. This makes the excerpt one long text paragraph without any line breaks.

In this tutorial, I will show you, how to overcome these shortcomings, and how to preserve all (or some) of the HTML tags in your auto-generated excerpt. All these changes are done in your theme´s functions.php file. Here is How:

Preserve HTML Tags in the Excerpt and Other Settings

Open the functions.php file located in your current theme folder and add (copy and paste) the following code. You can edit lines 22, 25, and 28 accordingly:

MAIN_CODE (Tested on WordPress Version 3.1.3 but it works on any Version >= 1.5.0)

Note: To scroll within the code: You can also click on the code window and use your keyboard´s arrow keys.

<?php
function custom_wp_trim_excerpt($text) {
$raw_excerpt = $text;
if ( '' == $text ) {
    //Retrieve the post content. 
    $text = get_the_content('');
 
    //Delete all shortcode tags from the content. 
    $text = strip_shortcodes( $text );
 
    $text = apply_filters('the_content', $text);
    $text = str_replace(']]>', ']]&gt;', $text);
     
    $allowed_tags = ''; /*** MODIFY THIS. Add the allowed HTML tags separated by a comma.***/
    $text = strip_tags($text, $allowed_tags);
     
    $excerpt_word_count = 55; /*** MODIFY THIS. change the excerpt word count to any integer you like.***/
    $excerpt_length = apply_filters('excerpt_length', $excerpt_word_count); 
     
    $excerpt_end = '[...]'; /*** MODIFY THIS. change the excerpt endind to something else.***/
    $excerpt_more = apply_filters('excerpt_more', ' ' . $excerpt_end);
     
    $words = preg_split("/[\n\r\t ]+/", $text, $excerpt_length + 1, PREG_SPLIT_NO_EMPTY);
    if ( count($words) > $excerpt_length ) {
        array_pop($words);
        $text = implode(' ', $words);
        $text = $text . $excerpt_more;
    } else {
        $text = implode(' ', $words);
    }
}
return apply_filters('wp_trim_excerpt', $text, $raw_excerpt);
}
remove_filter('get_the_excerpt', 'wp_trim_excerpt');
add_filter('get_the_excerpt', 'custom_wp_trim_excerpt');
?>

Watch out with the <!–more–> tag, if you are using the <!–more–> tag in your content, make sure that it resides outside the excerpt; otherwise your excerpt will end without an ending link. If there is a More tag in your post, then the excerpt word count stops at either where the More tag is placed, without the excerpt trailing characters, or your defined excerpt length, whichever comes first.

You can replace lines 42 and 43 of the MAIN_CODE with the following: With the same results.

<?php 
//Replace line 42 and 43 of the MAIN_CODE with a hook with higher priority.
add_filter('get_the_excerpt', 'custom_wp_trim_excerpt', 5);
?>

How To: Preserve HTML Formatting

Why are we doing this? I am taking a different approach than in my previous tutorial, because there is no filter available for the HTML tags like the excerpt_length and excerpt_more filters. Therefore we need to rewrite the wp_trim_excerpt() function and use our function instead of the WordPress default function.

If you want to keep all or some chosen HTML tags. For example if you like to keep the p, a, em, strong, img, tags then find line 22 of the “MAIN_CODE” and replace it with this:

<?php 
//Replace line 22 of the MAIN_CODE with this:
//Separate tags by commas. Add or Remove tags as you wish. 
$allowed_tags = '<p>,<a>,<em>,<strong>,<img>'; 
?>
  1. WordPress counts the content of the HTML tags as part of the excerpt total word count. Therefore you need to be careful what tags you need to add. For example the title attribute in an image or link are counted as part of the excerpt length.
  2. Add the tags that you want to allow separated by comma. Be careful what tags you add because if you have the “continue reading” link and you stop in the middle of a non-closed tag, the link will take its formatting. For instance, if the excerpt stopped somewhere in an open acronym, the link will be formatted like an acronym, and if the excerpt stopped in an open header, the link will take the header´s formatting. And most importantly, if you stop in the middle of a non-closed tag (like an anchor tag) you might be getting XML validation errors/warnings that cause your RSS feed to not work properly. Therefore, test your blog and your RSS feed.

How To: Change the Excerpt Length

NOTE: The excerpt_length filter that I talked about in my previous tutorial, specifically Code1 work fine with the “MAIN_CODE” above. The filter overrides what is assigned in the “MAIN_CODE”. However; why add an unnecessary function that can be done in the “MAIN_CODE”.

If you like to change the automatically generated excerpt length from the default 55 words, find line 25 in the “MAIN_CODE” and replace it with this:

<?php 
//Replace line 25 of the MAIN_CODE with this:   
$excerpt_word_count = 65; /* Choose any number you like. */
?>

How To: Change Excerpt Length Depending on the Category

If you want to modify the excerpt length based on one category, then find line 25 in the “MAIN_CODE” and replace it with this:
Don´t forget to change the category ID to yours.

<?php
//Replace line 25 of the MAIN_CODE with this:
if (in_category(4)) {  //For posts belonging to category ID 4
   $excerpt_word_count = 65; //return 65-word length excerpt.
} else {
    $excerpt_word_count = 40; //for all others, return 45 words.
}
?>

If you want to modify the excerpt length based on multiple categories, then find line 25 in the “MAIN_CODE” and replace it with this:

Don´t forget to change the category IDs to yours.

<?php
//Replace line 25 of the MAIN_CODE with this:
if(in_category(array(4,40))) {  //For posts belonging to category IDs 4 and 40
    $excerpt_word_count = 65; //return 65 words for the excerpt.
} else {
     $excerpt_word_count = 40; //for all others, return 40 words.
}
?>
  1. If there is a More tag in your post, then the excerpt word count stops at either where the More tag is placed, without the excerpt trailing characters, or your defined excerpt length, whichever comes first. Therefore make sure that you place the More tag outside your specified word count.
  2. If you don´t know how to find the Category ID, then read this tutorial.

How To: Replace the Excerpt More String with a Link

NOTE: The excerpt_more filter that I talked about in my previous tutorial, specifically Code3c work fine with the “MAIN_CODE” above. The filter overrides what is assigned in the “MAIN_CODE”. However; why add an unnecessary function that can be done in our “MAIN_CODE”.

By default WordPress outputs an un-linked “[…]” at the end of each excerpt, which is not useful for Accessibility and SEO purposes. If you want to modify the excerpt more string with a link, then find line 28 in the “MAIN_CODE” and replace it with this:

<?php 
//Replace line 28 of the MAIN_CODE with this: 
$excerpt_end = ' <a href="'. get_permalink($post->ID) . '">' . '&raquo; Continue Reading.' . '</a>'; 
?>

If you want to add the post title to your link in the excerpt, then find line 28 in the “MAIN_CODE” and replace it with this:

<?php 
//Replace line 28 of the MAIN_CODE with this:  
$excerpt_end = ' &#8230;<br /><a href="'. get_permalink($post->ID) . '">' . '&raquo; Continue Reading: '. get_the_title() . '</a>'; 
?>

General Warning

When you add several PHP code blocks in your theme´s funtions.php file, make sure that you don´t leave any whitespace (spaces, newline) before the opening PHP tag or after the closing PHP tag.

General Advice

Keep WordPress Up to Date. If you can, you should always have the latest version of WordPress. Upgrading to the latest version is necessary because upgrades usually include performance and security enhancements and also new features. Go and download the latest version.

Conclusion

This simple code, help you enhance the default WordPress excerpt without the need of a plugin. The automatically generated excerpt is stripped from all HTML tags. In this tutorial, I discussed how to keep HTML formatting in the excerpt (also you get to choose which tags to keep). I also revisited the excerpt_more and excerpt_length filters, and how they can be used in a more efficient way as part of the same code block.