Skip navigation
Currently Being Moderated

Dividing blog posts automatically with a "Read more" function?

Jun 6, 2012 2:16 AM

Tags: #blog #truncation #divide #business_catalyst #dividing #blog_post #read_more #blogpostbodypreview #tag_blogpostbodypreview

In our company the Business Catalyst blog will be used by several users, most of them without any HTML knowledge. At the moment the full blog posts are being showed on the blog frontpage, but I would like to divide the posts and include a "Read more" function.

 

I know this is possible with the {tag_blogpostbodypreview}, but I can't seem to figure out an easy way to do it. Will I really have to insert <p></p> tags where I want the content to start and finish? I know trouble will come of this when users without any knowledge start blogging.

 

Isn't there an easier way to tell BC to divide the posts? Maybe after a certain amount of words or characters? Or even better, just by inserting a tag of some kind where I want the "Read more" function to come in place? (in case I want it after a picture or a video)

 
Replies
  • Liam Dilley
    6,691 posts
    Feb 28, 2012
    Currently Being Moderated
    Jun 6, 2012 4:39 AM   in reply to cc08180

    for proper markup and to properly enable search engines to know your content your content should be in p tags anyway. Not doing a lot if you have website content thats not.

    In the page editor in the admin for the blog editor (slightly different from the page editor) you select your text and choose the format dropdown and choose "normal". This will wrap the content in a p.
    For web pages in the same dropdown you choose "Paragraph" to do the same.

    First paragrap will be the first part of the blog to use as the preview. Pretty straight forward really

     
    |
    Mark as:
  • Currently Being Moderated
    Jun 6, 2012 8:17 AM   in reply to cc08180

    Hello,

     

    Alternatively to what Liam just proposed, you can also use {tag_blogpostbody, 100} to display the first 100 characters from each blog post. You can replace 100 with whatever number of characters you want.

     

    {tag_blogpostbodypreview} will always show the content of the first <p> </p> tag, so you can instruct the client to ue the formatting options from the Editor to create paragraphs, as Liam pointed out.

     

    Hope this helps!

     

    Cheers,

    Florin

     
    |
    Mark as:
  • Currently Being Moderated
    Jun 6, 2012 10:18 PM   in reply to Florin Carlig

    Thanks Florin,

     

    I wasn't aware of your method. I like that method better. Question though, do you need to add your link text to that?

     

    Example: {tag_blogpostbody,100,Read More}

     
    |
    Mark as:
  • Currently Being Moderated
    Jun 6, 2012 10:32 PM   in reply to Brad Lawryk

    Hi Brad,

     

    If you use {tag_blogpostbody, 100} the system will render the first 100 characters and a link to the full post

    If you use {tag_blogpostbody,100,Read More} the sistem will render the first 90 characters and the "Read More" text will be a link to the full blog post.

     

    Cheers,

    Florin

     
    |
    Mark as:
  • mario_gudelj
    1,679 posts
    Oct 13, 2010
    Currently Being Moderated
    Jun 6, 2012 10:38 PM   in reply to Florin Carlig

    NOTE: The chracter limiting method will strip all HTML from those first 100 characters. {tag_blogpostbodypreview} will render the first block element.

     
    |
    Mark as:
  • Currently Being Moderated
    Jun 7, 2012 3:09 AM   in reply to mario_gudelj

    Is there any talk of impleneting a readmore button in the wysiwig editor similar to Wordpress... or any other blog patform really.

    Being limited to the contents of the first block element or 100 characters makes featured images and workabale previews tricky.

     
    |
    Mark as:
  • Liam Dilley
    6,691 posts
    Feb 28, 2012
    Currently Being Moderated
    Jun 7, 2012 4:45 AM   in reply to mario_gudelj

    That is why I did not mention that one Mario so that's a useful point.

    I like to do things like have an image in blog post intros etc

     
    |
    Mark as:
  • mario_gudelj
    1,679 posts
    Oct 13, 2010
    Currently Being Moderated
    Jun 7, 2012 9:55 PM   in reply to Fortix Team

    That's my recommendation in the ticketing system. It's be great to be able to place something like <!--read-more--> inside the body of the post, which is what WP does, and have the text cut off there and replace it with button. I think there are even more elegant ways to do it, but the limitations of the current framework are know to the eng team.

     

    -m

     
    |
    Mark as:
  • Currently Being Moderated
    Oct 12, 2012 1:17 PM   in reply to cc08180

    Just discovered a great fix for this. Since the tag {tag_blogpostbodypreview,Read More} does only display content within the first paragraph tags, simply move all desired content to be within the first <p> tags. Use span and line break tags to format text appropriately. Can also use this to display images within the preview post in list view.

     
    |
    Mark as:
  • Liam Dilley
    6,691 posts
    Feb 28, 2012
    Currently Being Moderated
    Oct 12, 2012 1:51 PM   in reply to guyforgod366

    I did mention that is war I use :p

     
    |
    Mark as:
  • Currently Being Moderated
    Nov 23, 2012 12:02 PM   in reply to cc08180

    Does this technique only apply to blog post or can it be used in product description as well?

     
    |
    Mark as:
  • Currently Being Moderated
    Nov 27, 2012 5:34 AM   in reply to Jeaneve

    Hi Jeaneve,

     

    No, this does not work for product description.

     

    Thanks,
    Florin

     
    |
    Mark as:
  • Currently Being Moderated
    Nov 29, 2012 4:51 AM   in reply to Florin Carlig

    Thank You Florin,

     

    I'm a newbie to BC and I think I figured out that basically this can be accomplish with the individual product small module, native to BC or some JS available at a third party (Quick product view).

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (0)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points