show only first 600 characters of post in a sharepoint blog site

Question

Is it possible to show the first 600 characters of a post in a blog site? Can i use JSlink to achieve this in a blog site?

Thanks in Advance

Answer 1

Threw this together, works for me in SharePoint 2013.

I bet there is room for improvement as I am no JavaScript guru. Add this to a script editor webpart on the blog-post site. This truncates all the posts when the length of the post is more than 600 characters.

<script type="text/javascript">
window.onload = function truncatePosts() {
var element = document.getElementsByClassName("ms-blog-postBody");
for (var i = 0; i < element.length; i++) {
    var text = element[i].innerText;
        if(text.length >= 600) {
            var truncatedText = text.substring(0,600) + ' ...';
            element.innerText = truncatedText;
            document.getElementsByClassName("ms-blog-postBody")[i].innerText = element.innerText;
        }
    };
};
</script>

Answer 2

You can use CSR to achieve this. Here is a nice article on Trimming the content of multiline text using CSR.

I have modified it a little bit which you can try. Create a js file, paste the following code and use that js file as JS Link in the blog post web part.

(function () {
      function registerRenderer() {
        var ctxObj = {};
        ctxObj.Templates = {};  
        ctxObj.Templates = {
            Fields : {
                'Body': {
                    View : function (ctx) {
                        var bodyValue = ctx.CurrentItem.Body;
                        //This regex expression is used to delete html tags from the Body field
                        var regex = /(<([^>]+)>)/ig;
                        bodyValue = bodyValue.replace(regex, "");
                        var newBodyValue = bodyValue;
                        var returnString = "<span title='" + bodyValue + "'>" + newBodyValue + "</span>";
                        if (bodyValue && bodyValue.length >= 600){
                            newBodyValue = bodyValue.substring(0, 600) + " ...";
                            var displayItemFormUrl = "/blogs/Lists/Posts/Post.aspx?ID=" + ctx.CurrentItem.ID;
                            returnString = "<span title='" + bodyValue + "'>" + newBodyValue + "</span>&nbsp;<span><a href='"+displayItemFormUrl+"'>Read More</a></span>";
                        }
                        return returnString;
                    }
                },
            }
        };
        SPClientTemplates.TemplateManager.RegisterTemplateOverrides(ctxObj);
    }
    ExecuteOrDelayUntilScriptLoaded(registerRenderer, 'clienttemplates.js');
})();