Hello, I am looking to create a button that is linked to a unique download link from a website such as dropbox, box, etc. Users log into my website and upload documents. From there,
I take the documents, modify them and provide a pdf report. I would like to link the users to box.com or if there is way that I can upload the documents back into Knack, that would
be even better. Please Let me know if there is a good way to do this.
Hi Rogelio,
There are two different ways to accomplish this by either using a menu button or a custom CSS button.
Using a menu button: Leave the document on box.com, get the public link in box.com for the doc then in Knack, add a Menu to the page where you want the download button. Click on the Menu view to open the edit window and then click "Link to a URL" on the left. In the popup window, you can then add a name for the button, add the download link, and check a box if you want the document to be opened in a new browser window.
Using a custom CSS button: Instead of a menu button, you can add a Rich Text view to the page. Then click the Rich Text view to open the edit window and then switch to the source code. For example, to add a Download button in the center of the screen that opens in a new browser window, add the following sample code:
<p style="text-align:center;padding-bottom: 20px;"><a href="YOUR DOWNLOAD LINK" target="_blank" class="pgbutton">Download</a>
</p>
Save the changes. Then go to "API & Code" of your app and click "CSS".
Add the following sample code (change as needed):
.pgbutton {
background-color: #5eba46;
border: none;
color: #ffffff !important;
font-weight: 400;
padding: 6px 12px;
text-align: center;
text-decoration: none !important;
display: inline-block;
font-size: 16px;
margin: 4px 2px;
border-radius: 4px;
}
.pgbutton:hover {
background-color: #3e7a2e !important;
color: #ffffff !important;
}
Using either one of the two options, you can also add the document in Knack to your app. This requires an object with a File field. After the document is uploaded in your Knack app, in the Knack builder, go to Records of the object with the file field then left-click on the file name of the uploaded document. Then right-click on the file name and copy the link address.
You will have a link similar to this: https://builder.knack.com/your-org/your-app#kn-asset/5f91c9a57836d7067a852f34/your-document.pdf
Re-assemble the link to fit your user-facing page by starting with the page URL: https://YOUR-ORG.knack.com/YOUR-APP#YOUR-PAGE/
Then append the link above with the bold part of the initial URL. Your download link should look like this:
https://YOUR-ORG.knack.com/YOUR-APP#YOUR-PAGE/kn-asset/5f91c9a57836d7067a852f34/your-document.pdf
To create a download link that opens the document in a new browser window instead of the Knack modal popup, the download link needs to be slightly different. Start with the URL like this:
https://api.knack.com/v1/applications/YOUR-APP-ID/download/asset/
You can find the YOUR-APP-ID under API & Code of your app. Then append the asset ID and the file name to the URL. Your final download URL will look like this:
Hope this helps.
1 Like