[Resolved] additional class to back to top button

Home Forums Support [Resolved] additional class to back to top button

Home Forums Support additional class to back to top button

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
  • #959899

    Hi, the subject tells it all: I need an additional class for the back to top button, but I can’t find the right place to add it. I use the snippet plugin also, so maybe some custom js will do the magic. Or directly into the themes’ php file (but where can I find the right place?).

    Any ideas? Thank you …

    Customer Support

    Hi there,

    Try this PHP snippet:

    add_filter( 'generate_back_to_top_output', 'tu_custom_back_to_top_icon' );
    function tu_custom_back_to_top_icon() {
    		'<a title="%1$s" rel="nofollow" href="#" class="generate-back-to-top CUSTOM-CLASS" style="opacity:0;visibility:hidden;" data-scroll-speed="%2$s" data-start-scroll="%3$s">
    				<span class="screen-reader-text">%5$s</span>
    			esc_attr__( 'Scroll back to top', 'generatepress' ),
    			absint( apply_filters( 'generate_back_to_top_scroll_speed', 400 ) ),
    			absint( apply_filters( 'generate_back_to_top_start_scroll', 300 ) ),
    			esc_attr( apply_filters( 'generate_back_to_top_icon', 'fa-angle-up' ) ),
    			esc_html__( 'Scroll back to top', 'generatepress' ),
    			generate_get_svg_icon( 'arrow' )

    Adding PHP: https://docs.generatepress.com/article/adding-php/

    Let me know πŸ™‚


    Hi Leo,

    thanks. The class is applied, but my wish behind all of it doesn’t take effect. I use the scroll to id plugin and want to let the back to top button run as smooth as my menu where I use the additional “ps2id” class to let the magic work. The class “ps2id” applied to the back to top doesn’t do anything…


    Customer Support

    Hmm I don’t think that’s how it would work as our back to top script is still executing.

    If you want to use the script from another plugin, you’d basically need to create your own back to top button.


    Ok, I will do the button on my own. Thanks for helping …

    Customer Support

    Ok, I will check if that fit my needs … πŸ™‚

    Customer Support

    Hi Leo,

    well I made a little snippet on my own that’s working fine on a single file for itself (see below), but using hooks in generatepress to add this causes nothing but js errors (ReferenceError: Can’t find variable: $). Maybe I’m too stupid after quite a long week … any ideas?

    That’s my file:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
    	<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    	<title>show onscroll</title>
    	<script src="http://code.jquery.com/jquery-latest.js"></script>
    	window.onscroll = function()
        if( window.XMLHttpRequest ) {
            if (document.documentElement.scrollTop > 150 || self.pageYOffset > 150) {
            } else if (document.documentElement.scrollTop < 150 || self.pageYOffset < 150) {
    	<style type="text/css">
    a#btt {
    	background-color: #000;
    	display: none;
    	padding: 8px 14px 8px 14px;
    	border-radius: 3px;
    	color: #FFF;
    	position: fixed;
    	z-index: 10;
    	right: 30px;
    	bottom: 80px;
    	opacity: 0.38;
    	font-size: 14px;
    a#btt:hover {
      opacity: 0.4;
    body {
      min-height: 2000px;
    	<p>scroll down</p>
    	<a href="#" id="btt">to top</a>
    Customer Support

    Hmm I’m not familiar with JS but I don’t think hooks should be used for that though.

Viewing 10 posts - 1 through 10 (of 10 total)
  • You must be logged in to reply to this topic.