What is UI Image?

A UI Image is a macro to display images with a tagline banner banner, that dynamically adjusts to the width of the page.

Live Example

RefinedTheme add Structure

RefinedTheme adds levels to Confluence

Using UI Image

To add the UI Image macro to a page

In the Confluence editor, choose Insert > Other Macros.

Find and select the required macro.


Speed up macro entry with autocomplete: Type { at the beginning of the macro name, to see a list of suggested macros.


To edit an existing macro

Click the macro placeholder and choose Edit.

A macro dialog window will open, where you can edit the parameters of the macro.

Wiki Markup

{ui-image:title=My tagline|imageUrl=http://confluence.refinedwiki.com/download/attachments/327707/intranet_welcome.jpg}

 

Parameters

ParameterDefaultDescriptionVersion
Tagline (title) A title/tagline.1.1

Image URL

(imageUrl)
 E.g. http://www.yourdomain.com/image.png1.1

Width (width)

100%

The width of the image in percent or pixels. E.g. 920px or 50%.

1.1
Height (height)250px

The height of the image.

1.1

Text Background (textBackground)

black

Choose a text background: black transparent or white transparent

1.1

 

Examples

Welcome!

Welcome to San Francisco!