Are you enjoying the extensions? Did you like the support? Help others decide.

Leave a review
Details
Category: Latest News Enhanced
Information
Print

Module: theming

Information
Latest News Enhanced

Themes

Style The overall look of a news item
Original Original
The default look
Original (Modern) Original (Modern)
An updated version of the original theme, using CSS Flexbox
Full width Pro Full width
The 'head' element has full item width
Full Width Overlap Pro Overlap
The text shows over the 'head' element, which requires the 'head' element of the item to be an image. The content is restricted to the image's dimensions
Flexi Cover Pro Flexi Cover
The text shows over the 'head' element, which requires the 'head' element of the item to be an image. There are no dimensions restrictions
Download more styles Pro Download more styles
CSS effect 1 (Boxed) Pro CSS Effect 1 Boxed
Separate download
CSS 3 animated layout. Image only head type.
Learn how to set it up.
Original image Pro Obsolete 6.0+ Original image
Separate download
The image is not resized, the original image is used.
Head width and height must be set to 0.
Not compatible with animations.
Please check the section 'Card styles' for more information
Color scheme An optional color scheme to apply to the style
Inherit
The colors are inherited from the template's colors
Denim color scheme Denim
A dark blue scheme
Earth color scheme Earth
A scheme with natural colors
Marine color scheme Marine
An ocean blue scheme
Pastels color scheme Pastels
A scheme using pastel colors
Portfolio color scheme Portfolio
A more modern scheme
Download more color schemes Pro Download more schemes
Please check the section 'Color schemes' for more information

Theme overrides

Background Color The overall background color
Border width The item's border width
Border radius The item's border radius
Border color The item's border color
Shadow The item's shadow
No shadow None
No shadow is applied
Small soft shadow Small
A small soft shadow is applied
Medium soft shadow Medium
A medium soft shadow is applied
Large soft shadow Large
A large soft shadow is applied
Small shadow Small
A small shadow is applied
Medium shadow Medium
A medium shadow is applied
Large shadow Large
A large shadow is applied

Warning When adding shadows, the item's content width is reduced with the space taken by the shadows. For instance, if item width is 300px and the shadow is 10px wide, the content width will be 300 - 10 - 10 = 280px.
Space to border The distance between the content of the item and it's outer limit

Space to border
Font color The item's font color. Leave blank to use the template's styling. Leave blank to use the template's or color theme's color
Link color The item's link color. Leave blank to use the template's styling. Leave blank to use the template's or color theme's color
Link hover color The item's link color when hovering over it. Leave blank to use the template's or color theme color's
Font size reference The reference size of the text for the whole item, except for the calendar head.
0 will set the size to the template’s default
Head
Space around White space that surrounds the 'head' element (leave empty to keep the style's default)

Space around head
Body
Space around White space that surrounds the 'body' of the item (leave empty to keep the style's default)

Space around body
Joomla 4
Title classes		 The CSS classes that can be used to skin the title. For instance, using fw-bold will bold the title if the template is based on Bootstrap 5
Information
Font The font for the blocs of information.

Joomla 4 The extension supports the GDPR-compliant web fonts from fonts.bunny.net. To select the service (Google is the default), go to the SimplifyYourWeb extensions System plugin and select the web font service you wish to use.
Font size The font size in comparison to the font size of reference
Line spacing The height (px or em) given to each line allowing spacing of the lines of information
Font color The text color.
New v4.13 When you do not select a color, the text color is the same as the introductory text
Pro
Font color over head		 The text color for information placed over the head (image or video)
Icons color The color of the icons, when icons are shown.
New v4.13 When you do not select a color, the icon color is the same as the introductory text
Pro
Icons color over head		 The color of the icons placed over the head (image or video), when icons are shown
Pro
Improve contrast		 When showing information over images, the text may be hard to read. Enable this functionality to add a background gradient and text shadow.

Before:
Before improving contrast
After:
after improving contrast
Read more link
Style The link style, following the theme default style or using Bootstrap (Bootstrap is the default for backward compatibility)
Bootstrap type The link type (as defined by Bootstrap)
  • Default button
  • Primary button
  • Info button
  • Inverse button Only in Bootstrap 2
  • Link
Bootstrap size The size of the label (as defined by Bootstrap)
  • Default
  • Small
  • Mini Only in Bootstrap 2 and 3
Classes The CSS classes that can be added to the link (space separated).

Example btn btn-default will create a Bootstrap-style button if your template supports Bootstrap. Use code that is related to the version of Bootstrap your template is using.

New 6.0 Example Use btn btn-theme to match the button color with the selected color scheme
Categories
Style The link style, following the theme default style or using Bootstrap
Bootstrap type The link type (as defined by Bootstrap)
  • Default button
  • Primary button
  • Info button
  • Inverse button Only in Bootstrap 2
  • Link
Bootstrap size The size of the label (as defined by Bootstrap)
  • Default
  • Small
  • Mini Only in Bootstrap 2 and 3
Classes The CSS classes that can be added to the link (space separated).

Example btn btn-default will create a Bootstrap-style button if your template supports Bootstrap. Use code that is related to the version of Bootstrap your template is using.

New 6.0 Example Use label bg-theme to match the label color with the selected color scheme (when using Bootstrap 2)
Read all link
Style The link style, following the theme default style or using Bootstrap
Bootstrap type The link type (as defined by Bootstrap)
  • Default button
  • Primary button
  • Info button
  • Inverse button Only in Bootstrap 2
  • Link
Bootstrap size The size of the label (as defined by Bootstrap)
  • Default
  • Small
  • Mini Only in Bootstrap 2 and 3
Classes The CSS classes that can be added to the link (space separated).

Example btn btn-default will create a Bootstrap-style button if your template supports Bootstrap. Use code that is related to the version of Bootstrap your template is using.

New 6.0 Example Use btn btn-theme to match the button color with the selected color scheme

Other overrides

CSS overrides Simple CSS tweaks that can be added and applied to the module. The code is minified automatically to be as small as possible.
Styles must be prefixed with #lnee_[your module id] in order to affect the module instance only.
Prefix styles with .lnee to affect all instances on the page.
Check the user stylesheets section for more information.

Example #te_23 .field { text-align: center; }

Related tutorials and topics