Viewing 19 posts - 1 through 19 (of 19 total)
  • Author
  • #182462

    I want to create our porfolio pages just like below,

    I did created this page but the problem that I’m facing is for showing images I have to go through a procedure,
    i.e. 1. I drag image from”Media Elements”
    2. I search and select my required image.
    3. Then to connect the same image with its high resolution image to show in a lightbox, I’ll need its direct URL and to find that I’ll need to Open Media Library (as wordpress doesn’t show the URL of the image when you are selecting images for image Media Element) => search again for the same image => then click on it to copy its URL => and then again go back to the portfolio entry I was working on and paste the URL.
    WHICH IS A PROCEDURE and as we have too many images for each portfolio entry and we have hundreds of portfolio entries.. which could take too long to finish only our gallery.

    So, my question is I want to use Gallery from Media Element which very simple and straight forward but the problem is,
    mean one after another vertically in big size without THUMBNAILS and already connected with Lightbox feature. JUST LIKE AJAX Portfolio.
    And the reason why I’m cancelling AJAX Portfolio style is it doesn’t provide you separate link for each entry to share on other forums.

    Sorry for my highly detailed explanation. I just don’t want too much back and forth so I tried explaining myself as much clear as possible.

    Looking forward for your Magical Support which is always very helpful :)
    Big Thanks in advance.


    Hey Khalid!

    You can choose “Small Thumbnails” as your Gallery Style and add following code to Quick CSS in Enfold theme options and adjust as desired

    #top #wrap_all .avia-gallery-1 .avia-gallery-thumb a { width: 70%; }

    Best regards,


    I tried what you said but look what’s happening,

    Pictures are faded untill I scroll down to bottom end. and once I reach to the end only the images becomes normal.
    Also it doesn’t have hover effect as well like the way arrow rotates for zooming in lightbox. Also One more thing I felt was when I was keeping images in gallery and using lightbox to open them, in the lightbox windows it has some kind of limitation for zoom level.. throug this way it doesn’t show very highres pictures in light box. But when I link Image Media content to an image manually it shows the full resolution even in light box pop up window.


    Hello khalidmuharraqi :) plz tell how u make this header menu in your web . thanx .

    • This reply was modified 7 years, 6 months ago by  Cutegi.

    u need fixed background in your beta web :)



    You can add following code to Quick CSS as well to keep opacity at 1

    .avia_transform .avia-gallery-thumb img { opacity: 1; }

    Best regards,


    Thanks a lot Yigit!
    Its working fine but still as I mentioned in my previous message,
    1. Its not showing Hover effect just like when you rollover an image the image get a bit fade and an Arrow popups for zoom in.

    2. When I click on thumbnail (large image now) image open in pop up but when I click on zoom in (right top of the lightbox) it doesn’t zoom in to actual size of the uploaded image.
    to elaborate you more I created 2 images by using Gallery Plugin and 2 images by Image Media Element. So, you can check the upper two images are not zooming in to actual size while the other two images are showing you full size of the image when you click on zoom button in lightbox.

    3. When you scroll down images pops up for no reason.

    Please help thanks.


    Hey Cutegi!
    here’s the link you can follow the instructions given by “allegrabillings”

    Regarding fix background I tried to keep a fixed background but it wasn’t really working. Was looking a bit weird when scrolling down. :)


    Any answere?



    1) Yes, unfortunately, that would require some custom work done by a freelance developer.
    2) It does on my end. If you do not mind me sending screenshots publically, i can post them.
    3) Please add following code to prevent images from popping up

    .avia_transform .avia-gallery-thumb img.avia_start_animation {
    -webkit-animation: none;
    -moz-animation: none;
    -o-animation: none;
    animation: none; }



    Thanks for your reply Yigit!
    May be we can compromise on point number 1.
    But regarding point number 2, actually it is allowing my to zoom in but to a certain level.. like if I want to zoom in and actual size is like 4000×3354 its not gonna show me the actual size which is 4000×3354.
    For example try the link below,

    under this link try to access the picture on the top named “WTC Bahrain_Day1_HR_Temo” (which show the name in tool tip)
    its actual size is 4000×3354 but now its not even showing me a buttong for the zooming in :(…
    could you please solve this issue?

    Point 3 has solved.. thanks for that :)

    Looking forward for your reply



    2) Please go to wp-content\themes\enfold\js\prettyPhoto\js folder and open jquery.prettyPhoto.js file and search for


    and change it to




    Hi Yigit!
    The code is working only when I’m using “Image Element” to keep images.
    But when I’m doing the same thing with gallery, its still not working.. :(
    please check the link below. in this link left top three images are kept by using “Gallery from Media Element” and the last three images are kept by using “Images from Media Element”.. So its working when I’m using “Images from Media Element” which as I explained earlier I don’t really want to use it..
    please have a look at the link below and compare the difference..




    It displays first image 756x1030px in lightbox which is the actualy size of the image as you can see here
    You should choose to insert images fullsize



    Sorry was shifted on another project. Now back.
    Well Still im facing the same issue,
    Check out this link again if you don’t mind please,

    On that page there are two images. The problem is when both images opens in lightbox, top one gives me its full resolution when I click on zoom in button (right top of the lightbox) but when I click on the the second picture it doesn’t show me full resolution. it feels like it just fit to the screen in second case. and in both cases I used same image with actual resolution 1181×1607. first one is been implemented by using image element and second is by using Gallery. AND I REALLY NEED TO FIX THIS ISSUE IF I USE GALLERY

    This reply has been marked as private.

    Thanks a lot for your reply Devin!
    I completely agree with you that the first image was pointing to the highest resolution available (because it was set manually)
    but the second image was done through gallery plugin which links the images automatically so is there a way that it link the images to its highest resolution images instead of choosing random size automatically. If its possible then its gonna be awesome and my problem will be solved.
    Big thanks in advance.. :)



    Please make sure that you choose No Scaling in Gallery options



    Yeah I did choose this option but somehow its still choosing a size randomly.. I don’t know why. So, that’s I asked you guys if its possible that the gallery plugin choose the actual size specially when I click NO SCALING then things would be fine.


    @josue, YOU ARE LEGEND MAN… I was looking for this solution for a long time.. but finally and accidentally I found your reply.. :)
    Big Big Thanks :D

Viewing 19 posts - 1 through 19 (of 19 total)

The topic ‘I want to show Gallery without thumbnails, under each other.’ is closed to new replies.