Emails and Reports
If you would like to send reports that you will send to people via email, and you would like for them to get full HTML rendered email reports in their inbox, then this is the option you should choose. If you have ever used an email marketing creation tool, such as Mailchimp or Sendgrid (or any other email creation tool*), then building an email report should be very familiar.
Some use cases when to use email reports:
- Emailing periodic data reports to internal teams for informational purposes (e.g. monthly/weekly performance reports).
- Sending data reports to outside customers directly from your DB (e.g. usage reports, status reports).
* Other tools might include: ActiveCampaign, GetResponse, MailerLite, Benchmark, Sendinblue, ConvertKit, Newsletter2Go, Omnisend
Creating a new report
You can create a new data report by going to the Report section and clicking the “Create Email” button at the top right, or you can create a report from your homepage by hovering on the report tile and clicking “Create new”. When you’ve created your new report, you will start with a blank canvas, after which you can start dragging and dropping elements from the left menu in order to build your report. (check out the section on Building reports and emails for more information on blocks).
Creating a new email report
You can create a new email data report by going to the Email section and clicking the “Create Email” button at the top right, or you can create an email report from your homepage by hovering on the email tile and clicking “Create new”. When creating a new email report you will need to select a layout template for the email. Once you have selected the template, you can add or remove the predefined blocks in the email template and style the document to your liking.
Building reports and emails
Building a report is done by drag and dropping blocks. A block is a component that might contain one or several elements. In the panel your left, under the “Blocks” tab you can find a list of all the blocks you can drag to build up your report. For example you have a header block to add a header to your report which includes a title, subtitle and an image.
Adding blocks
The following steps show you how to add blocks to your report.
Step 1: Select a block on the Blocks menu
Step 2: Drag the block to the report canvas.
Step 3: Release to add the block to the report
From there you can drop different report blocks such as a title, subsection, paragraph and image. Simply select a block and then hover over your existing blocks to place it before or after a particular blocks.
Your report will not be a data report until you add in some data visualisations. In the block you can find different layouts for adding a visualisation to your document. For example you can add in a large visualisation that will take the full width of your document, or you can add in two visualisation side by side.
Styling blocks and elements
You can style your blocks and element in any way you want by using the styling panel. Simply hover over the element in your report and select the particular element you want to style. Once selected a Style panel will activate for that element which allows you to style the dimensions, typography and visual style of an element (for example its background color, borders etc.). On the Style panel you can also click on the “Delete” element to remove a particular element from a block.
You will notice that hovering over each block has a number of buttons on the right side of the selected block. You can use these to either move, delete, duplicate, or edit a block.
Editing a block means you can edit the HTML code from which this block is made. For advanced styling or for creating your own types of blocks, you can apply your own custom HTML using inline CSS to style the particular elements from the block.
The picture below shows you where you can edit the HTML of a block.
As you write your HTML you will see the changes appear in your report. You can also add in visualisation elements in your HTML by using the custom <metric> tag. You will need to add a width and a height to this element in order to appear on your document.
Metric code example:
<metric style=”width: 100%; height: 400px”></metric>
Once you’ve saved and closed your HTML editor you can add in a query and a visualisation to your visualisation element (for more on that see the “Making queries” and “Visualising your data” sections).
Adding images
Image elements allow you to add images and icons to your report. When selecting an image element you will notice an additional “Set image” button on the Style sidebar.
When you click on it you can either choose to upload your image, or you can choose from a predefined icon set of images.
Print options
In reports, you can specify certain print related options. The print related options are found in the “Settings” tab on the left hand panel. First you can set the width of your document to a standard width (800px) or an A3 or A4 format. Additionally you can set a margin for your document.
Page breaks
Reports can be used as both documents and embeddable widgets. If you want to have a document, with multiple pages we do allow a way to specify where the page breaks should be. This process is manual, so you would be responsible to make sure that the blocks you’ve added properly fit the page.
To specify a page break you can edit the HTML of a block and at the end add the following HTML tag:
<div class="page-break" style="page-break-after: always;"></div>