Viewing 22 posts - 1 through 22 (of 22 total)
  • Author
    Posts
  • #239146

    Hey there,

    I am putting together a gallery and would like to adjust the spacing between the image thumbnails.. and also remove the white borders.

    gallery customization

    Please let me know if this is a simple solution.

    Thanks so much!

    #239945

    Hi theworldawaits!

    Please post a link to the gallery. We’ll investigate the source code and provide some custom css code.

    Regards,
    Peter

    #240292

    Thanks. The link is currently here: http://aztecabeautysalon.ca. Thanks :)

    #240295

    Hi!

    Please add following code to Quick CSS in Enfold theme options under Styling tab

    #top div .avia-gallery img { border-style: none; padding: 0; }
    #top #wrap_all .avia-gallery-1 .avia-gallery-thumb a { width: 16%; margin: 20px;  }

    P.S.: Nice website! :)

    Best regards,
    Yigit

    #240480

    Thanks, it worked great! Really appreciate it.

    One other question: Is it possible to show the Caption in the lightbox?

    #240496

    Hello!

    It is possible but that would require a heavy customization and unfortunately that’s beyond the scope of the support we can offer. If you really need it try hiring a freelancer for the job or if you prefer request a quote here.

    Cheers!
    Josue

    #379380

    I have used this to remove the border on the thumbnails but for some reason the border stays on the larger image when you have the gallery set up with big image and thumbnails under?

    #379566

    Hi,

    Can you post the link to your gallery page please?

    Regards,
    Josue

    #379609
    This reply has been marked as private.
    #379617

    Add this:

    .avia-gallery-big {
        border: 0 !important;
    }

    Cheers!
    Josue

    #379627

    Worked! Thanks

    #379631

    You are welcome, glad to help :)

    Regards,
    Josue

    #433077

    The CSS provided above does not take the white border off of a gallery with the big image shown above the thumbnails. It only takes the border off of the thumbnails.

    i.e.
    #top div .avia-gallery img { border-style: none; padding: 0; }
    #top #wrap_all .avia-gallery-1 .avia-gallery-thumb a { width: 16%; margin: 20px; }

    .avia-gallery-big { border: 0 !important; }

    Notice the Gallery with Preview and Bigger Gallery with Preview on your demo…
    http://kriesi.at/themes/enfold/shortcodes/gallery/

    The above code only removes the border for the thumbnails.

    Any ideas how to remove the border from the big preview? I have tried numerous css combinations and now stuck.

    Thanks,

    #433239

    Hey!

    I tested that code using DevTools and it did remove the border, can you post a link to the page where you’re trying this?

    Cheers!
    Josue

    #460766

    Anyone found a solution for removing the border on the big image too ?

    #460773

    Hi!


    @kyzoe
    Please post the link to your page and point out the border you would like to remove.

    Best regards,
    Yigit

    #684256

    Can anyone tell me what the code should be for having the standard border and colour as in the Enfold Demo for the Gallery element with big image above and smaller thumbnails below. I want to achieve this again having removed it earlier, so would like to “put back the default” as it were.

    like these – see link

    #684264

    Hi!

    You probably added a code similar (or the same) to following one

    #top div .avia-gallery .avia-gallery-big {
        border: none;
    }

    Please remove it. If that does not help, please start a new thread and post the link to your page.

    Cheers!
    Yigit

    #1233812

    Hello, I am a bit puzzeled after trying different ccs examples I found on this blog.

    I try to enable a border around a form field to enter an email addres:

    Any help on this?

    URL: https://www.hetoudeposthuys.nl/test/

    CODE:
    <script type=”text/javascript” src=”http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js”></script&gt;

    <form method=”post” name=”subscribeform” id=”subscribeform” enctype=”multipart/form-data”> <table border=0> <tr> <td><div class=”required”>Email</div></td> <td class=”attributeinput”><input type=text name=”email” value=”” id=”email” size=”40″></td> </tr> </table> <input type=hidden name=”htmlemail” value=”1″> <input type=”hidden” name=”list[2]” value=”signup” /> <input type=”hidden” name=”subscribe” value=”subscribe”/> <button class=’button’ onclick=”if (checkform()) {submitForm();} return false;” >Subscribe</button> <div id=”result” style=”color: black;”></div> </form>

    <script type=”text/javascript”> function checkform() { re = /^\w+([.-]?\w+)@\w+([.-]?\w+)(.\w{2,3})+$/; if (!(re.test(jQuery(“#email”).val()))) { jQuery(“#result”).empty().append(“Please enter a valid email address”); jQuery(“#email”).focus(); return false; } return true; } function submitForm() { successMessage = ‘Thank you for your registration. Please check your email to confirm.’; data = jQuery(‘#subscribeform’).serialize(); jQuery.ajax( { type: ‘POST’, data: data, url: ‘https://mailing.hetoudeposthuys.nl/?p=subscribe&id=3&#8217;, dataType: ‘html’, success: function (data, status, request) { jQuery(“#result”).empty().append(data != ” ? data : successMessage); jQuery(‘#email’).val(”); }, error: function (request, status, error) { alert(‘Sorry, we were unable to process your subscription.’); } }); } </script>

    #1233952

    Hi,


    @davidhorstman
    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

    CSS Snippet:

    
    #email {
        border: 1px solid #e2e2e2 !important;
    }
    
    

    Best regards,
    Yigit

    #1233955

    Hi Yigit;

    Thanks, that works!

    Another problem now is that if I add this code to a page with content, like text and images, all the images do not appear.

    Please see screendump:
    https://www.hetoudeposthuys.nl/wp-content/uploads/2020/07/FireShot-Capture-003-Locatie-Het-Oude-Posthuys-www.hetoudeposthuys.nl_.png

    Any suggestion on how to resolve this?

    Thanks David

    #1234680

    Hi,
    Sorry for the late reply, do you mean that this css is causing your text and images to not show on the page in the Private Content area?

    #email {
        border: 1px solid #e2e2e2 !important;
    }

    I took a look at your page and tested the css but found the text and images loading well. Has this been resolved?

    Best regards,
    Mike

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