How to create a "fake" legend with custom HTML

Not all Flourish templates come with the different kinds of legends you may want to display in your visualization. For cases like this, you can create a "fake" legend using custom HTML and add that in the header text area. 

In the story below, you'll find annotated examples of different "fake" legends that you can copy and paste into your own visualizations.

Click on the highlighted parts of the code to find out more about how they work and what they do. Then follow the steps below to add a fake legend to your visualization.

To add a "fake" legend to your visualization,

1

Create your visualization, choose the type of "fake" legend you need from the story above and copy the code snippet.

2

Edit the code snippet, changing labels and colors to how your legend should appear. 

TIP: You may want to open the code snippet in a text editor to make it easier to edit.

3

Go to the  Header settings, and find the Text field. If you aren't already using the Title or Subtitle fields, you can also use these as well.



4

Paste in the code snippet you edited to your chosen field.