Joomfolio for K2

Joomfolio for K2 is a powerful module that displays K2 articles in beautiful layouts with category or tag filtering.

It is a fully responsive grid module that allows you to display K2 Articles in beautiful grid layouts. A large variety of options allows you to configure the grids as you desire.

To install Joomfolio for K2

  1. Login to Joomla administrator control panel
  2. Go to Extensions > Manage
  3. Click on Upload Package File
  4. Select the zip file of the extension and click on Upload & Install
    Installation
  5. Go to Extensions > Modules and search for Joomfolio for K2
  6. Under the tab Module select a position for the module and set the Status as Published
    Installation
  7. Under the tab Menu Assignment assign the module to the menu items where you want it to display.

      Important:

    If you assign the module to a menu item of type K2 Items or K2 Categories, the module will still display when you click on an article link. If you don't want the module to be displayed inside an article page, you must not assign it to those menu items.

Data Source

Under the tab Data Source you have the option to select Custom Filtering or Specific Items.

Custom Filtering:

With the Custom Filtering you can filter articles by:

  1. Categories
  2. Tags

If you leave the above 2 fields empty then all articles will be selected. Keep in mind that the 2 above filters work in conjunction with each other. That means that if you select a Category called Category 1 and a tag called Tag 1 then the module will show articles that belong to the category Category 1 and at the same time they have the tag Tag 1.

If you also want to retrieve items from the children categories of the selected categories you must enable the field Child Category Articles.

In the field Items count you can limit the total items shown in the module. Default is 8.

Configuration

You can also configure the module to hide or show Featured articles, filter articles by date by selecting a time range or fetch only items with videos.

Additionaly you can exclude specific articles from the module in the field Exclude Items by entering the articles id's separated by commas.

Finally you can change the articles ordering in the module in the field Items Ordering.

Configuration

Specific Items:

If you want to display specific items in the module you must select the option Specific Items in the field Source.

Then add the items of your choice in the field Add Items. If you want to change the items ordering just drag the items to re-order them.

Configuration

General Settings

Grid settings

Grid: Each grid is optimized to display as many items as the grid number. For example, Grid 9 is optimized to display 9 items.

Items spacing: Spacing between items (in pixels).

Image settings

Crop images: If enabled, images will be cropped to the dimensions below.

Image width: The module will crop the images to this width (in pixels).

Image height: The module will crop the images to this height (in pixels).

Full width image: If enabled, the image will cover the whole item and will be visible behind the detail box.

K2 Image size: The module will use this K2 image when cropping images.

  Important

The module stores the cropped images to the folder root/images/jk2/. When you change the images of the K2 items, the changes are not immediately reflected to the module because the module is using the cropped images stored at root/images/jk2/. In this case, you must download, install and publish the plugin Minitek K2 Tools. This plugin will automatically update the images in the cache folder everytime an image is changed in a K2 item.

General item settings

Title limit: Limits the total count of words in the item title.

Introtext limit: Limits the total count of words in the item introtext.

Strip HTML tags: If enabled, all HTML tags in introtext will be stripped. If disabled, the introtext limit will be ignored. Notice: The module might crash if the HTML inside the article introtext is not valid or has errors.

Date format: Enter a date format. You can learn more here: PHP Date Manual.

Item Settings

  Item sizes

Each Joomfolio grid consists of items of different sizes. You can configure each item size separately with the parameters of this section. Τhe available item size are:

  • Big (B)
  • Landscape (L)
  • Portrait (P)
  • Small (S)
Configuration

Big item

With the parameters of this section you can configure the appearance of Big items.

Landscape item

With the parameters of this section you can configure the appearance of Landscape items.

Portrait item

With the parameters of this section you can configure the appearance of Portrait items.

Small item

With the parameters of this section you can configure the appearance of Small items.

Column item

With the parameters of this section you can configure the appearance of Column items. All item sizes will revert to Column items if you select Equal columns in the responsive settings for a particular screen size.

Hover Settings

When enabled, the Hover box displays on top of each item on mouse hover. With the parameters of this section you can configure what will be displayed inside the Hover box.

  If you enable the parameter Hover fancybox icon in the Hover box settings, you must make sure that the parameter Load Fancybox is also enabled in the Advanced settings of the module.

Configuration

Filter Settings

Category filters: Enable/disable category filters.

Tag filters: Enable/disable tag filters.

Show filter labels: Enable/disable filter labels. You can translate the labels inside the file root/language/en-GB/en-GB.mod_joomfolio_for_k2.ini.

Filters color: Color for the filters text.

Filters background color: Background color for the filters bar.

Filters border radius: Border radius for the filters bar (in pixels).

Configuration

Responsive Settings

  With the parameters of this section you can configure the module layout for various screen sizes.

LG size: Size limit for Large Screens (in pixels). Under this limit, the MD layout type will be applied.

MD layout type: If Joomfolio grid is selected, the layout will be displayed according to the selected grid in Basic settings. Otherwise the items will be displayed in equal columns for this screen size.

MD items per row: Items per row for Medium Screens (medium desktop). Applies only if Equal columns is selected in the above field.

MD size: Size limit for Medium Screens (in pixels). Under this limit, the SM layout type will be applied.

SM layout type: If Joomfolio grid is selected, the layout will be displayed according to the selected grid in Basic settings. Otherwise the items will be displayed in equal columns for this screen size.

SM items per row: Items per row for Small Screens (tablet). Applies only if Equal columns is selected in the above field.

SM size: Size limit for Small Screens (in pixels). Under this limit, the XS layout type will be applied.

XS layout type: If Joomfolio grid is selected, the layout will be displayed according to the selected grid in Basic settings. Otherwise the items will be displayed in equal columns for this screen size.

XS items per row: Items per row for Extra Small Screens (small tablet/landscape phone). Applies only if Equal columns is selected in the above field.

XS size: Size limit for Extra Small Screens (in pixels). Under this limit, the XXS layout type will be applied.

XXS layout type: If Joomfolio grid is selected, the layout will be displayed according to the selected grid in Basic settings. Otherwise the items will be displayed in equal columns for this screen size.

XXS items per row: Items per row for Phones. Applies only if Equal columns is selected in the above field.

Configuration

Advanced settings

Load jQuery library: Enable this parameter only if you experience javascript conflicts on the page. It is disabled by default.

Load PHP Thumb Factory: The PHP Thumb Factory is responsible for all image cropping operations. Do not disable it unless it is already used by another extension.

Load Fancybox: Enable the Fancybox only if you have also enabled the parameter Show hover fancybox icon in Basic settings.

Load Font Awesome: If your template uses the Font Awesome library you can safely disable this parameter.

Configuration
Frequently Asked Questions
View Changelog

This website uses cookies so that we can provide you with the best user experience. By clicking "continue" you agree to cookies being used in accordance with our Cookies Policy.

Search