logo wide 2000x350
Links and Page Breaks make it easier for visitors to navigate your website. A well organized navigational system can also increase your Google page rankings. This section has step by step instructions for dividing and connecting pages using the Joomla Page Break function and the JCE Editor Linking function. Linking is one of the primary methods used on the internet to convey and share information. Menus are simply a series of organized links to related pages with the menu items being the actual links. In this article, we will review several additional linking methods including READ MORE, PAGE BREAK, INTRO IMAGE AND TEXT, and adding internal or external links to text and/or images in articles and/or modules.

Divide an Article by Inserting a Read More Link
Joomla offers two ways to break up longer posts into shorter posts. These are the READ MORE and PAGE BREAK icons at the bottom of the Article Edit screen. The READ MORE icon is used for articles placed in a front page blog layout page. There is typically a thumbnail image and a couple of introductory sentences. Then you have the option of placing a READ MORE link which the viewer can click on to go to a page which has the full version of the article. To insert a READ MORE link in a category blog layout article, go to the Article Manager and open the article for editing. Make sure the first couple of sentences provide an interesting summary of the article. Then place the cursor at the end of this introductory text and click on the READ MORE button at the bottom of the work screen:


01

A line is then inserted into the article. Save the article and then view the site to make sure the Read More link is displayed properly and takes you to the intended page.

TIP: The "read more" function works only in articles published in blog layout. By default, the Home Page Menu Item is a special Category Blog called Featured Articles. To create a Category Blog on another page, first create a new category for the new blog with your Category Manager. Then go to the Menu Item Manager for your Main Menu and create a New Menu Item. Then for Menu Item Type, select Category Blog. Then link this category blog menu item to your new category. For example, below we have created a category called Latest News with the Category Manager. Then we added a Menu Item called LATEST NEWS:

Add the Article Title to the READ MORE text
When you create a Joomla article for the front page or blog view and use the Read More option to split the article into two sections you will find the Read More link includes just the text "Read More" rather than the title of your article.


To help search engines like Google understand what the article is about plus improve the click through rate from both search engines and visitors, we recommend you change the read more link so it matches the title of your article. For example, if you have created an article titled "Benefits of Joomla for Business Websites" then the read more link would be "Read More Benefits of Joomla for Business Websites."

02
To change the Read More link for a new article which appear on the front page or any other category blog layout, use the following steps:

  1. From the Joomla administrator area select the Add New Article

  2. Enter the title of the article and assign the article to a blog category.

  3. Enter some text in the editor to provide visitors with an introduction to the article

  4. Select the Read more button located at the bottom of the editor.

  5. Select the Parameters (Advanced) option located to the right of the editor and open the option Alternative Read More: text

  6. In The Alternative Read More Field enter either the name of the article or type in Read More or Learn More, then type in the name of the article or whatever else you want to use for the button name.

  7. Select the SAVE button and the new read more link will now be updated for this article. You can use different button names for different articles.

Pagination: Divide Pages by Inserting a Page Break
It is sometimes useful to split a long article into shorter sections so the reader does not have to scroll down the page just to reach a particular section in the article. Using a Page Break also creates a table of contents for your long article, with the page tab entries being the Page Titles that you enter for each page. You have to decide how long each page will be but the table of contents includes an option to view the whole article, so a reader is not restricted to viewing your article one page at the time. In addition to displaying the Table of Contents, each page will show a Previous and Next navigation button at the bottom of the page.


Articles which have many pages and many clear dividing points are ideal candidates for inserting page breaks. For example, our Article 2.2 Getting Started with your Joomla Website is over ten pages long and has an introduction section followed by 10 steps. We will break this up with 10 page breaks. To insert a page break, go to the Article Manager and open up our long article. Then position the cursor where you want the first page to end and the first page break to go.

03

At the bottom of the Editor screen, click on the Page Break button. This brings up the Page Break screen:

04

Give the New Page a Title, then click Insert Page Break. The second field called "Table of Contents Alias" will be the URL for this second page and can be automatically entered by Joomla. This will insert a line into the text indicating a page break has been inserted.

TIP: If you do not insert a title, Joomla will simply list page numbers which will not be very useful either for viewers or search engines, so it is recommended that you take the time to give each new page a short title based on the primary subject of that new page.

Add More Page Breaks
Keep clicking "Pagebreak" and typing in titles until you have split this article as many times as you wish. Each time you click “Pagebreak”, you should see a grey line across the page. When you're finished, click Save and Close. Then visit the front end of your website and click on the article in the menu to open it.


Visit the Article with Page Breaks to see the new Article Index:

05

When you visit the article you will see two special items, an "Article Index" which serves as a table of contents to the article pages and Prev and Next buttons at the bottom of the article for viewers to move on to the next page

Set the Page Break Display Options
There are some additional display options. Go to Extensions - Plugin Manager – Content – Page break. Below are Basic Display options:


06

Show Site Title includes some of the article information in the page title. It is best to set Show Title to Show.
Article Index Heading Setting this to Hide will hide the title that says "Article Index" by default. You can set it for Hide in order to save space..
Custom Article Index Heading means that you can change the text of the "Article Index" heading to anything you want. For example, you could change this to Article Table of Contents. Leaving this blank will display Article Index.
Table of Contents generates the list of links in the article, the Article Index, on the page. Setting this to Hide would eliminate that list. So leave this set for Show.
Show All controls whether the link to show the full article without page breaks is available in the Article Index. Leave this set for Show as some viewers prefer to see the entire article and scroll down rather than clicking on a series of pages.

Three Presentation Style Options
The style shown above is called the "pages" format. With some templates, you can also display page break information with a sliders format or a tabs format.


With the Design Control template, the sliders format just put a series of links to the 10 pages at the bottom of the first page with Previous and Next buttons. The navigation is not very clear. The Tabs option did about the same thing. So we are better off staying with the Pages option as this will show the Table of Contents for all ten pages on every page being viewed. If you really would like a slider or tabs to display sub pages inside of an article, you can get these free tools from the Joomla Extension Directory.

WARNING: It is not possible to edit page break titles once they have been made. To change this information, you have to delete the page breaks by deleting the inserted lines and start over.

Use Intro Text and Intro Images in a Blog Post
This optional feature for blog category articles allows you to have different text in the blog category view from the text that is displayed when you view the full item. The default content shows you the intro text in the blog category view and when you click the read more button you get the intro text and the full text. In some instances you may want to have a different image or text on the full article main page than the intro image and text that appears on the blog page. You can do this by setting the introtext to NO in the menu settings for the blog category settings.


Set Article Options to Display Image and Links Section
To set the Intro Text and Intro Images feature to display, go to the Article Manager and click on OPTIONS in the upper right corner. Click on the Editing Layout tab, then make sure Administrator Images and Links is set for SHOW.


07

Also we must create a new blog category and a new blog menu item like we showed above for adding a READ MORE button if we want to use the Intro Text and Intro Images function on a page which is not already set in a category blog – or is not on the Home Page Featured Articles. To create your Intro Text and Intro Image, open a new or existing article which is set for our category blog category or featured articles. We will use a new article for our Home page called What is Joomla? To place this article on the HOME page, just changed Featured from No to Yes.

08


Above the article editor is a tab called Image and Links: Click on it.

09

Clicking on the Select button brings up the images manager where we can add an image from any folder. Usually, thumbnail images for articles are kept in a special folder called thumbnails. Thumbnails are smaller images used at the beginning of blog articles. If you want thumbnail images automatically made for you, by reducing regular article images then go to the Joomla Extension Directory. There are several free extensions which will do this. You can also add a caption and alternate text to display in only the blog Introduction. Then click SAVE and Close and View the article to see the result.

10

Use Internal and External Links
An internal link is a link from one article to another article on your website. To add an internal link to an article, go to the Article Manager and open the article to the Article Edit screen. Then select the text or image you want to create a link for.


11


Click on the Link Icon in the JCE Editor:

12

This will bring up the LINKS screen:

13

You have three options to establish a link to this page. If you know the name of the article, then click on Content and find the Article. If you do not know the name of the article, but you know the name of the link, you can click on Menu. Finally, if you know the URL of the article, you can enter that in the URL box. We will click on the Content option:

14

Once the URL is in the URL box, click on insert:

15
Then click SAVE. Then View Site to check on the link to make sure it actually works. Then click SAVE and CLOSE. Linking to an image works exactly the same way.

Create a Link to a PDF file in a Joomla Article
Joomla treats PDFs as if they were large images. So you add PDFs to the Media Manager just like you add images to the media manager. First, you create a folder to put them in (named pdf or downloads). Then you upload and organize your PDFs in this folder using the Upload tool in the Media Manager or your File Manager. You then add a link to a PDF the same way you add a link to any other text or image. First you type in the name of the PDF. Then you click on the LINK icon in the JCE Editor. Then you click to the link. Select the text or image that users should click on. Then click the Link icon to launch the Link Manager. The Link Manager will open a window. Click the Green Plus (Browse) icon.


16

This will open the File Browser and take you to the Media Manager where you can click on PDF links that have already been uploaded to the Media Manager:

17

Or the blue button will take you to your Home computer were you can upload PDF files to this folder.

18

After clicking on the PDF, click the INSERT icon. This will not only activate the link to the PDF, but allow the PDF to be downloaded. Then click Save and Close. The PDF can now be downloaded by going to the article and clicking on it.

TIP: The problem with this simple method of linking a PDF to an article is that you do not get a count of how many times the PDF file was downloaded. Nor are you notified when the PDF is downloaded. We will therefore use a different component called Phoca Download to organize our PDFs into categories and keep track of how many times each PDF is downloaded.