JQUERY READ MORE “TEXT ABBREVIATOR” PLUGIN

If you have a lot of user-generated content that you don’t limit the length on, so it can grow very large. To combat this, there is the UI pattern: a “read more” link available to show the remaining text for the long-winded texts, while just showing a snippet otherwise. Jquery.readmore is an easy way to do this.

Default Usage

<p class="short">
  (long text here)
</p>
$(".short").readmore();

Resulting Demo

Setting substring length

<p class="short">
  (long text here)
</p>

// adjust per call
$(".short").readmore({ substr_len: 50 });

// or permanently for all calls
$.fn.readmore.defaults.substr_len = 50;
$(".short").readmore();

This delimits the text shown to 50 characters, and is appended with the read more tag.