[Resolved] How to add a sticky button

Home Forums Support How to add a sticky button

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #1078973
    John

    Hi there,

    I am wondering is it possible to add a sticky button site wide using the elements/hooks modules?
    The effect I am trying to replicate is shown here on this site:
    https://invisiblechildren.com/
    So want to replicate the donate button on the right hand side of the page.
    Is that possible using GP or is there a better way to do it?
    I have crawled the previous support topics but nothing quite fits the same description.

    Many thanks!

    John

    #1079034
    John

    Ah I figured it out – was easier than I thought…thanks!

    #1079080
    Leo
    Staff
    Customer Support

    Glad you got it sorted 🙂

    #1103357
    FunkyCss

    Hi can you tell us how you did it ?

    #1103617
    David
    Staff
    Customer Support

    Hi there,

    something like this would do:

    1. Create New Hook.
    2. Add your button HTML eg.

    <a href="url" class="button sticky-button">Button Label</a>

    3. Select the after_footer hook.
    4. Add this CSS:

    .sticky-button {
        position: fixed;
        top: 50%;
        right: 0;
    }
    
    @media (max-width: 769px) {
        .sticky-button {
            display: none;
        }
    }
    #1125319
    John

    Sorry – I never noticed the follow ups to this – yes it was something similar to the code David suggested.
    I can share it with you if you have not figured it out from his.
    Cheers!

    #1125483
    David
    Staff
    Customer Support
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.