Visual guide to customising the weblinks pages using Joomla

This tutorial guide shows you how to modify the default weblinks layout in Joomla by using the over-ride mechanism that's built into Joomla.

This is important because it means that when you upgrade to a more recent version of Joomla you will not have to re-do your changes.

The default layout for the weblinks pages of Joomla looks like this, highlighting the two elements that are going to be changed.

default Joomla weblinks page design

Joomla's weblinks page layout

There are only going to be a few links on the page so I don't want to show the number in front of each link, and the drop-down menu to select the number of links to show on the page is redundant. Both of these need to be removed.

Here's how the final layout will look.

customized Joomla weblinks page

Customised Joomla weblinks page layout

Same content but the link numbers and the selection menu have both gone.

Follow the instructions on the right to do the same on your Joomla website.

Visual guides to Joomla

Customising Joomla weblinks - page 2

<< previous page | next page >>

At this point you have a duplicate copy of the BEEZ template. So you know which is which you need to give it a different name at least. Ideally you should also update other information about the template so that when you are using the Joomla administrator tools you know exactly which template you are working on.

For the purposes of this tutorial let's assume you have done that.

We now have to locate the code that Joomla uses to produce the weblinks page. Looking at the screenshot on the left there is a dropdown menu box, and a number in front of each web link. Those are the things we want to remove.

In this case the appropriate file is . . .

/yourJoomlaFolder/templates/racz/html/com_weblinks/default_items.php

and it's highlighted in this image

changing weblink layouts in Joomla 1.5

Edit the php file

Open the file using your favourite text editor - be careful to use something that will not put in lots of additional characters, so an editor like Notepad++ if you are working on a pc, or Smultron if you are working on a Mac. Both of these are open source editors.

The code to change is in two parts. Let's look at the output of the number in front of the weblinks first, here's the code. You should find it around line 50.

<td align="center" headers="num">

<?php

echo $this->pagination->getRowOffset($item->count);

?>

</td>

Looking at the code it can be broken down, the echo statement is the part that displays the line number, this is what needs to be removed or made inactive. My personal preference is is to 'comment it out'. By that I mean make it into a comment, so that the php interpreter will ignore it, but it will still remain in the file where humans can read it and see what was done.

This is important if the system is going to be maintained by someone else in the future.

In php there are a number of ways to make something into a comment, but for this instance // is appropriate. So the revised code will be . . .

<td align="center" headers="num">

<?php

// echo $this->pagination->getRowOffset($item->count);

?>

</td>

You can check the edit easily by saving the change, uploading the revised file to the server, then using the Joomla administrator tools to switch templates so that your site uses the revised template then viewing the weblinks page. If all has gone well then there will be no numbers in front of the web links.

On the next page we'll remove the other items.

 

<< previous page | next page >>