Franklin: render csv file in new browser tab

General Usage
,
1

Using Franklin, I have created a static site. Now I would like to add a link to a CSV file, writen as [data file](example.csv) in markdown, in page home/dataexpo.

The normal usage of [data file](example.csv) leads to download the file. The desirable action when clicking this link is to render the data content in CSV file in a new browser tab with a plain format rather than download this CSV file. How do I achieve this action?

Below is a toy CSV data:

ID, Policy, Cost
123,1,100
124,1,2400
125,3,350
126,4,8000
2

@ tlienart

3

if you have a .csv asset somewhere and link to it, it’s the browser that will define how to handle that asset; as far as I’m aware all browsers will offer to download the raw file.

However what you want to achieve should not be too difficult to do, you can generate a HTML page with content corresponding to that CSV. For instance this HTML does the job:

<!doctype html>
<html lang="en">

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width-device-width, initial-scale=1.0">
	<title>The CSV</title>
</head>


<body>

<pre><code>ID, Policy, Cost
123,1,100
124,1,2400
125,3,350
126,4,8000</code></pre>

</body>

</html>

So you could have that HTML in your website folder, call it foo_csv.html and it will be available at your_base_url/foo_csv/.

To open things in a new tab, it’s not a recommended thing to do and markdown links won’t do that but you can always insert raw HTML that do with

Open the CSV in a new tab: ~~~<a href="/foo_csv/" target="_blank">the link</a>~~~

Last comment: in the page HTML above you could have put

<pre><code>{{insert path/to/the/csv.csv}}</code></pre>

and Franklin will insert the content of the CSV there; note that the path is relative to the _layout folder so for instance if you put the CSV in _assets/thecsv.csv then it would be {{insert ../_assets/thecsv.csv}}.

Hope this helps

1 Like
4

Thank you for this effective solution.

1 Like