Smooth Scroll Not Working

I want to implement smooth scroll to #id on the page from the nav menu items (like in those one page scroll themes).

Shapely does include the jQuery smooth scroll plugin, though I can’t see any options about that on the frontend. It doesn’t seem to work when I try on my local server.

Even the back to top button on the bottom right does not implement smooth scroll upwards on my local server (I followed all instructions in the support forum to setup the theme just like the demo). It does work on the demo here.

I tried using the Page scroll to id plugin to get it working, but that has conflicts because of the jQuery smooth scroll plugin apparently:

How do I get it to work?

It’s just a workaround but the plugin that you suggest works for me.
In footer.php I only add rel=“m_PageScroll2id” in a tag.

Hi @teawebsite,

I hope you are well today and thanks for helping out here in this forum.

Your help here is really appreciated.



Just adding rel=“m_PageScroll2id” to an anchor tag in the footer linking to #top works for me! But the links in the menu items don’t, sadly. I don’t think this site has PM capability. I want to PM the link of my (now live on a temp host) website.

What do you mean by “PM capability”?

Could you please share me the page URL from your site where the links in the menu are not working correctly so that i can troubleshoot it?

Hi @Movin,

PM: I meant personal message for sharing links with personal information. They call it PM in forum jargon.

Here’s the link:

The “About Us” and “Contact Us” links in the menu have rel=“m_PageScroll2id” in them added via the Link Relationship (XFN) field in the Menu section of WP Admin area.

Adding rel=“m_PageScroll2id” to the scroll to top icon on the bottom right made it work. It didn’t scroll smoothly to the top before…

Thanks! :slight_smile:

Adding rel=”m_PageScroll2id” to the scroll to top icon on the bottom right made it work. It didn’t scroll smoothly to the top before..

Awesome great to see you made that worked.

Please advise if you have more questions.

Have a fantastic day!

Hi guys, I have tried above my tag looks like this:

<a class="btn btn-sm fade-half back-to-top inner-link" href="#top" rel="m_PageScroll2id"><i class="fa fa-angle-up"></i></a>
    </footer><!-- #colophon -->
</div><!-- #page -->

Am i doing something wrong?

Thanks everyone!

Hi @yusuflimz,

To help us keep support thread separates could you please create your own thread for your question here instead of replying on others thread as it makes the thread messy and hard to read.

If you want to you can also add reference of this thread in your newly created thread.

We would be more than happy to help you on your new thread.