Scroll Progress Bar in Blogger

How To Add Progress Scroll Bar In Blogger 2 (funcionou))

<style>
.progress-bar-container{
  position: fixed;
  width: 100%;
  bottom: 0px;
  background-color: #fff;
  margin: 0px;
  z-index: 9999;
}

.progress-bar{
  height: 5px;
  background: #8b3dff;
  width: 0%;
  animation: background 0.5s;
}
</style>

  <div class="progress-bar-container">
      <div class="progress-bar" id="progress"></div>
  </div>

<script type="text/javascript">
  window.onscroll = function(){
  var windowScroll = document.documentElement.scrollTop;
  var windowHeight = document.documentElement.scrollHeight - document.documentElement.clientHeight;
  var scrollAmount = (windowScroll/windowHeight)*100;
  document.getElementById("progress").style.width = scrollAmount + "%";
};
</script>

scrollprogressbarinblogger

<div class="progress"></div>
<style>
    .progress {
        background: linear-gradient(to right, #fc801c var(--scroll), transparent 0);
        background-repeat: no-repeat;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 4px;
        z-index: 1;
        animation: background 0.5s;
    }
</style>
<script>
    var h = document.documentElement,
        b = document.body,
        st = "scrollTop",
        sh = "scrollHeight",
        progress = document.querySelector(".progress"),
        scroll;
    document.addEventListener(
        "scroll",
        function () {
            scroll = ((h[st] || b[st]) / ((h[sh] || b[sh]) - h.clientHeight)) * 100;
            progress.style.setProperty("--scroll", scroll + "%");
        },
        {
            passive: true,
        }
    );
</script>

1 - Go to Blogger Dashboard
2 - Go to Theme/Template Section
3 - Click Edit HTML
4 - Now Search for </body>

5 - Now copy the code provided below and add it above the tag which we have founded in step 4.

https://softwebtuts.com/how-to-add-page-scroll-progress-bar-in-blogger/

--- O Primeiro código do softwebtuts.com não funcionou em um template ---- o segundo código do rustcodeweb.com funcionou --- verificar ---

https://www.rustcodeweb.com/2021/03/how-to-add-progress-scroll-bar-in-blogger.html

Colocar antes do fechamento da tag no final do template