---
title: "Call to Action Element"
date: 2026-07-24
author: "Claude MCP"
---

# Call to Action Element

**Call to Action Element** is only available in the PRO version.  
Unlock this and other features by upgrading to **Joomill YOOtheme Elements PRO**

 The Call to Action element combines a title, meta text, description, image or icon, and a link into a single promotional block, useful for a single highlighted panel rather than a full grid of items.

 In the YOOtheme Builder, open the element picker and look for the **Joomill Extensions** group of elements, then select **Call to Action**.

 
## Content tab

 
|  |  |
| --- | --- |
| Title | The main heading. |
| Meta | Small text shown above or below the title or content, for example a category or date. |
| Content | The description text. Supports rich text formatting. |
| Image / Image Alt | An optional image for the block. |
| Icon | An icon from the icon library, used instead of an image. |
| Link / Link Text / Link ARIA Label | The link or button, its text, and an accessibility label for when the link has no visible text. |

 
## Settings tab

 
|  |  |
| --- | --- |
| Panel Style / Link Panel / Hover Style / Padding / Image Without Padding / HTML Element | Give the whole block a boxed or tile background, and optionally make the entire panel clickable. |
| Height / Image Height | Expand the block to fill the available column height, and optionally expand the image along with it. |
| Title Style / Link Title / Hover Style / Decoration / Font / Color / HTML Element / Margin Top / Margin Bottom | Style the title and optionally link it. |
| Meta Style / Color / Alignment (above/below title or content) / HTML Element / Margin Top / Margin Bottom | Style the meta text and choose where it appears relative to the title and content. |
| Content Style / Force Left Alignment / Drop Cap / Columns / Column Divider / Columns Breakpoint / Margin Top / Margin Bottom | Style the description text and optionally split it into columns. |
| Image/Icon Width/Height / Focal Point / Loading / Border / Box Shadow / Box Decoration (+ Inverse) / Link Image / Hover Transition (+ Border) / Hover Box Shadow / Position (top/left) / Grid Width / Column Gap / Row Gap / Breakpoint / Vertical Alignment / Inline SVG / Animate Strokes / SVG Color / Text Color | Size, position and style the image or icon. |
| Link Attributes / Download / Nofollow / Noreferrer / Style / Button Size / Full width button / Margin Top / Alignment (bottom/right) / Column Gap / Row Gap / Breakpoint | Style the link or button and set where it sits relative to the content. |
| Position, Margin, Max Width, Alignment, Text Alignment, Animation, Visibility | The usual layout options shared by all Builder elements. |
| CSS | Custom CSS for this element. Selectors `.el-element`, `.el-title`, `.el-meta`, `.el-content`, `.el-image` and `.el-link` are prefixed automatically. |