Tips and Tricks for Confluence

An ongoing list of useful things you can do in Confluence!

CONTENTS

Embedding Files From Google Drive

  1. Paste your link

  2. Change to fully embedded preview

This type of preview is fully interactable (you can edit the embedded doc within the page) and you can also click the blue text at the top to directly open google drive!

We used to recommend the “Widget Connector” but this is no longer the best. As Confluence updates this may change again, but for now the above is the best option.

Using Iframes

Confluence has awesome widgets to integrate nearly anything cleanly into a Confluence page (you can find these via inline / commands or the + at the top of the editing window). Sometimes these cannot handle everything however.

Iframes are a common tool used in web development to insert a window from one website into a “mini-browser” view of another. These can be used in Confluence to open just about any website when cleaner integrations don’t work.

This is a lot closer to editing the page in raw HTML/CSS, so do note it will look uglier and should be avoided when possible

One example of needing to use Iframes is for Google Calendar previews! Check out https://nerdocs.atlassian.net/wiki/spaces/NER/pages/6619279

Embedding Draw.io Diagrams

Embedding draw.io diagrams natively is an add-on feature for confluence we do not have. However, there is a way around that using iframes. This will still update as you edit the draw.io, just dont change the folder location and it should work OK.

How to add a draw.io diagram:

  1. Go to the draw.io on google drive and click share, make it “Anyone with the link can view”

  2. Open the draw.io diagram in draw.io

  3. Go to File → Publish, and click create and copy the link

  4. Go to File → Embed, IFrame, and take note of the “height” parameter. No need to click create here

  5. Go to confluence page and edit it, then use /iframe to add an IFrame. Edit the IFrame

  6. Enter the URL you originally copied from draw.io

  7. Make Width → 100%, Align → Top, frameborder → hide, Scrolling → yes, and check off allow fullscreen

  8. Scroll back up and enter the height you found in step 4. Now look at the page in edit mode and change the height and width as you need to make it easily viewable. This is not going to look too good on mobile but eh better than nothing.

Deep Linking to Slack

This method works for now

Linking to a person: https://nu-electric-racing.slack.com/team/{User ID}

For example: https://nu-electric-racing.slack.com/team/U0180PW1RDF

 

Slack allows for linking to its application and even specific parts within the app via a specially formatted link. Their full documentation of this feature is here: Deep Linking

Linking to the NER Workspace

The general format:

slack://open?team={TEAM_ID}

Plugging in our workspace/team ID:

slack://open?team=T7MHAQ5TL

Linking to a Channel

The general format:

slack://channel?team={TEAM_ID}&id={CHANNEL_ID}

Using #electrical as an example:

slack://channel?team=T7MHAQ5TL&id={CHANNEL_ID}

Finding a channel ID

Desktop App

  1. Click the channel name for more details

  2. Scroll to the bottom for the ID

In-Browser

Just look at the URL!

Mobile App

  1. Long press the channel and copy link

  2. The channel ID can be found as described above

Linking to a Person’s DMs

The general format:

slack://user?team={TEAM_ID}&id={USER_ID}

Using Matt as an example:

slack://user?team=T7MHAQ5TL&id=UNCFTKUAV

Finding a user ID

Desktop-App & Browser

  1. Open Profile of the user

  2. Click the button with 3 dots

  3. Copy member ID

Mobile App

Cry