Button question

[Peter789]

Hello there,

How to make a button when I click on it it scrolls smoothly to the top of page (hopefully you know what I mean)

Please explain to me with pictures how to make it

Kind regards,
Katarina

[nabeel]

Hi Katarina,

Thank you for reaching out to us. You mean scroll to top anchor. To enable it, navigate to Theme Options > Miscellaneous and turn on Scroll Top Anchor:

You can adjust other settings as well e.g when to show the scroll top anchor. Hope this helps!

[Peter789]

Yes, I already did that. But I want to create a button on a page

[marc_a]

Hi Katarina,

On your page, just create a button then just add the text and don’t add any link. When you click the button it will scroll to top anchor. To make the scroll smooth, you need to add this code in your X/Pro > Theme Options > CSS.

html {
  scroll-behavior: smooth;
}

Please note that custom development is outside the scope of our support. Issues that might arise from the use of custom code and further enhancements should be directed to a third party developer.

Hope that helps.

Thank you.

[Peter789]

Hello Cramaton,

I made the button, but it doesn’t work:

Screenshot

[tristup]

Hi Katarina,

To make that button work like the Scroll to Top, you just need to add the link to the section id to its link. Here used “x-site” is the id of the container just after the body tag.
Here I have tried to create a button with the link, and it works perfectly. Please find the screenshot as an example.

Thanks

[Peter789]

Hello Tristup!

I noticed that you updated the button and it works!

But look how it works on my pc haha

[Peter789]

I found out the problem!

I removed the following code:

html {
scroll-behavior: smooth;
}

And it works okay now! It is not “smooth” haha but it is better i guess…

[prakash_s]

Hi Katarina,

Glad that your issue is resolved

Have a great day!
Thanks