Linking content in draw.io diagrams

Using the link editor

The path to linking content is the same in Confluence Server and Cloud. Just follow these three simple steps:

1. Double click on the diagram on your Confluence page to open the diagram editor.
2. Right-click the shape you want to create a link for.
3. In the menu, select Edit Link.

For each of the link types, you will need to repeat the steps above.

Link to other draw.io diagrams

The usecase that people ask for the most is linking a shape to other draw.io diagrams. This can be the case in complex process flowcharts for example, where specific shapes do have a workflow of their own that you like to go into detail elsewhere. All you need to know is the name of the diagram that you like to link to. Type in the name in the search window and click Link. Once you saved the diagram and click on the shape, the linked diagram will open in a lightbox.

Use the universal search to link to any content

You can use the universal search to link to any content (this can be diagrams, pages or attachments) within Confluence.

In the Link Edit menu choose Search and begin your search query by typing in the search field.  Then using the pull-down menu on the right of the search field, you also have the option to specify a Confluence space to search within if you don’t want to search all spaces. Please note that the search follows Confluence permissions. This means that you can only link to content that you have been given permission to view.

Linking to external content

Choose Web Link and simply insert the URL you would like that shape to link to and click apply. You are now able to click on the shape (the URL opens in a new browser tab) and have it take you to the URL you chose.

Linking to another page within your diagram

draw.io allows you create multiple pages within your diagram. Linking these pages to a shape is pretty easy. To do this, choose Diagram Content from the link editor menu.  You should see a list of all of the pages within your diagram.  Select the page you’d like the shape to link to and apply.

Linking to Confluence headers

Being able to link to headers of specific content within your page can be very useful. In this example, the link will take you to a specific paragraph within your Confluence page.  In order to use this feature you need to assign text formats to the paragraph headers (in this example we chose Header 1 to Header 3). When you open the link editor menu and select Page Content you now see the listing of all defined headers (see image on the right).

Please note that you can only link to text content that is on the same Confluence page as the draw.io diagram that you are linking from.

Linking to attachments

If you have attachments saved to your Confluence instance you can also link to them to draw.io shapes.  In the Link Editor menu select Attachments, and you will see a list of the available attachments. Choose the one you want to link and apply.

Per default you will only be able to view the attachments of the particular Confluence page that hosts the draw.io diagram. If you like to link to an attachment from another page please use the universal search (see above) to find and link it.

Linking Recently viewed Confluence pages

You may want to refer your readers to other pages you recently edited or created within your Confluence instance and to link to them. Select Recently Viewed and you’ll get a selection of your most recently viewed pages.

Linking to internal or external URLs

Choose Web Link and simply insert the URL you would like that shape to link to and click apply. You are now able to click on the shape and have it take you to the URL you chose (the URL opens in a new browser tab). This can be a Confluence page or an external URL.

Linking to another page within your diagram

Just as for Server, draw.io for Confluence Cloud also allows you to create multiple pages within your diagram. To link a shape to one of these pages, choose the middle section of the link editor menu (see image on the right).  The drop down menu shows a list of all available pages that you can link to. Select the page you’d like the shape to link to and apply.

Linking to text anchors

The third option in draw.io for Confluence Cloud is to link shapes to text anchors on the Confluence page the draw.io diagram is added to. First you have to set the headers (see screenshot on the right) for the text content. Afterwards just copy the header from the Confluence page, go to the linking menu and paste the text under Confluence Page Anchor.

Linking to attachments

You can link draw.io shapes to all of your Confluence attachments.  In the Link Editor menu select Attachments to see a list of the available attachments. Choose the one you want to link and apply.