Adding a "back to top" icon

You can follow the instructions below to add a back to top icon so that users can click on it to jump to the top of the page.

1. Log in to your Website Toolbox account.
2. Click the Integrate link in the main menu.
3. Click the HTML link.
4. Paste the following code in the Forum Footer HTML Code text box:

   <style>
   #jumpToTopBtn {
        display: none;
        position: fixed;
        bottom: 40px;
        right: 10px;
        z-index: 8;
        border: none;
        outline: none;
        background-color: #999;
        color: white;
        cursor: pointer;
        border-radius: 4px;
        font-size: 0;
        padding: 0;
        background: #aaa;
        width: 40px;
        height: 40px;
        border-radius: 100%;
        opacity: 0.5;
   }
   #jumpToTopBtn:before {
        content: '';
        width: 15px;
        height: 15px;
        display: block;
        transform: rotate(-45deg);
        border-top: 3px solid #fff;
        border-right: 3px solid #fff;
        margin-top: 5px;
        margin-left: 12px;
   }
   #jumpToTopBtn:hover {
        background: #aaa;
        opacity:1;
   }
   </style>
   <script defer>
   function scrollFunction(scrollPosition) {
        var bodyScrollToTop = document.body.scrollTop;
        var documentScrollToTop = document.documentElement.scrollTop;
        if(typeof scrollPosition != "undefined" && scrollPosition != "") {
            bodyScrollToTop = parseInt(scrollPosition) +
   parseInt(bodyScrollToTop);
            documentScrollToTop = parseInt(scrollPosition) +
   parseInt(documentScrollToTop);
        }
        if (bodyScrollToTop > 150 || documentScrollToTop > 150) {
            document.getElementById("jumpToTopBtn").style.display = "block";
        } else {
            document.getElementById("jumpToTopBtn").style.display = "none";
        }
   }
   window.addEventListener("DOMContentLoaded", function(){
        if(wtbx.embed.isForumEmbedded()) {
            if (window.addEventListener) {
                window.addEventListener('message',(evt) => {
                    var scrollPosition =
   parseInt(evt.data.wtbIframeHeightFromTop) +
   parseInt(wtbx.embed.scrollPosition);
                    scrollFunction(scrollPosition);
                }, false);
            }
            document.getElementById("jumpToTopBtn").style.display = "block";
        } else {
            window.onscroll = function() {scrollFunction()};
        }
   
        jQ('#jumpToTopBtn').click(function() {
            if(wtbx.embed.isForumEmbedded()) {
                parent.postMessage({
                    'action':'scrollToTop',
                    'redirectUrl':window.location.href
                },'*');
                return false;
            } else {
                document.body.scrollTop = 0;
                document.documentElement.scrollTop = 0;
            }
        });
   });
   </script>
   <button id="jumpToTopBtn" title="Go to top">Top</button>
   		

5. Save your changes.

If you still need help, please contact us.