[Resolved] Trigger Slideout Menu with secondary button

Home Forums Support [Resolved] Trigger Slideout Menu with secondary button

Home Forums Support Trigger Slideout Menu with secondary button

Viewing 15 posts - 1 through 15 (of 21 total)
  • Author
    Posts
  • #655236
    JANEK

    Good afternoon,

    I’m just wondering if theres a capacity to program another button to trigger the slideout menu. At the moment I’m using the slideout menu to to display a contact form and would like to use a button elsewhere on the site to trigger the slideout menu additionally to the primary navigation button.

    Thanks in advance,
    Janek

    GeneratePress 2.1.3
    GP Premium 1.7.2
    #655781
    David
    Staff
    Customer Support

    Hi there,

    you can just wrap an anchor tag with the slideout-toggle class:

    <span class="slideout-toggle"><a><!-- slideout toggle --></a></span>

    Then this CSS:

    .slideout-toggle a:before {
        font-family: GeneratePress;
    }
    #656211
    JANEK

    Well… that was relatively simple wasn’t it. I thought there might have been something else going on in the background. πŸ™‚

    Thanks for your help, David!

    #656658
    David
    Staff
    Customer Support

    glad to be of help πŸ™‚

    #693758
    Colby

    Glad i came across this, thanks for posting this.
    Just wanted to add to this that the code above can be added to an Elementor Button Module, to get a button to trigger the slideout.

    From within the Button Module:
    in the link field paste :
    <!– slideout toggle –>

    in the class field paste:
    slideout-toggle

    in the custom css paste:
    .slideout-toggle a:before {font-family: GeneratePress;}

    #693988
    David
    Staff
    Customer Support

    Awesome πŸ™‚ thanks for sharing Colby.

    #775195
    Daniel

    Hi, i’m trying to get this working but it doesn’t do anything, any ideas?

    site: https://www.shensmithlaw.co.uk/ (in the header)

    #775336
    David
    Staff
    Customer Support

    Hi there,

    it could be due to the JS not firing, the Ninja form code you have in the section column us showing an error, right click > inspect > console you will see the error. Try removing the ninja form code and see if the menu works.

    #775729
    Colby

    Hi Been following this thread. Just a quick question. What is this technique called? When you use a HTML comment structure “<!– slideout toggle –>” to invoke a JS interaction?

    I’d like to read up on this and learn how this works but don’t know what to search for. Any infor woudl be appreciated, thanks!

    #775778
    David
    Staff
    Customer Support

    Hi there,

    so this is the HTML element:

    <span class="slideout-toggle"><a><!-- slideout toggle --></a></span>

    The Javascript looks for an <a> tag that is within a container carrying the slideout-toggle class. The HTML comment is solely there as a filler and to identify its purpose for anyone looking over the code.

    #775797
    Colby

    Ok, Gotcha. Thanks David.

    #775798
    David
    Staff
    Customer Support
    #775971
    Daniel

    I removed it, but still doesn’t seem to fire the menu for some reason!

    #776175
    David
    Staff
    Customer Support

    Do you have the slideout navigation set to mobile only?

    #776177
    Daniel

    D’oh! I didn’t know that was an option! Thanks

Viewing 15 posts - 1 through 15 (of 21 total)
  • The topic ‘Trigger Slideout Menu with secondary button’ is closed to new replies.