[Resolved] Back to top customization

Home Forums Support [Resolved] Back to top customization

Home Forums Support Back to top customization

Viewing 15 posts - 1 through 15 (of 33 total)
  • Author
    Posts
  • #627234
    Richard

    Hey guys,

    searched for this in the forum and couldn’t quite find it.

    For this site, https://eatthat.de/ , the client would like to have the back to top button to be:

    – fixed in place (no starting viewpoint?)
    – centered on all screen sizes
    – chevron-double-up as icon (font awesome)

    Any way doable?

    Thanks for your help!

    Best,
    Richard

    GeneratePress 2.1.3
    GP Premium 1.6.2
    #627266
    David
    Staff
    Customer Support

    Hi Richard,

    you can use this filter to set the starting position:

    https://docs.generatepress.com/article/generate_back_to_top_start_scroll/

    Horizontally centred:

    .generate-back-to-top, .generate-back-to-top:visited {
        right: calc(50% - 15px);
    }

    Change icon:

    .generate-back-to-top:before {
        content: "fa unicode in here";
        font-family: FontAwesome;
    }

    Add the fa unicode and set the font family.

    #627289
    Richard

    Hi David,

    last two worked, thank you!

    In which location would I put the hook in GP hooks?

    And what goes where in here:
    generate_back_to_top_start_scroll

    add_filter( ‘filter_name’, ‘example_function_name’ );
    function example_function_name()
    {
    return ‘Your new value’;
    }

    Any recommendations for the value to make it stay at the bottom?

    Thank you!

    Best,
    Richard

    #627293
    David
    Staff
    Customer Support

    You would need to add that function to your child theme functions.php or use Code Snippets.
    I believe 0 should keep it displayed πŸ™‚

    #627295
    Richard

    Is filter name and function name the same?

    Like this:

    add_filter( ‘generate_back_to_top_start_scroll’, ‘generate_back_to_top_start_scroll’ );
    function generate_back_to_top_start_scroll()
    {
    return ‘0’;
    }

    #627297
    David
    Staff
    Customer Support

    No, its the one thing it shouldn’t be. Name the function whatever you want – something meaningful, don’t use hyphens just underscores.

    #627311
    Richard

    So I have this:

    add_filter( ‘generate_back_to_top_start_scroll’, ‘back_to_top_fixed’);
    function back_to_top_fixed()
    {
    return ‘0’;
    }

    But isn’t doing anything in the front-end. πŸ™

    #627312
    Richard

    ‘O’ has it right from the top.

    #627313
    Richard

    3000 does the trick on desktop, but this isn’t responsive, of course – it just slips off the page.

    #627321
    David
    Staff
    Customer Support

    OK, scrub that then, lets use some CSS:

    .generate-back-to-top {
    	visibility: visible !important;
    	opacity: 1 !important;
    }
    #627339
    Richard

    Hey Dave,

    so I deactivated the snipped and added the CSS.

    Now it’s back at the top. It just needs to stay put in the footer. πŸ™‚

    Thanks!
    Richard

    #627342
    David
    Staff
    Customer Support

    Try clearing caches – it’s slap bang center at the bottom of the screen for me πŸ™‚

    #627349
    Richard

    And stayed put at the bottom?

    #627350
    Richard

    Cleared cache and it starts right below the slider.

    #627356
    David
    Staff
    Customer Support

    Aah, sorry i think i misinterpreted this…. you don’t want the back to top to display at all other then when you reach the actual footer?

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