• Products
  • Documentation
  • Resources

Display files and images

When you upload files to Confluence, you can display them on the page as either a thumbnail or a link.

You can control how the file appears on your page. The options available depend on the type of file. 

To upload a file, you'll need the Add Attachments space permission. Without this permission, the relevant option in the editing toolbar will not appear.


Pages on your site may use the new editor or the legacy editor. This page explains how to use both editors.

Use these links to jump to the section detailing the editor you use:

 

Which editor does your page use?

You can see which editor your page uses by looking at the differences in the editor toolbar.

  • The New editor: Includes Publish… or Update and Close buttons in the top menu and the emoji icon

  • The Legacy editor: Has earlier versions of text-color picker and page formatting

New editor
ConfluenceCloud_NewEditor_Toolbar
Legacy editor
Image highlights the unique tools that make the toolbar in the legacy editor different than the one in the new editor

New editor

This section provides the details for displaying files and images using the new editor.

Insert a file, image, or video into your page

Images and videos

Inserting a file or image into the page also adds it as an attachment.

To insert an image or video into a page while editing:

  • Drag the file directly onto the page.

  • Select the Add image, video, or file button from the main toolbar.

  • Type /files or /images, select Image, video, or file.

After an image or video is inserted, you can:

  • Resize it by dragging the handles on either side.

  • Set its width or height in pixels by entering a value in the toolbar.

When you select an uploaded image or video, a floating toolbar appears. You can use this toolbar to: 

A selected image and the floating media toolbar
  • Add a caption — Add more information about the image or video. The text size and alignment can't be changed, but you can apply other formatting.

  • Border options — Add borders and change their color and size.

  • Image alignment — Determine how the image or video is aligned on the page and how the text should flow around your image or video.

  • Inline (images only) — Display the image or video within the text.

  • Original size (images only) — Display the image as a separate block element.

  • Width and Height — Set the width or height of an image or video.

  • Add/view comment — Add or view comments on an image or video.

  • Link (images only) — Add a link to a Confluence page or an external URL.

  • Preview (images only) — Preview the image full size while editing.

  • Edit alt text — Add supplemental text accompanying an image or video for all users. Alt text can help add more context and meaning to the image or video and can be very effective in assisting people of all types to understand the image or video better.

If you delete an image from a page, you will need to upload it again to add it back. You cannot add an image from the Attachments view in the new editor.

Files

When you insert a file into a page, it will appear as an inline tile or a thumbnail. You can use the floating toolbar to control the following:

A selected file with the floating file toolbar
  • Change view — Display the file inline or as a thumbnail.

  • Preview — Open the file in viewer mode.

  • Download — Download the file to your computer or device.

Delete files from your page

You can delete a file in a few ways when editing a page:

  • Select the  icon in the floating toolbar for an image

  • Select the X icon or the Delete key when focused on a file

If you delete a file or image in the editor, the attached file isn't deleted. 

To completely remove the file from a page:

  • Go to ••• > Attachments when viewing a page and select Delete.

Seeing a failed to load placeholder on your page? That means the attached file has been deleted from the page (or another page).

Legacy editor

This section provides the details for displaying files and images using the legacy editor.

Insert a file or image into your page

There are a few ways to insert a file into your page:

  • Go to Insert > Files from the editor toolbar and select any of the previously uploaded files.

  • Drag the file directly into the editor to upload and insert it in a single step.

  • Type ! and choose an attached file from the autocomplete dropdown.

The file will appear on the page as a thumbnail. Tap the thumbnail to resize it or to display it as a link instead. 

Insert a file attached to another page

You can display a file that's attached to a different page of the same Confluence site, if you know the name of the file.

This is only possible in the legacy editor. The new editor doesn't support this functionality.

To display an image attached to a different page:

  1. Go to Insert > Files and choose the Search on other pages.

  2. Enter the name of the file.

  3. Choose whether to search the current space or All Spaces and choose Search.

  4. Select the file from the search results and choose Insert.

Insert an image file from the web

You can display an image from a remote web page on your Confluence page, without needing to attach it to your page. You need to know the URL for the image, not for the web page it appears on.  This is only available for image files, not other types of files (like documents). 

To display an image from a web page:

  1. Choose Insert > Files, and choose Images from the web.

  2. Enter a URL for the image (for example, http://atlassian.wpengine.netdna-cdn.com/wp-content/uploads/AtlassianBushRegeneration-12January2012-083-trunc.jpg).

  3. Choose Preview to check that the URL and image are correct.

  4. Tap Insert.

Delete files from your page 

If you delete a file or image in the editor, the attached file isn't deleted.  When viewing the page, go to ••• > Attachments to delete the attachment completely from the page.

Seeing an unknown attachment placeholder on your page? That means the attached file has been deleted from the page (or another page).

Preview a file

To preview a file, click on the image, thumbnail, or link while viewing the page.

You can preview any file that's displayed on the page, including images from the web, as well as files that are attached to the page but not displayed.

In the preview you can:

  • Download the image file.

  • Upload a new version of the file (attached files only).

  • Comment on the file.

  • Zoom in and out, or fit the image to the width of your browser.

  • Browse like a slideshow using the next and back buttons.

  • See other files attached to the page and select a thumbnail to preview that file.

  • Switch to a full screen presentation mode.

You can preview a wide variety of file types, including Office files, PDFs, audio and video files, and most image types.

The image above shows a few of the ways you can interact with the image preview:

  1. See more files: view other files attached to the same page.

  2. Manage this file: download the file, upload a new version, or share it with your team.

  3. Add a comment: drag the pin onto the preview to add a comment.

Show a list of files on a page

There are several ways you can display a list of files on a page.  You can:

You can also use the File List blueprint for uploading, viewing and managing lists of files. 

Displayable file types

This section provides information about the types of files you can display on a Confluence Cloud page. For a list of all file types you can upload, see Accepted file types and size.

Office and PDF files

Inserting a file in a page is a great way to make useful documents, spreadsheets, presentations and other files available to your team. 

As with all file types, you can insert the file as a link or as a thumbnail. Thumbnails let readers preview the file's contents. You can resize thumbnails or add a border to offset them from the rest of the page.

To view Office files or PDFs, click the link or thumbnail for a preview (no need to install Excel, Word, or PowerPoint installed). Once you're in the preview, you can download the file to view it offline. 

As with other file types, you can view Office files and PDFs in Confluence or comment on them to discuss them with your team.

Image files

When editing the page, select an image to show the image properties panel. The panel allows you to set the display size, add a border, and link the image to a Confluence page or other URL. 

From the image properties panel you can:

  • Enter a width for the image.

  • Choose one of 3 preset sizes for the image, or set it to its original size.

  • Add a border around the image.

  • Link the image to a page or URL.

  • Add a title, which is shown when you hover over the image (go to Properties > Title).

  • Add alt text, which is used by screen readers and when the image can't be displayed (go to Properties > Title).

Displayable image files:

File type

Extension

Media Type

Microsoft Windows Bitmap

.bmp

image

Dicom

.dcm

image

Graphics Interchange Format

.gif

image

High Efficiency Image File Format

.heif, .heic

image

JPEG

.jpg, .jpeg

image

Portable Network Graphics

.png

image

Photoshop

.psd

image

Tagged Image File Format

.tif, .tiff

image

Multimedia files

The file preview also supports audio and video files. It uses HTML5 to play attached audio and video files. This means the file types people can play in the preview depends on the audio and video formats their browser supports.

As with all file types, when you insert an audio or video file you'll have the option to display it as a thumbnail or as a link on your page.

You can also embed audio and video files (to play within the page) using the Multimedia Macro

Display online video (such as YouTube or Vimeo videos) using the Widget Connector Macro.

Still need help?

The Atlassian Community is here for you.