i'm using the spirit theme and want to add a btn in lower

Hello, i'm using the spirit theme and want to add a btn in lower right corner that scrolls to top (like in a 1 page site) is this possible? If so can you tell me how to do it.

  • Predrag Dubajic
    • Support

    Hey @Neil,

    Hope you're doing well today :slight_smile:

    Unfortunately there is no scroll to top button in Upfront but there is a workaround for this, it might seem bit complicated but I'll do my best to explain it in details.

    Open upfront editor, right click on your header, and click edit background. Now click on yellow plus icon to add new region above your header. Screenshot one below.
    Enter region name, for example scroll-to-top, make it global, click OK and Finish Editing Background.

    Now in that region put one text element, don't need to change the text, just go to options, make that element an anchor and name it something like scrollToTop, see second screenshot.

    After that right click anywhere on your site and click on Add Floating Region, click on settings for that region and make it transparent, see third screenshot.

    Now in that floating region drag Button Element from Upfront sidebar, style the button as you want and replace the text to what you want.
    Click on three dots to bring up link options, select Anchor and for anchor select scrollToTop, fourth screenshot.

    All we need to do now is hide the region we first added, to do that go to Theme Settings > add custom css rules and in there paste this code:

    #upfront-region-container-scroll-to-top {
        height: 0;
        overflow: hidden;
    }

    Save CSS changes and Upfront changes and that should be it.

    If you are having any troubles with this please let us know :slight_smile:

    Best regards,
    Predrag

  • Neil
    • Site Builder, Child of Zeus

    Hello Predrag, thank you, that works perfect! 1 other question, when i click in edit css styles a panel open at bottom and I can add my code and save but to get rid of it i have to exit upfront and reopen it. Is this correct or is there some other way ?

  • Predrag Dubajic
    • Support

    Hi Neil,

    So glad that worked for you :slight_smile:

    I'm not sure I understand your question completely, are you referring to global CSS (add global css styles from last screenshot above) or you are adding CSS to one of the elements?

    Could you attach some screenshots or maybe a small video demonstrating this? :slight_smile:

    Thank you,
    Predrag

  • Predrag Dubajic
    • Support

    Hi Neil,

    Thanks for the video and for granting access.

    I tried enabling Upfront editor couple of times but I was unable to replicate the issue you are seeing, and by the looks of it from the video the files that are showing in errors are not included in Upfront or Spirit theme.

    Could you try disabling your plugins and see if the issue is still there after that.
    It looks that this is also stopping Upfront editor to load properly, as you can see from screenshot attached that was taken on my installation you are missing top bar of the editor.

    Let us know of the results.

    Best regards,
    Predrag

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.