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

Leave a review
Information
Print

Module: theming

Information
Trombinoscope Contacts
Theme The overall look of a contact card
  Original
The default look.
Picture Background theme v3.0 Picture Background
A background image is used to cover a portion of the card
Picture Slide theme Picture Slide in 3.0 Slide Blind
Contact information is hidden and revealed when hovering on top of the contact picture
Theme 1 Removed in 3.0 Theme 1
Floating icons show on top of the card. Field 2 and over are slightly moved to the right
Download more themes Download more themes

Theme overrides

Tweak the themes with a few additional options.

Style Social Links Add the official color to social icons (e.g. blue for Facebook...), overriding the icon color
Card
Background image Card background image (has precedence over the background color overrides)
Background color Card background color (overrides the theme’s background color)
Leave blank to keep the theme’s original color
Background color 2 2nd background color to create gradients.
Leave blank to keep the theme’s original 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
Border radius The card border radius
Border width The card border width
Border color The card border color
Font The font to use for the card.

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 reference The font size the whole card is based on (in pixels)
Font color The overall text color
Leave blank to keep the theme’s original color
Line spacing The line height for all fields
Fields
Icon font size The icon font size (in em). Relative to the font size reference
Icon font color Choose the icon color to use
Icon font background color The background color of the icon
Label width Possible label width to allow all labels to have the same size (in pixels) so that information remains aligned
A value of 0 will show information immediately following the label
Label color The color of the label
Label background color The background color of the label
Links
Links position The position of the links on the card.
  • Bottom
  • Side
  • Top
Icon font size The icon font size (in em). Relative to the font size of the card
Icon font color The color of the icon
Icon font background color The background color of the icon
Other
Additional CSS An easy way to include additional styles

Example .te_23 .field { text-align: center; } where 23 is the module id

Related tutorials and topics

Featured Blogs