Are you a GenerateCustomer?

Do you have an active GP Premium or GenerateBlocks Pro license key?

Create a GenerateSupport account for GeneratePress and GenerateBlocks support in one dedicated place.

Create an account
Already have a GenerateSupport account? Login

Just browsing?

Feel free to browse the forums. Support for our free versions is provided on WordPress.org (GeneratePress, GenerateBlocks).

Want to become a premium user? Learn more below.

Positioning CTA button at the bottom of the slide out menu

  • Hello,

    I’ve added a CTA button to the slide-out menu by using the hook generate_after_slideout_navigation. Is it possible to position this button at the bottom of the slide-out menu? If so, how can I achieve this?

  • Hello there,

    I just looked at your menu, and the button is correctly positioned at the bottom as you wanted. Is that correct?

  • Hello,

    This is occurring because of the other elements in the slide-out menu, such as the menu and logo, which are pushing the CTA button down. The CTA button starts right after the menu items in the slide-out menu. My intention is for it to always remain fixed at the bottom.

  • Hi there,

    it is possible:

    1. add this CSS to the Site:

    
    nav.slideout-navigation .inside-navigation {
        display: flex;
        flex-direction: column;
        height: 100%;
        align-items: flex-start;
        justify-content: flex-start;
    }
    

    What this will do is force the inside container to fill the height of the screen and apply a flex column.

    2. Then edit the element hook, and place the CTA button in its own Container block after the other content.
    And set its Spacing > Margin Top to auto
    You can add padding etc to the Container block

  • This worked thank you!

  • Glad to hear that

  • I have one more question. Where can I change the color for this element .slideout-navigation, .slideout-navigation a?

  • customzier > colors > off canvas panel > navigation text.

  • This works, but it makes the list items white too. That’s not what I want. Only the content below should be white. I’ve added the white color to the button block, but it still remains, instead of ignoring the black color assigned to this class .slideout-navigation, .slideout-navigation a.

  • Can I see the section in question?

  • Yes, I’m referring to the social icons at the bottom inside the brown section of the slide-out menu when viewed on mobile.

  • Try adding this CSS:

    #generate-slideout-menu .gb-button {
        color: #fff;
    }
Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.