Adding a bottom banner

[dataning]

I have been using the package for a few months and it's really good for all my presentations. However, I have got a challenge recently: I wish to add a bottom banner on each slide (stating "Internally use only") and I am wondering what the best way is to do it. Is there a way I can get the measurement of width or length of the XaringanExtra slide? Should I design a long banner and stick it as a bottom logo?

Many thanks!

[mattwarkentin]

Hi @dataning,

This issue is a little old so I don't know if you're still looking for a solution, but a little JavaScript and CSS should probably get you what you need.

Assuming you want the banner on every slide, this should do it:

const slides = document.getElementsByClassName('remark-slide-content')
slides.forEach((slide) => {
  const banner = document.createElement('p')
  banner.innerText = "Internal use only!"
  banner.classList.add('bottom-banner')
  slide.appendChild(banner)
})

Then all you need is some CSS to define how the banner looks:

.bottom-banner {
  position: absolute;
  bottom: 0px;
  left: 0px;
  width: 100%;
  font-size: 24px;
  margin: 0;
  padding: 0;
  border: 2px solid red;
  text-align: center;
}

Play around with the aesthetics as you like. Hope this helps.