Embedding Multimedia Content

Using multimedia files you can display movies, animations and videos, and embed audio files on your Confluence page. Below we show you how to attach a multimedia file to a Confluence page and then display the multimedia content on the same page or on another Confluence page.

In the example below, we display a Flash file that is attached to this page.

What you need to type	What you will get
Unknown macro: {nomarkup}

Confluence supports the following multimedia formats:

Adobe Flash (.swf)
Apple QuickTime (.mov)
Windows Media (.wma, .wmv)
Real Media (.rm, .ram)
MP3 and MP4 files (.mp3, .mp4)
MPEG files (.mpeg, .mpg)
AVI files (.avi) You may need to enable an avi decoder within your browser.

If you are using wiki markup, you can display other types of multimedia in addition to those listed above. You may need to specify the 'classid', 'codebase' and 'pluginspage' properties so that your web browser can recognise the file type, as described below.

On this page:

Quick guide to displaying multimedia content on a page

Choose one of these methods:

Drag and drop: Drop the video or other file into the Rich Text Editor. Confluence will attach the file and insert the Multimedia macro for you.
Autocomplete: Attach the multimedia file to the page in the usual way. Type '!' into the Rich Text Editor and use the autocomplete feature to add the Multimedia macro.
Add the macro yourself: Attach the multimedia file to the page in the usual way. Add the Multimedia macro via the macro browser or wiki markup.
Adjust parameters if necessary: Use the macro parameters to set various options, such as adjusting the width or height of the display, or setting autoplay on.
Non-standard formats: Use the wiki markup image format for advanced usage.

Using Drag and Drop to Embed a Multimedia File on a Page

You can drag and drop the video or other file into the Rich Text Editor. Confluence will attach the file and insert the Multimedia macro onto the page for you.

To embed a video, audio or other multimedia file on a page:

Edit the page in the Rich Text Editor.
Find the multimedia file on your computer or file system.
Click the multimedia file, hold your mouse button down and drag the file into the Rich Text Editor window.
Release the mouse button to drop the file in the required location on the page. Confluence will attach the file and insert the Multimedia macro onto the page.
If necessary, use the macro parameters to set various options such as the width, height or autoplay:
- Click the macro code in the Rich Text Editor.
- Click the Macro Browser icon in the toolbar.
- Set the parameters as required. See below.

For information on the requirements of the drag-and-drop feature, and how to enable it, see Using Drag-and-Drop in Confluence.

Using Autocomplete or the Macro Browser to Embed a Multimedia File on a Page

Attaching the File to the Page

If you have not already done so, attach the multimedia file to a Confluence page in the usual way. See Attaching Files to a Page. You can attach the file to the same page where you want to display its content, or to another page in the same Confluence site.

Using Autocomplete

When using the Rich Text Editor, you can enter a trigger character or press a keyboard shortcut to call up a list of suggested videos, audio files and other multimedia files to add to your page. This feature is called 'autocomplete'. Autocomplete provides you with a fast editing solution if you prefer to use key strokes rather than pointing and clicking with the mouse.

Quick summary of autocomplete: Use '!' or Ctrl+Shift+M to see a list of suggested videos, audio files or other multimedia files. The list will also include any relevant images or documents.

For details see Using Autocomplete in the Rich Text Editor.

Using the Multimedia Macro

Use the Multimedia macro to display the movie or other multimedia content of the file.

To insert the Multimedia macro into a page using the Macro Browser:

Open the Confluence page or blog post that you want to edit, then click the 'Edit' button.
Click the Macro Browser icon on the toolbar. The macro browser window will open.
Scroll through the list of macros to find the one you want. Alternatively, start typing the macro name into the search box at the top right of the macro browser. Macros with a matching name will appear in the main pane.
Click the desired macro.
Set the macro parameters to your requirements. If desired, you can preview these changes by clicking 'Refresh'.
Click 'Insert' to add the macro onto the page.

You can also insert macros via autocomplete. For more information, see Using Autocomplete in the Rich Text Editor.

Macro Parameters

Parameters are options that you can include in Confluence macros to control the content or format of the macro output. The table below lists relevant parameters for this macro.

Parameter names are different in the macro browser and in wiki markup. Below we show the macro browser parameter names in bold text, and the equivalent wiki markup parameters in (bracketed) text. If we do not show any parameter name for the wiki markup, then you should leave out the parameter name and simply include the parameter value as the first parameter, immediately after the colon (:).

Parameter	Required?	Default	Description
Page Name (`page` and optionally `space`)	No	Current page	Name of the page to which the multimedia file is attached. If you are using the Macro Browser, just start typing the name of the page and then select it from the dropdown list that appears. The page can be in the same space or another space.
Attachment (`name`)	Yes	None	File name of the multimedia file.
Width (`width`)	No	If not specified, the browser will determine the width based on the file type.	Width of the movie window to be displayed on the page. By default, this value is specified in pixels. You can also choose to specify a percentage of the window's width, or any other value accepted by HTML.
Height (`height`)	No	If not specified, the browser will determine the height based on the file type.	Height of the movie window to be displayed on the page. By default, this value is specified in pixels. You can also choose to specify a percentage of the window's height, or any other value accepted by HTML.
Autoplay (`autostart`)	No	False	If this option is checked (that is, if the parameter is set to 'true') then the video or audio file will start playing as soon as the page is loaded. If this option is not checked (set to 'false') then the file will not play until the user clicks the icon or image on the page. See the note about autoplay below.

Examples

In this example, the multimedia file is called movie.avi and is attached to the page that contains the Multimedia macro:

{multimedia:name=movie.avi|width=500|height=400}

In this example, we instruct the browser to start playing the movie as soon as the page is loaded (autoplay):

{multimedia:name=movie.avi|width=500|height=400|autostart=true}

See the note about autoplay below.

In this example, the multimedia file is attached to a page named 'My movie':

{multimedia:page=My movie|name=movie.avi|width=500|height=400}

In this example, the multimedia file is attached to a page named 'My movie' in a space with a space key of 'CHOC':

{multimedia:page=My movie|name=movie.avi|width=500|height=400|space=CHOC}

Using the Wiki Markup Image Format Instead of the Multimedia Macro

Note: The use of this format is now deprecated. We encourage you to use the Multimedia macro instead, as described above.

In some cases, you may want to use the wiki markup image format to display your multimedia file. This is useful for advanced formatting. For example, the image format allows you to display other types of multimedia in addition to those listed above. You may need to specify the 'classid', 'codebase' and 'pluginspage' properties so that your web browser can recognise the file type.

Basic Usage of the Wiki Markup Image Format

Let's assume you want to display a movie that has a filename of filename.mov. Include the following markup in your page:

!filename.mov!

Specifying File Type and Other Properties

Define the properties of the embedded object using a comma-separated list of properties. For example:

!filename.mov|height=800,width=600,id=media!

If the file does not have a meaningful extension, specify the MIME type like this:

!filename|type=image/jpeg!

To play .avi files, you need to specify the dimensions and type. For example, to play a test.avi file:

!test.avi|height=200,width=200,id=media!

Notes

The multimedia file must be attached to a Confluence page. For security reasons, files located on remote servers are not permitted. See the Widget Connector for displaying live content from external sites.

You will need the relevant multimedia plugin for your browser. Your browser (Firefox, Internet Explorer, Safari and others) needs a plugin to play the video or audio file on a Confluence page. For example, to play a Flash movie you need the Flash plugin. Many plugins are shipped with the major browsers by default. If a user does not have the required plugin installed and enabled in their browser, they will not be able to view the multimedia files on the page.

Autoplay may not always work as expected. You can set autoplay on, so that your video or audio file should start playing as soon as the page is loaded into the browser. (See parameters.) However, this setting may not always work as expected. Confluence will send an instruction to the browser plugin that plays the multimedia file. Different browsers and different media plugins behave in different ways, and not all of them respect such instructions.

Use the Office Connector to display Office documents. Take a look at the Office Connector for embedding Word documents, presentations and other Office documents onto your Confluence page.

If you get the error, 'Unable to embed content of type application/octet-stream', this means the MIME type is not recognised. You can add a type parameter to the macro code to override the automatically detected MIME type. See above for an example.

Advanced users can try styling via CSS. By default, each embedded object is wrapped in a div tag. If you wish to style the div and its contents, override the embeddedObject CSS class. Specifying an ID as a property also allows you to style different embedded objects differently. CSS class names in the format embeddedObject-ID are used.

Using the wiki markup image format instead of the Multimedia macro is deprecated. The use of the '!' tags for multimedia content is now deprecated. We encourage you to use the Multimedia macro instead, as described above.

Child pages