How to add a Read more button in Joomla 3.1


In our last tutorial, we showed you how to write a blog post in Joomla 3.0. Our example was a very short post, but if you write a very long post, then entire post will show on your homepage (as in the screenshot to the right).

You can make your homepage look much cleaner if you add a Read More button within the article. In this tutorial, we’ll show you just how to do that.

Adding a Read More link in Joomla 3.0

  1. Log into your Joomla 3.0 admin dashboard
  2. Open the blog post you want to edit

    In the top menu, click Content and then click Article Manager. Within the list of articles, click on the title of the article that you want to add the read more link to.

  3. Add the read more link

    Within the article editor, place your cursor where you want the read more link to appear. Then, under the editor, click the Read More button. You will notice a red dotted line appear within the editor, which shows where you just inserted the button.

    Joomla is actually adding the following code to the article:

    <hr id="system-readmore" /> 
  4. read-more-button-seen-on-homepage

    When finished, click the Save button at the top left of the page. Comparing the screenshot to the right to the one at the top of this tutorial, you can see that we now have the following button under the article:

    Read more: My first blog post

    This makes our homepage look much cleaner and professional.

Was this article helpful? Join the conversation!