Customizing your short table

Once you have  uploaded your dataset into Datawrapper and selected the short table, you can customize the appearance. Let us show you how to make a beautiful chart in three simple steps.

This guide will walk you through the steps necessary to create a short table as seen above.

1

Refine

After clicking on the tab "Refine", you will see four panels.

Sorting

Here you can decide by which column the table should be sorted the first time your readers see it. Choose a column that will be either most helpful or  interesting to the reader. By default, the biggest value will be at the top. To bring the smallest values to the top, select "Sort ascending". 

You can also enable readers to sort the columns by themselves. To sort the table once it's embedded in your article, readers can click on the header to sort the column. A small triangle will indicate that this column is sorted.

For our chart, the panel looks like this:

Highlight rows

Here you can decide how big or small the typeface in your table should be – in all rows, or just in certain ones. To change the type size of all your rows, select "all" and click on the big A and small A buttons. 

If you want to just make the typeface in one row bigger or smaller to highlight this row, or if you want to make the type in this row bold, italic, underlined or the background shaded, then select a row and select the checkboxes:

Afterward, you can select another row to change its appearance. If you want to go back to the default setting, you will need to go through the rows with your change again and de-select them. 

For our chart, we won't do any changes in this panel.

Display

Here you can decide the color of the bars that you can display in all numeric columns (you can turn on these bars in the next tab). We choose red as a color. You can also decide if the bars should animate themselves when the readers see the bar for the first time. It's a subtle effect that makes the table look less static.

Display

In the last panel, we can make some rather self-explanatory design decisions: Should the table show a rank on the left-hand side? Do you want to stripe the table or hide the header row because the columns are self-explanatory? (Please note that your readers won't be able to sort the columns if you select this setting.) 

Also, you can decide how many rows should be displayed. The Short Table works best for 1-10 rows. If you have more rows, they will be hidden by default (readers can still "un-hide" them). To avoid this, you can increase the number in the setting "Hide rows after row number". 

Finally, you can replace country codes (e.g. :us:) with flag icons: Here you can decide to display little flag icons in the table. That only works if Datawrapper finds indicators like :us: in your data. Find more information about flag icons in tables in this article.

For our table, the last panel looks like this:

After working through the tab "Refine", we continue with the tab "Annotate":

2

Annotate

Describe chart

If you've created a Datawrapper chart or map before, you already know this feature. Here we can give your chart a title, a description, add notes and a source:

  • We recommend using the title to tell your readers what's interesting about this chart – the one key statement that you want to show on this chart, e.g. "Unemployment highest in the south"
  • The description should have as much information about the data as possible: What do we see exactly? E.g. "Unemployment rates in % in all US states, 2016"
  • Think of notes as footnotes, where we want to specify any abnormalities about your data. E.g. "California unemployment rates from Jan and Feb 2016 not included in the calculation."
  • The source name will give our readers information about how trustworthy our data is. Does it come from a government institution or another trustworthy organization? The source URL lets our reader dig even deeper and have a look at the underlying data themselves. Both, source name and source URL, should be filled out on every map to increase transparency. E.g. US Bureau of Labour Statistics, August 2017

Highlight elements

In the 2nd panel in the "Annotate" tab, we can decide which numeric values should be shown with mini-bar charts (you can choose their color in the "Refine" tab) and which text values should be shown in bold. To do so, select the columns you want to highlight. You can remove the elements with clicking on the "x" in the blue bars. 

After working through the tab "Annotate", there's only one tab left: "Design":

3

Design

In this last tab, you can select a preset layout and enable social sharing functions to spread your work. Click on " Publish" and you'll be directed to the "Publish & Embed" page.

The best way to use a Datawrapper chart is by embedding it directly in your website. To do that, click the big blue button that says " Embed chart on website". Then, copy & paste the embed code snippet into your website or CMS. You can also download your chart as a PNG or PDF by upgrading to a paid Single or Team account. Click here for more information on the different pricing plans of Datawrapper.

Still need help? Contact Us Contact Us