Home > Mobile >  Download button in text Quarto
Download button in text Quarto

Time:10-24

I would like to have a download button in the middle of a sentence to a pdf or csv document for example. This means there should be a small button in the sentence suggesting that you can download a document, not in a navigation or side bar. Here is some reproducible code:

---
title: "Download button in text Quarto"
format: 
  html:
    code-fold: true
engine: knitr
---

I would like to have a download button [here]() for pdf or CSV document for example.

I am not sure if it is possible to implement a clean button in a sentence using download button embeded in paragraph


Explanation

So what I have done here

  • At first, created a download button using the downloadthis with an id=mtcars-btn so that we can get hold of this generated button with js code using this #mtcars-btn id selector

  • Then created a placeholder inside the paragraph text using <span></span>, where I want the download button to be and also in this case, assigned an id down-btn to that span, so that we can target this span using #down-btn.

  • Then using js, simply appended that generated download button to placeholder span tag so that the button is in the place where we wanted it to be.

  • Lastly, used some css to make this button smaller, reduced button padding, created a bit left and right margin and removed the underline.

Thats it!

  • Related