Web Development Documentation

Add Read More (to show "Teaser" Text in Category Blog)

Overview

If your article has a significant amount of text, and you want to display multiple articles on the same page using a Category Blog, you can break up the article by inserting a "Read More" separator line within the article.  Anything above the "Read More" line will be displayed as "teaser text" on the ‘blog view’, and the entire article will be displayed once you click Read More.

Comparison of Category Blog without "Read More" in articles and with "Read More" in articles
Left Side: Category - Blog without "Read More". Right Side: Category - Blog with "Read More".

 

Procedure

  1. Find the article you want to edit.
  2. Click inside the article to place the cursor where the Read More link should appear - for example, at the beginning of the second paragraph within the article (see #1 below).
  3. Click the Read More button below the content area (see #2 below).

    Click within article, then click "Read More" button

  4. A horizontal line will appear within the article where you placed the cursor (see below):
    "Read More" separator line
  5. The text above this line is considered the "Intro Text" (or "teaser text") and will appear when the article is shown via a Category Blog menu item (see #1 below).  The text below the horizontal line will initially be hidden in the Category Blog, but will appear once the Read More button is clicked (see #2 below).
    Example of an article shown in a Category Blog, with Intro Tet shown above the Read More button
  6. Save & Close the article.

Joomla-Workshops-Button-Hugo