Treehouse: Grow your CSS skills. Land your dream job.

Last updated on:

Replace Excerpt Ellipsis with Permalink

This is useful if you would like to replace the ellipsis [...] from the excerpt with a permalink to the post.

functions.php addition:

function replace_excerpt($content) {
       return str_replace('[...]',
               '<div class="more-link"><a href="'. get_permalink() .'">Continue Reading</a></div>',
               $content
       );
}
add_filter('the_excerpt', 'replace_excerpt');

Comments

  1. Anthony
    Permalink to comment#

    Very useful, tried and tested, thanks.

  2. Aaron
    Permalink to comment#

    win!

  3. Matt
    Permalink to comment#

    Useful snippet, thanks!

  4. Dee
    Permalink to comment#

    where do yo place this function?

  5. Ross
    Permalink to comment#

    I’ve been using:

    function new_excerpt_more($more) {
    global $post;
    return ‘… a class=”more-link” href=”‘. get_permalink($post->ID) . ‘”>’ . ‘Read More »’ . ‘/a';
    }
    add_filter(‘excerpt_more’, ‘new_excerpt_more’);

    But it kept showing the ” … ” at the end of the post.
    This is much cleaner. Thanks!

  6. ElMehdi
    Permalink to comment#

    Hello,
    Thank you for all your tricks, you save us so much time!

    Any impact on SEO when using this one please?

    Regards,

  7. Altin
    Permalink to comment#

    Hey mate,

    Thank’s a lot for sharing this ,but I have a little problem…
    I have a website (www.laptopshelp.com) and on the main page, there is a huge padding from the text to the “Read more…” .

    Is there any way to solve that, and if yes , how ?

    Regards, Altin

  8. Alex
    Permalink to comment#

    that didn’t work in my theme, till I wrote this:

    <?php function replace_excerpt($content) {
    return str_replace('[&hellip;]', '... ', $content );
    }?>

    because &hellip is the appropiate HTML entity

    • Alexis
      Permalink to comment#

      Thanks! The combination of the snippet above and the &hellip worked. Saved me time, thanks Alex.

      And thanks CSS-Tricks, this site is often invaluable.

    • Joel Kumwenda

      Thanks Alex this worked for me.

  9. Sarah Lewis (@WPMoxie)
    Permalink to comment#

    I’ve updated this to work with HTML entities but still be backwards-compatible. See the Gist.

Leave a Comment

Posting Code

We highly encourage you to post problematic HTML/CSS/JavaScript over on CodePen and include the link in your post. It's much easier to see, understand, and help with when you do that.

Markdown is supported, so you can write inline code like `<div>this</div>` or multiline blocks of code in in triple backtick fences like this:

```
<script>
  function example() {
    element.innerHTML = "<div>code</div>";
  }
</script>
```