It is assumed that you have already downloaded and installed the extension (free or pro). If not, you can find more information here on how to do so.

There are many options in the extension to give you maximum flexibility in the way you want to design your final output. In this guide, you will be walked through the main parameters that are necessary to create a module instance. You can leave all other parameters to their defaults until you are ready to fine-tune its visual aspect and performance.

Pre-requisites

You need to have created articles (through the core Joomla content extension) or K2 items, if you have installed the K2 extension and desire to use Latest News Enhanced for showing K2 items.

Step 1 - Create a module instance of Latest News Enhanced

Go to the menu Extensions -> Modules.

Modules page

Click on New.

New module

Select the module type Latest News Enhanced.

Select the module type

Step 2 - Set the module's general parameters

Set the module's title.

Edit the title

Set the module's position.

Select the position

Step 3 - Assign the module to specific areas of the site

Assign the module to areas

For testing purposes, it is easier to leave the default settings.

Step 4 - Narrow down the list of items you want to show

Click on the Selection tab.

Click the selection tab

Choose the proper data source.
Select Articles to show articles, select K2 Items to show K2 items

Select the data type

Select the category or categories the items come from.

Select the categories

All categories are selected by default, therefore retrieving all existing articles or K2 items. To select a specific category, select it from the list.

Select a category

Once selected, remove the All Categories option.

Remove the option all categories

Narrow down the number of items that will be listed by the module instance. Set Max Count to a reasonable amount while you are in the testing stage.

Set the max count

Step 5 - Design the overall appearance of all items

Click on the Layout tab.

Click the layout tab

Check the layout related to the data source. Default is the layout used for articles. K2 is the layout used for K2 items.

Select the layout

Set the configuration of the items. Set it to Vertical to show the items in a column fashion, set it to Horizontal to show them in a row fashion.

Set the configuration

Set the width of the items.

The default settings will set each and every item to take 100% of the container' space, therefore forcing the items to show in a vertical fashion (or have 1 column).

Set the item width

In order to show 3 items in a row (or have 3 columns), set the percentage width to something like 30%. This will give each item a third of the space allocated by the container to the module instance (plus some space for margins). To limit the downsizing of each item to something visually pleasing and lisible, you can set a minimum width, under which the items will stop resizing down. In a responsive environment, this will have a visual impact. 3 items in a row will resize down until they hit the minimum size. Once that limit is hit, the third item will be forced to show in a second row.

Set the width in percentages

It is possible to force items to be of a specific size. Set the width in pixels in order to do so.

Set the width in pixel

Select the style for each item.

Choose a style

Choose what visual element you want to add to each item. For instance, you may want to show an image found in each article or K2 item.
In the context of the Latest News Enhanced extension, that visual element is called Head

Choose a visual element

Set the width and height of that visual element. In the event you chose the original style, this can be of any size, but a small image will definitely load faster.

Set the visual element size

Decide how the title of the article or K2 item will show. It can be restricted to show on one line, no matter how resized the item will be, it can be limited to a fixed amount of letters or show in its full glory on one or several lines.

Set the title parameters

Decide how the text of the article or K2 item will show.

The default font size will dictate the initial font size for the overall design of each item. All text will be resized according to that font size of reference.

Set the position the text should have compared to the visual element (head) that you have added. If no visual element has been selected, just leave the default setting.

Limit the letter count to a reasonable amount that will comply to your design requirements. If you don't restrict the amount of text, you will end up with over-blown items if your articles or K2 items are lengthy.

Stripping the tags will remove all HTML tags included in the text of the articles or K2 items, therefore removing all formatting. It is preferable to leave this setting to Yes in your initial setup.

Set the title parameters

Step 6 - Link the items to the original articles or K2 items

You can add a link that will open the associated article or K2 item. You have several options:

  • make the title of the item clickable,
  • make the head (or visual element you have selected) clickable - calendar representations are not clickable,
  • add a read more link (you need to set the label in the Read More section),
  • append a read more link at the end of the text (you need to set the label in the Read More section).

Link the item

Step 7 - Setup the visual element that you have added to the design

In our example with have selected to show an additional image. Therefore, click on the Head: image tab.

Click the head:image tab

Good practice would be to setup the default image that will show if no image has been found in your article or K2 item. It will be useful in the early stages of your setup.

Set the default image

The Crop Pictures option will ensure all your images fit perfectly in the size (head width and head height) you have previously set, resizing and cropping them if necessary.

Crop images

Step 8 - Add contextual information

You can show relevant information to each item you are showing with the module. For instance, you can show the author of each article or K2 item.

Click on the Information tab.

Click the information tab

Set information parameters or each piece of information you need to show.

Set information blocks

There are plenty of pieces of information you can choose from. Select Author as an example.

Choose information

You can show an icon or prepend text to the author. For instance, if you add 'The author is ' (with a space after the 'is') in the Prepend Text field, you will end up with something like:

The author is John Doe

Append New Line will force the following piece of information to show on the next line.

Step 9 - Save the module

That's it! You went through the minimal amount of information you need to know to create your first instance of the Latest News Enhanced module.

Let's see what the module instance looks like on the public site:

The resulting output

LIMITED SALE 20% off all licenses all memorial weekend long. Use coupon code MEMORIAL20