JEM Teaser Module

Overview

The JEM Teaser Module presents selected events as visual promotional entries instead of a conventional event list. Each entry can combine a calendar-style date block, event title, venue, categories, event and venue images, a shortened description, event links and a link to an associated Joomla article.

It is suitable for homepage highlights, event landing pages, sidebars, category pages and venue pages. Events can be filtered by date status, category, venue, event ID, county or country.

Version Compatibility

Requirements

• JEM 5.0.1, JEM 5.0.2 Beta 1 or JEM 5.1.0 Beta 4 must be installed and enabled.
• The Joomla version must be 5.4 or later, or Joomla 6.x.
• At least one published or archived event must match the selected display type and filters.
• The visitor must have access to the event, its categories and its venue.
• Event or venue images must be assigned if image output is enabled.
• An associated Joomla article must be published, accessible and configured for Information usage before the module can display a More information link.

Where to Find It

1. In the Joomla administrator, go to System → Manage → Site Modules.
2. Select New and choose JEM - Teaser Module, or open an existing Teaser module.
3. Select a template position.
4. Configure the JEM options and assign the module to the required menu pages.
5. Save the module and check the result on the frontend with the intended user access level.

Understanding the Three Description Actions

Read more Navigation by Version

Basic Options

Event Selection and Filters

Title and Event Links

Description, Read More and Associated Articles

Event and Venue Images

Date and Time

Colours

Module Intro and Footer

Advanced Options

Standard Joomla Module Settings

Joomla supplies the normal module controls around the JEM options. Configure the module title, title visibility, template position, publication status, publishing dates, access level, ordering, language, administrator note and menu assignment as required.

Available Layouts and Stylesheets

The Teaser module loads several stylesheets together: one for the selected layout, one for the calendar colour and one for the configured JEM icon system.

Layout Overrides

To modify the HTML without changing JEM core files, copy the required layout into your active Joomla site template:

/templates/<your-template>/html/mod_jem_teaser/default.php
/templates/<your-template>/html/mod_jem_teaser/responsive.php

Joomla then uses the template copy instead of the file installed in:

/modules/mod_jem_teaser/tmpl/

CSS Overrides

Recommended Template CSS Override

To replace a complete Teaser stylesheet, create a file with the current stylesheet name under the active site template:

/templates/<your-template>/css/mod_jem_teaser/default.css
/templates/<your-template>/css/mod_jem_teaser/responsive.css

The same method can be used for colour and icon stylesheets:

/templates/<your-template>/css/mod_jem_teaser/red.css
/templates/<your-template>/css/mod_jem_teaser/category.css
/templates/<your-template>/css/mod_jem_teaser/iconfont.css

JEM searches for a module stylesheet in this order:

1. /templates/<template>/css/mod_jem_teaser/
2. /templates/<template>/html/mod_jem_teaser/
3. /media/mod_jem_teaser/css/
4. /modules/mod_jem_teaser/tmpl/

Small CSS Adjustments

If only a few declarations are required, use the shared JEM module user stylesheet instead of replacing the complete module stylesheet:

/media/com_jem/css/custom/jem-user-module.css

This file is loaded after the module styles and is suitable for local adjustments such as spacing, font size, image width or colours.

Legacy CSS Filenames

• JEM 5.0.1: use the current filenames, such as default.css. This path already works in the stable release.
• JEM 5.0.2 Beta 1: current filenames are recommended. Legacy filenames are temporarily recognised, and JEM can offer to migrate them.
• JEM 5.1.0 Beta 4: current filenames are required at runtime. Legacy files are detected and presented to the administrator for migration.

Guided CSS Migration

JEM 5.0.2 Beta 1 and JEM 5.1.0 Beta 4 can detect legacy JEM module CSS filenames. When a legacy override is found:

1. Open the JEM Control Panel.
2. Follow the Legacy module CSS overrides require attention warning.
3. Open CSS Manager.
4. Review every displayed source and destination path.
5. Select Migrate CSS overrides only after confirming the paths.

The migration never overwrites an existing destination file. Conflicts, symbolic links, unsafe paths and non-writable folders require manual review.

Configuration Examples

JEM 5.1.0 Beta 4: Programme Example

Troubleshooting

Accessibility

• Keep link and button labels meaningful.
• Verify text contrast when category or venue background colours are enabled.
• Do not rely on colour alone to communicate event status.
• Provide useful alternative text through meaningful event and venue names.
• Test the module using keyboard navigation.
• Test as a guest and registered user when events, categories, venues or associated articles use different access levels.

JEM 5.1.0 Beta 4 Appendix

• Adds the Event hierarchy selector.
• Supports parent events and programme subevents introduced by Advanced Events & Venues.
• Can show only parent events, only subevents, the complete hierarchy or the normal calendar-visible set.
• Supports venue images stored in the expanded JEM venue image structure.
• Uses the current module CSS filenames and does not load obsolete pre-JEM 5 filenames at runtime.
• Detects legacy CSS overrides and offers a safe administrator-approved migration through JEM CSS Manager.
• In the current Beta 4 source, Read more follows Event block layout. Select Details when direct access to the complete description is required.

Related Resources

• JEM 5.0.1 Teaser source
• JEM 5.0.2 Teaser source
• JEM 5.1.0 Teaser source
• GitHub #1949: Module CSS overrides
• GitHub #2335: Module status indicators
• GitHub #2344: Module image handling
• GitHub #2293: Event programmes and hierarchies
• Search GitHub issues mentioning mod_jem_teaser
• PHP date and time format reference