Rollover Image Link Macro Parameters and Key

Content Layer

name	Page Info
id	821023944
class	watermark-layer

Content Column

name	Page Body
width	100.00002%
id	821023946

Content Block

background-color	transparent
name	Prompt
rich-link-hovers	true
id	821023943
class	tight reference-prompt-flex

Rollover Image Link macro key and configuration options

Content Block

name	Key Title
id	596290343
class	tight-bottom reference-keytitle-flex

Key

Content Block

name	Key
id	596296580
class	tight reference-key-flex

HTML Wrap

tag	span
class	macro-key

rollover-image-link

Content Block

name	Reference
rich-link-hovers	true
id	1434454811
class	page-pattern-heading reference-reference-flex

Parameter	Description	Value(s)	Example(s)	Version
Image Location	defines a page where the images are attached; leave blank for the current page	page title	`Theme Press Macros` `PRESS:Theme Press Macros`
Image Filename	defines the complete filename of the image	filename	`my-picture.png`
Hover Image Filename	defines the complete filename of the hover image	filename	`my-hover-picture.png`
Tooltip	text that appears when hovering over the image	text string	`Theme Press Macro Help`
Open New Window	toggles the ability to open the button's link in a new browser window; ignored when targeting an HTML element	checkmark		2.0
Page Title	targets a Confluence page	page title	`Theme Press Macros` `PRESS:Theme Press Macros`
Web Address	targets a web address, email address or Confluence link action (excluding the base URL)	URL	`http://www.brikit.com` `mailto:bob@example.com` `logout.action` `display/help`
HTML Element	targets HTML elements on the page	CSS selector	`.some-page-action` `#some-page-action`
CSS ID	facilitates styling the image using a CSS ID attribute	CSS ID attribute	`my-css-id`
CSS Class	facilitates styling the image using one or more CSS class names (space-separated)	CSS class name(s)	`my-css-class01 my-css-class02`
Height	sets the height of the image	pixels	`600`
Width	sets the width of the image	pixels	`800`
Margin	creates space around the image's border	pixels	`20px 20px 20px 20px`
Alignment	places image (1) inline with, (2) to the right or left of or (3) in the center of surrounding content	plain left center right	`plain`
Accessible/SEO	adds heading-one text below the image to assist screen-readers and support search engine optimization	text string	`This is the logo for the Brikit Theme Press space`

Content Block

name	Info
rich-link-hovers	true
id	870649931
class	reference-info-flex
collapsible	collapse

Info

If using:

Replace me with something to note about the content on this page that falls outside the scope of the Reference section; and
Add the tight-bottom class to the Reference block above to narrow the gap between the two blocks.

Content Layer

background-color	$lightGrayColor
name	Related
id	1407948505

Content Column

name	Related
width	100%
id	1407948506

Content Block

rich-links-hide-description	true
rich-links-hide-site-name	false
rich-link-hovers	true
rich-links-columns	4
rich-links-vertical	true
rich-links-image-height	100px
rich-links-hide-site-icon	true
rich-links-details-padding	10px
name	Related
rich-links-enable	true
rich-links-details-alignment	left
rich-links-margin	20px 30px 0 0
id	833591344
class	related-block clean reference-related-flex

Replace me with a link

Aim for 4 or fewer related links. If we need more, that's okay. Be judicious. Delete me when you're done.

Rollover Image Link Macro

Page tree

Transform Your Digital Workplace

Industry Expertise

Inform Your Strategic Direction

Redefining Work

Documentation and Support

Versions Compared

Old Version 2

New Version 3

Key

Key

Platform

Company

Support

Brikit Services