Adding a download button for entries in GravityView using GravityExport

In this article, you will find out how to use GravityExport to add a download button to your Views, allowing you to download individual entries.

1. Create a new export feed

Head over to the form settings page, click on "GravityExport Lite" or "GravityExport Filters", and create a new feed. After that, click "Enable Download" to generate a download link.

the Enable Download button on the GravityExport feed pageNow configure the remaining options and select a file type for your export (either CSV, Excel or PDF). When you're done, save the feed, scroll back up to the top and copy the download link.

the download link generated by GravityExportThe next step is to create the download button and add it to your View.

2. Add the download link to your View

Now edit your View in GravityView and add a new Custom Content field where you want the download button to show up.

Creating the download link is simple. All you need to do is add an HTML anchor link and set the href property equal to your GravityExport download URL. However, the download URL will download all entries by default. If you want to download single entries, make sure to add ?entry={entry_id} to the end of the URL. {entry_id} is a Gravity Forms merge tag that outputs the ID of an individual entry.

Here's an example:

<a href="https://testing.try.gravitykit.com/gf-entries-in-excel/0bcbb585fbd250ab94af7e0796c5d7b0c31df4eeb284c48f6632cd3dfec148c8?entry={entry_id}"> Download Entry </a>

an HTML anchor link inside a GravityView Custom Content field

3. Add custom styles

If you want to create an attractive button, you'll need to add a CSS class and custom styles to your anchor link. Here's an example:

<a class="button-pdf" href="https://testing.try.gravitykit.com/gf-entries-in-excel/0bcbb585fbd250ab94af7e0796c5d7b0c31df4eeb284c48f6632cd3dfec148c8?entry={entry_id}">Download as PDF</a>

<style>
.button-pdf {
padding: 20px 10px;
color: #fff;
background-color: #808080;
border-radius: 9px;
box-shadow: 0px 2px 3px rgba(19, 126, 180, .30);
padding: 15px 32px;
 display: inline-block;
 font-size: 18px;
text-align: center;
text-decoration:none; 
}
	
.button-pdf:hover {
color:#ffffff;
background-color: #595959;
		
}
</style>

And here's what it will look like on the front end:

a button inside a View labeled Download as PDFIf you want to copy this example, you can paste the above code into your Custom Content field (just make sure to replace the download URL with your own).

Clicking on the download button will automatically download the entry to your computer based on the options you configured in GravityExport.

a browser notification that a download has been completed

That's it!

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us