Go top smooth function

Closed. This question is off-topic. It is not currently accepting answers.

---

Your question should be specific to WordPress. Generic PHP/JS/SQL/HTML/CSS questions might be better asked at Stack Overflow or another appropriate Stack Exchange network site. Third-party plugins and themes are off-topic for this site; they are better asked about at their developers' support routes.

Closed 6 years ago.

Improve this question

I have a problem that I write the following code in the functions.php to realize the page go top.

It works.but just work for the user fist visit the page and click the button for first time.

I must refresh the page let the function work.

Did I miss something?

function back_and_top( $content ) {

    if( is_front_page() || is_home() ) {
    return $content;
}


    $custom_content .= '<div class="back_and_top">
<a class="top_btn" href="javascript:const scrollToTop = () => {
  const c = document.documentElement.scrollTop || document.body.scrollTop;
  if (c > 0) {
    window.requestAnimationFrame(scrollToTop);
    window.scrollTo(0, c - c / 8);
  }
};
scrollToTop();" title="go top"><i class="fa fa-sort" aria-hidden="true"></i>Go Top</a>

</div>';

    $content .= $custom_content;
    return $content;
}
add_filter( 'the_content', 'back_and_top' );

Closed. This question is off-topic. It is not currently accepting answers.

---

Your question should be specific to WordPress. Generic PHP/JS/SQL/HTML/CSS questions might be better asked at Stack Overflow or another appropriate Stack Exchange network site. Third-party plugins and themes are off-topic for this site; they are better asked about at their developers' support routes.

Closed 6 years ago.

Improve this question

I have a problem that I write the following code in the functions.php to realize the page go top.

It works.but just work for the user fist visit the page and click the button for first time.

I must refresh the page let the function work.

Did I miss something?

function back_and_top( $content ) {

    if( is_front_page() || is_home() ) {
    return $content;
}


    $custom_content .= '<div class="back_and_top">
<a class="top_btn" href="javascript:const scrollToTop = () => {
  const c = document.documentElement.scrollTop || document.body.scrollTop;
  if (c > 0) {
    window.requestAnimationFrame(scrollToTop);
    window.scrollTo(0, c - c / 8);
  }
};
scrollToTop();" title="go top"><i class="fa fa-sort" aria-hidden="true"></i>Go Top</a>

</div>';

    $content .= $custom_content;
    return $content;
}
add_filter( 'the_content', 'back_and_top' );

• functions

Share Improve this question asked Jan 3, 2019 at 12:20 cindycindy 10599 bronze badges

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 1

If you had checked the JS console, then you would see this error:

Uncaught SyntaxError: Identifier 'scrollToTop' has already been declared at :1:1

And that's the reason, why your code works only once.

Don't put this as inline JS. Write it correctly.

In go-to-top.js file:

jQuery(function ($) {

    $('.go-to-top').click(function (e) {
        e.preventDefault();
        c = document.documentElement.scrollTop || document.body.scrollTop;
        if (c > 0) {
            window.requestAnimationFrame(scrollToTop);
            window.scrollTo(0, c - c / 8);
        }
    });

});

And in your PHP file:

function back_and_top( $content ) {

    if ( is_front_page() || is_home() ) {  // I'm pretty sure that's not enough (there are archives and so on)
        return $content;
    }

    $custom_content = '<div class="back_and_top">
<a class="go-to-top" href="#" title="go top"><i class="fa fa-sort" aria-hidden="true"></i>Go Top</a></div>';

    $content .= $custom_content;
    return $content;
}
add_filter( 'the_content', 'back_and_top' );