How to provide a link for the logo in Quarto revealjs presentations?

With Quarto we can provide a logo for presentation slides as following:

in the _quarto.yml file:

format:
    revealjs:
        logo: image.png

Is there a way to make it a linked logo, so that clicking it redirects to e.g. a Homepage?

In markdown we can insert linked images as e.g. [![image](image.png)](https://stackoverflow.com), however this seems not to work in the yaml file.

Solution

Updated Answer:

Now you can easily link the footer logo using the quarto extension reveal-header (v 1.2.7) which provides an option footer-logo-link now.

So first install the extension using quarto add shafayetShafee/reveal-header and then,

presentation.qmd

---
title: Testing
format:
    revealjs:
      logo: quarto.png
      footer-logo-link: "https://quarto.org"
filters:
  - reveal-header
---


## Quarto

Old Answer:

You can write a JavaScript function to take the rendered logo image and then nest it within an a tag with the desired hyperlink.

logo-hyperlink.html

<script type="text/javascript">
  function hyperlink_logo() {
    let logo = document.querySelector('img.slide-logo');
    const logo_cloned = logo.cloneNode(true);
    const link = document.createElement('a');
    // -----------------------------------------------------------
    // set the link for the logo here in `link.href` within quotes
    link.href = 'https://stackoverflow.com';
    // -----------------------------------------------------------
    link.target = '_blank';
    link.appendChild(logo_cloned);
    logo.replaceWith(link);
  };
  
  window.document.addEventListener("DOMContentLoaded", function (event) {
    hyperlink_logo();
  });
</script>

Set the link enclosed with quotes for the logo as the value of link.href. And then include this html file to the qmd file.

presentation.qmd

---
title: Testing
format:
    revealjs:
      logo: SO.png
include-after-body: logo-hyperlink.html
---


## Quarto