Show Sidebar Hide Sidebar

Slide Decks

How to create slide decks with Chart Studio's drag-and-drop editor

Step 1


To facilitate effective communication of data in a presentation format, Chart Studio created Slide Decks - a minimalist drag-and-drop editor that feels like Keynote. With Slide Decks, you can easily create styled presentations with embedded interactive and dynamic Chart Studio charts, which can be hosted in your Chart Studio account and effortlessly shared via a link.

Step 2

Get Started

The Slide Deck Editor is a standalone desktop application that connects to your Chart Studio account. If you haven't already, download Slide Deck Editor.

Download For Mac

Step 3

Sign In

Once you have downloaded and installed the Slide Decks Editor, click 'SIGN IN TO PLOT.LY' situated in the top-right of the editor interface. In the pop-up modal enter your Chart Studio username and password.

Sign In Modal

Step 4

Use A Template

Plotly provides templates to help you start building your presentations. You view or download business, science, or research styled templates by visiting the dedicated template account - Slide Template. To continue with this tutorial, downlaod the example template.

Download Template

Preview Template

After you click download, a JSON formatted file will be download to your local machine. Next, open the Slide Deck Editor application and click 'File', 'Open', and then select the downloaded JSON file. Now, you ought to see something like the below image.

Downloaded Template

Step 5

Add Slides

After you have opened the template, have a flick through the current slides, then in the bottom left of the editor click duplicate on the last slide. This will create an additional and identical slide. If you have theme (i.e. set background or titles), then duplicating slides will save time.


Another option to add slides, is to click new, which will add a new blank slide.

New Slide

Step 6

Style Layout

To create a background for the slides, you have the option of full color or adding an image via URL or upload. To select full color, simply click on background color and then use the color picker or enter the HEX or rgba values.

Background Color

If you would like to use an image, simply paste the image URL into the text-box or click the 'Upload an image…' button to load an image from your local machine. Then, in the 'Background size' dropdown, select the image size.

Background Image

Step 7

Add Text

Now that the background is set, you can add text elements. First, a slide title or heading. To do so, click the text button located in the toolbar at the centre top. Now, click on the editable text that has appeared in the middle of the slide and enter you title. You'll notice that on the right-hand side of the screen a toolbox has appeared with styling options. Options that can be adjusted include paragraph style, font family, weight and size, color, and alignment.


Next, you can use the above method to add text blocks.


Another text feature available is the ability to add ordered or unordered lists. This can be done by clicking the un/ordered button situated bottom right of the screen.


Step 8

Add Charts

If you would like to add your Chart Studio charts to your slide deck, navigate to the top toolbar and click the Chart Studio button. On the right-hand side of the screen there you can simply paste the charts URL. Click here for more information about sharing and embedding Chart Studio charts.

Add Charts

Step 9

Add Images

To add an image, click the 'Image' button situated in the top toolbar. On the right-hand side of the screen, paste in the image URL or click the 'Upload an image…' button to load an image from your local machine. Once the image is added, you can drag and drop to size and position the image.

Add Image

Step 10

Add Code

If you would like to display your code in a presentation, click the CodePane button situated in the top toolbar. On right-hand side of the screen, select the language you wish to display, font size, and set the theme to either dark or light.

Add Code

Step 11

Save and Upload

When you're happy with your presentation, you can save and upload by clicking the upload icon in the top-left corner of the editor. Next, enter the name of your presentation, set the privacy, and click publish.

Save and Upload

Once you have successfully uploaded your presentation you ought to see the last synchronization date (like the image below).

Add Code

Step 12

Share Slide Decks

Now that you've completed and uploaded your presentation, sharing is as simple as clicking the share button in the top-left of the editor. Once clicked, a link to your presentation will be provided - click to view or copy to share.

Share Slide Decks