Any image or text file can be uploaded to the ThemeBuilder Resources, and is then available to a skin using the resource notation.
Note the double colon between the skin and file name :: . This tells
ThemeBuilder to look in its own resources for the file.
Once a resource has been uploaded you can perform actions on it to manage that resource. The actions will differ depending on the type of resource.
Note: Text includes CSS, JS etc. You must use the 'Save' button in the Skin Editor after changing any text file in the Resources screen.
|Image||Hover to View in popup|
|Image, Text||Click to Open browser|
(or right click to copy image url)
|Image, Text||Click to Delete|
|Text||Hover to Preview contents|
|Text||Click to Open in simple text editor|
See the Image macro for how to use an image in a ThemeBuilder panel or Confluence page.
Image resources can be used in the ThemeBuilder CSS screen for background images. The code is added with the url in resource notation.
Add a background image to a HTML div in a panel or page.
Image in Resource screen
Div Added to Panel
In your ThemeBuilder skin panel, add this to create the element the CSS will be applied to:
Div Added to Page
You will need the Content Formatting plugin installed to add HTML div's to a page. Use the macro browser to add a 'div' with the class 'my-background'.
The image is added as a background to the div.
See Skin Editor - HTML for an example of how to reference a CSS or JS resource file.
You will need to click the 'Save' button to apply any changes made in the 'Resource' screen.