[Support request] Moving back to top button

Home Forums Support [Support request] Moving back to top button

Home Forums Support Moving back to top button

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #330363
    Grant

    Hi,

    By default the back to top button is fixed to the bottom right of the page. Is there a way to it so it’s fixed within my footer?

    The site I am working on currently, http://staging.cbfcreative.co.uk/, I’d like to the back to top button to float inline inline with the header ‘Studio’ and the right hand side of the block. It should be noted this footer is created using elementor and GP Hooks.

    Thanks in advance

    #330500
    Tom
    Lead Developer
    Lead Developer

    Good question!

    Try this PHP:

    add_action( 'after_setup_theme','tu_move_back_to_top' );
    function tu_move_back_to_top() {
        remove_action( 'wp_footer','generate_back_to_top' );
        add_action( 'generate_before_footer_content','generate_back_to_top' );
    }

    Then this CSS:

    .site-footer {
        position: relative;
    }
    
    a.generate-back-to-top {
        position: absolute;
        top: 40px;
        bottom: auto;
    }
    #1876764
    Dipak Singh

    Hello Tom, thanks for this guide, but I want back to top button in the middle of the footer bar.
    Is there any way to adjust it? I have tried to mix up the CSS code but did not get any solution.
    Please help.

    #1877081
    David
    Staff
    Customer Support

    Hi there,

    can you raise a new topic where you can share a link to your site, and please confirm what you mean by middle – is this vertically centered in the footer or horizontally centered ?

    #1877107
    Dipak Singh

    I want to add this vertically centered

    #1877112
    Dipak Singh

    By default back to the top button comes with the bottom right side corner but I just want it on the middle side.

    #1877392
    David
    Staff
    Customer Support

    Try adding this CSS:

    a.generate-back-to-top {
        right: unset;
        left: 50%;
        transform: translateX(-50%);
    }
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.