Introduction

The theme editor allows you to fully customize your users' experience when presenting articles with Presenter for Confluence

To get here either create or edit a theme in Admin > Presenter Options > Themes.


Basic options

Here you can define the basic properties of your theme. 

Properties

Name

Purpose

Create theme

Name

The name of your theme. It will be displayed when the user presents an article and can choose between different themes.

Description

A short description for your users (also displayed in the Presentation dialog). You can be specific about the purpose of the theme here, e.g. "Weekly Management Presentation for Controlling".

Composer

Logo

Upload a logo to let your users identify themes immediately by their logo. The logo will be displayed in the Presentation dialog.

Supported file types are .png and .jpg.

Custom Text

You can define a text that you can use in your theme, e.g. "Confidential" and display that on every slide in the footer (see the next section for how to do that).


Slide header and footer

You can activate custom header and footer elements that will overlay the presentation. This enables you to style your presentation like you would any other corporate presentation. There are several properties you can put in three slots per header or footer element. These properties will be dynamically inserted in your users' final presentation.

To activate the header and/or footer check the Activate Custom Slide-Header/Slide-Footer checkbox.

Three elements each can be defined for the header and footer: one on the left, one in the middle and one on the right.

If you feel like it you can style the header and footer with custom CSS later.

Properties

Name

Purpose

Empty (standard)

Nothingness. There will be nothing in the resulting presentation.

Logo

Displays the Logo you defined in Basic options.

Custom Text

Displays the Custom text you defined in Basic options.

Slide Title

Displays the current header in the defined slot.

Slide Number

Displays the current slide number (e.g. 3.1) in the defined slot.

Presenters Name

Displays the username of the current Confluence user.


Styling

Here you can choose a provided CSS theme as a base for your custom theme. On the left-hand, you have a handy carousel that helps you to quickly find the necessary CSS classes you want to override. And on the right-hand side, you find a quite powerful CSS editor with code completion, syntax highlighting, and some CSS linting rules.

CSS styling might seem intimidating at first. But once you got the hang of it, it's quite fun to play around with different styles. To get you started take a look at our tutorial: Create your first own theme ‍. If you need inspiration or just want to get going quickly browse our theme database and install the theme in your Confluence.

Choosing a base theme

To change your base theme Select a base theme > White. Base themes give you a handful of useful CSS styles which make your presentations look good out of the box. But usually, you want to customize your presentation to resemble your corporate identity as close as possible. This means you will have to write some CSS.

But don't worry most of the styling can be done by changing existing values. For reference (and copying CSS classes to change them) we included a style accordion on the left side. It shows all styles that the current base theme defines and is categorized so it's easier to find the right class to change. Take a look in the following section for detailed descriptions about the different style categories.

If you choose to start from scratch you can choose  Select a base theme > None. Only basic CSS for the header and footer elements will be loaded.

Style Categories

Name

Purpose

Slide-Header

Styles that apply and control the header element for your presentation.
These only apply when you activate the header or footer element.

General

This category mostly consists of basic styling for the html element and importing of custom fonts.

If you want to import custom fonts, take a look at our tutorial: Create your first own theme ‍

Global Styles

General styles like background color, fonts, font size.

Headers

Controls the style of headings (h1, ..., h6 elements)

Other

The styling for all kind of different elements from p-tags to code blocks.
(blue star)The base themes do quite a lot in here. Be sure to check it out.

Links

Colors, decorations and hover effects for a-tags (links)

Images

Controls how images will be displayed in your presentation.

Navigation Controls

Styles the navigation cross in the bottom right of your presentation.

If you don't like the navigations controls, you can deactivate them in the next section (Presentation Options).

Progress Bar

The styling of the progress bar that indicates (as the name suggests) the progress of the presentation.
If you don't like the progress bar, you can deactivate it in the next section (Presentation Options).

Print Background

Styles the print view which is used to generate PDFs in the Presentation dialog.

Slide-Footer

Styles that apply and control the footer element for your presentation.
These only apply when you activate the header or footer element.


Presentation Options

These options let you customize how the final slides will be presented. These options range from enabling/disabling the navigation controls or the progress bar to the slide transition speed (aka how long the next slide animation takes).

These options are overridable by the user when he selects your theme in the Presentation dialog. You should still give your users sane defaults for these options so that the need to override them is minimal.

Tools

Name

Purpose

Display controls in the bottom right corner

Enables/disables navigation controls

Display a presentation progress bar

Enables/disables progress bar

Enable slide navigation via mouse wheel

Enables/disables navigation via mouse wheel

Display the page number of the current slide

Enables/disables slide number in the bottom right of the presentation.
(blue star)This feature will be deprecated by the header/footer slot property: Slide number

Behaviour

Name

Purpose

Transitions

You can choose between different styles of next slide animations:

  • None → No animation

  • Fade → The content of the slide fades over to the next one

  • Slide → The content of the slide is pushed out by the next one

  • Convex → The content rotates in a convex animation to the next slide

  • Concave → The content rotates in a concave animation to the next slide

  • Zoom → Zooming to the next slide

Transition speed

Controls the speed in which the Transition animation is played.

Loop the presentation

Restarts the presentation when you reach the end.

Layout

Name

Purpose

Respect column layout

BETA You can choose to let your users use Confluence column layouts.
With this option activated you can e.g. put an image in the left column and text in the right column and we will show them side by side.

Center slides vertically

Controls whether the main content of your slides will be vertically centered (aka in the middle) or at the top of the slide.

Autoplay

This set of options is especially useful if you want your presentation to play automatically in the background.

Name

Purpose

Enable automatic advancement

Enables automatic progression through your presentation without the need to press a button or use the mouse.

Stoppable

Allows your users to stop the presentation with Enter or by clicking the pause button in the bottom left corner.

Interval (in seconds)

Controls how long a slide will be shown.


Save & Apply

After customizing your theme don't forget to Save it.  

During the development of your theme, you can use Apply. This will save the theme but won't exit the Theme editor. After applying your changes to the theme you can refresh your open presentation and we will regenerate the presentation with the saved changes. 

(blue star)Use this shortcut to save even faster: cmd + s (on Mac) or ctrl + s (on Windows).


Next: Read how to start your presentation and discover helpful shortcuts with our Presenting guide.