Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • June 4, 2019 at 2:15 pm #1107107
    CADCOM

    Hi the team Kriesi

    I’ve another problem with my ‘confidential’ website. On different pages I need to make a button with a link directly to a Gallery. For now I make the gallery with a ‘button’ picture like the first of the gallery but it’s not very ‘professional’. Do you have a solution to make a button with a link direct to a picture gallery ?

    If I send you a volatile admin access to the website, can you take a look ?
    Thank you.

    • This topic was modified 5 years, 6 months ago by CADCOM. Reason: I've found the solution to remove the head bar ;-)
    June 5, 2019 at 5:14 am #1107345
    Rikard

    Hey CADCOM,

    Thanks for the update, did you find a solution to your problem or do you still need help?

    Best regards,
    Rikard

    June 5, 2019 at 9:49 am #1107446
    CADCOM

    Hey Rikard,

    I find a solution for removing the top header but I still need help for the button to the gallery that I ask in this topic.

    Thank you by advance.
    Manu

    June 5, 2019 at 1:44 pm #1107551
    Victoria

    Hi Manu,

    Yes, we can still keep the discussion in this thread.

    Could you please attach a mockup of what you’re trying to achieve?

    Best regards,
    Victoria

    June 5, 2019 at 2:03 pm #1107572
    CADCOM

    Hi Victoria

    I send you the mockup and the result I want in Private.
    Thank you !

    Best regards

    June 11, 2019 at 5:13 am #1109001
    Ismael

    Hi,

    Thank you for the info.

    The gallery should be hidden on page load. You can use the following css code to do that.

    .my-custom-gallery { display: none; }

    Turn on the custom css class field first so that you can apply a special class attribute (ex: my-custom-gallery) to the gallery.

    // https://kriesi.at/documentation/enfold/intro-to-layout-builder/#turn-on-custom-css-class-field-for-all-alb-elements

    You can then create a custom script that will toggle the visibility of the gallery when someone clicked on the “photo” button. The following function should help.

    // http://api.jquery.com/toggle/

    Best regards,
    Ismael

    June 11, 2019 at 9:44 am #1109052
    CADCOM

    Great ! Thank you Ismael.

    I defined the custom CSS to my gallery so that it’s not displayed on page load, ok. I added the script toggle in my functions.php but I need to define an ID to the div of buttons and galleries like that : How I can add an ID to buttons and Galleries ? 

    <div class="avia-button-wrap avia-button-left  avia-builder-el-8  el_after_av_hr  el_before_av_hr  " id="galleryButton">
    <a href=" my link" class="avia-button   avia-icon_select-no avia-color-theme-color avia-size-large avia-position-left " target="_blank">
               <span class="avia_iconbox_title">Text of my button</span>
    </a>
</div>

    So that my script will working great with ID : 

    $( "#galleryButton" ).click(function() {
  $( "#myGallery" ).toggle( "slow", function() {
    // Animation complete.
  });
});

    Thank you by advance

    June 13, 2019 at 5:24 am #1109692
    Ismael

    Hi,

    How I can add an ID to buttons and Galleries ?

    Thank you for the update.

    // https://kriesi.at/documentation/enfold/intro-to-layout-builder/#turn-on-custom-css-class-field-for-all-alb-elements

    Did you enable the custom css class field? A custom css class attribute will suffice.

    
$( ".custom-button-class a" ).click(function() {
  $( "#myGallery" ).toggle( "slow", function() {
    // Animation complete.
  });
});

    Replace the “custom-button-class” selector with the button’s custom css class attribute.

    Best regards,
    Ismael

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