Image Gallery Element Tutorial | Elementor
HTML-код
- Опубликовано: 21 окт 2024
- Fix the border problem: .gallery a img { border: 0 !important; }
In this video I will show you how the 'Image Gallery' Element in Elementor 2.0 works. Get Elementor here: ferdykorpersho...
Ferdy, thank you for the videos. They are great. My question with this video is in the Image size. Your pull down Woocomerce is nowhere to be seen in my Free Elementor. Is this Elementor Pro functionality?
Ferdy this video is great. I wanted to ask, my image gallery is slowed Down. I am a photographer, when I am trying to add more photos to my gallery its loading very veerrryyy slow. Rest everything is fine. What should I do? Is it because my photos are high quality?
Hi Ferdy,
I do not have Wowcommerce for Image size, is it only with Pro?
Hi Ferdy, mooie presentatie hoor. Maar wat is woocommerce en kan ik ook een link in een afbeelding zetten? Dus bijvoorbeeld eerste foto's op de homepage kan zetten van bijv een landschap en als ze dan op de foto klikken men dan naar de galerij van "Landschappen" gaan. Alvast bedankt! Groetjes, Ron.
So do I need the woo commerce plugin ? As you used it to stretch the images to all match. I don’t have woo commerce and I don’t get the option to make them all the same size? Cheers
I use the Pro version and I have only 5 image sizes to choose from. Nothing of WooCommerce mentioned. Could you clarify that, plz?
@@wantedsavage7776 woocommerce is a webshop pluging
Ferdy? What about each photo that has a link? How can i make a gallery of each photo that when i click it, it will lead me to my post per photo ?
You can incorporate the html for a link directly into the caption text. E.g. Lorem ipsum
this helped simple and straight forward
hey can we have gallery where we can insert video as well? in the same layout? images will b around and video will be center?
have you find the way to do it? Thanks
Hello. Thanks for the video. Is there a way to have gallery images in a non squared aspect ratio while not worrying about large file sizes? Or do I have to create all images at lower file sizes manually in Photoshop. In other words, I'd like to upload a bunch of images in a wider format, yet I'm not sure what quality I should upload them at. Do I need to save them at lower quality in Photoshop, or will Elementor automatically reduce quality (file size) if I upload original quality. The whole retinal thing confuses me, because I don't want to upload too small or too low-quality for images pulled for retina devices. Any help would be appreciated. Thanks.
Thanks for the tutorial. Very clear and quick instructions. My clients expect to see image file numbers which unfortunately is not an option with this gallery - unless I'm missing something.
Hoi Ferdy, mijn afbeeldingen komen niet zo mooi strak naast elkaar te staan als bij jou. ik heb geen woocommerce plugin. en het maakt niet uit welke afbeeldingen grote ik gebruik. Er vallen grote gaten tussen de afbeeldingen. ik vind het ook niet prettig dat er een menu rechts boven in komt waarmee je de foto kunt downloaden, en of op socioal media kunt plaatsen.
Hey Ferdy, top video! Ik heb wel een vraagje, ik heb nu een gallerij foto's op een pagina geplaatst, deze wordt mooi in een rechthoek op de pc weergegeven alleen geeft hij deze op de telefoon onder elkaar weer, kan jij mij vertellen hoe ik deze in bijv. een rechthoek of vierkant naast elkaar krijg op de telefoon? Groeten, Jeffrey
hello, i suppos wocommerce plugin must be installed in order to have woocommerce thumbnail option no? coz in 2021 free elementor i dont have this option . and my images size are all differents and it's really starting to break my balls...
Same,hv yu got any other option?
Hi Fredy,
I am trying to fix the border problem you mentioned in the video but can't figure out how to do it.
Any tips?
Cheers
Thank you once again ferdy. You really make the best elementor tutorials :))
Thanks for the code snippet! It worked.
Thank you. Very helpful. Real and useful explanations
Hey Ferdi, thanks for your tut. Do you have any suggestion how to make a adjusted or masonry style gallery in Elementor? Is there a css hack?
The first part,...the screen that shows "add new section" & "add template"... Why don't I have that? The Gallery widget is no longer free so I dragged the basic 'gallery' over to my page and it disappeared. Like I didn't drag it. And the only way I can figure out how to start over again is to go out without saving and go back in. I refuse to pay. Can you give me any direction or maybe update your video, please?
Thanks Ferdy. Can you create an updated 2022 version?
Do you have a video showing how to add an image to a gallery using Elementor?
Do you have any advice blured thumbnails? Thanks :)
Hi. I built a portfolio with elementor and my intention is that when clicking on an image a popup or lightbox appears to generate a slide. Could you guide me? Thanks.
Great Job Ferdy.... This is exactly what I needed...
thank you for the video but in the image size I do not have all them options such as the woocommerce as you showed. I only have thumbnail, medium, medium large, large and full. Is all the ones you have only available on the pro versions?
add the woocommerce plugin to see it
When uploading photo's to our websites, which image size works best? I have a few uploaded to my site and when I run seo checks it reports back that the image sizes are too large and should be smaller. I try to compress the images but doesn't seem to help.
I love your talent bro...
Good video, but how about mobile version? For mibile they haven't options and it's look not good.
very nice... i have learned many things from here and i am also making wordpress tutorials in urdu, hindi language...
This is not the same thing as doing posts right? I'm using the free version of elementor.
Hi Ferdy, I see you are able to sort the images in your tutorial. In the gallary I made this look not possible, do you have an explanation for this?
thank you. I couldn't get all the pictures to be the same size, it was driving me crazy
How do you change the slide animation when in lightbox view. Yours slide right to left, mine just click through without any movement right to left. Can you also make them fade in rather than slide?
Hi Ferdy. Thanks for all the pieces of training.
You are welcome Mark!
Hi I have several Image galleries on same page. In the Elementor Editor, when I click on a gallery it only will show me the images in that gallery (counter 1/3). This is how I want it. Unfortunately when I update and view , and I click on same gallery to stroll (i see counter 1/95) - I will show me all the images on the pages. How do I stop this from picking up all the images on the page?
Wonderful videos! Thank you so much for all the tutorials!!!
Any way to make the captions float over the picture and then when picture is clicked, it links to a certain page on your site? I want to make a visual menu grid. If it doesn't, could you point me to something that will accomplish my goal. Thanks!
Good and helpful video. good work
How to add more IMAGE SIZE setiing - like You have the WOOcommerce Thumbnails?
I hv tge same doubt.have yu got it?
@@followyourdreams6851 no, but didn't try it more then 3 times.
@@TomaszTwojFotograf any other method to make gallery without plugin?
@@followyourdreams6851 I have made a standard Elementor free gallery - and make it withouth the filtering.
@@TomaszTwojFotograf how?
how to do images gallery in one post? because i just want have post with many images or videos which for every new post, i dont need to add new pages, but just update post
HI Ferdy, I wondered whether you could advise? I am working on a site for an artist friend. I would like to display her work, which is of various random sizes, and would like to add a little descriptive text beneath each image. I am thinking of painting title and a short description perhaps. Could you recommend a method of doing this? Thanks in advance.
4 years and still no reply.
I fixed the border problem without going into code, finally. In edit mode in Elementors gallery, under STYLE (and NOT Advanced settings) and then IMAGES, chose Solid border and then enter 0. Voila!
You asked for suggestions about removing the border around your images. I noticed when you added the Caption, there was a background color to the Caption area. Could it be because you chose for the size, the WooCommerce size and it is a color in that area? Just a suggestion. Great video, just like you always do. Thank you!
Hi John, thank you for your comments. I tried a few things but I did see no change. I found out it can be fixed by using this code in the custom css area of the element: .gallery a img { border: 0 !important; }
I use the free version of elementor and I really like it. I only have one problem.
I want to use the basic gallery in my WP post and everything looks fine at first sight. But when I hover my mouse over the content (and even over the text about this element) I constantly have an annoing hover animation. Every picter becomes bigger and most images overlap each other.
I also have it when I use the WP gallery and it's driving me insane. Watched multiple tutorial video's and no one seem to have this problem.
Do you have an idea of how to fix this?
p.s. I found out that this problem appears only in the WP blog post, with elementor. On other pages it all works fine
what about if I want to create a photo album and not a gallery? How can we make this with elementor?
Hi recently i have watched your videos they are really great. i have a problem in my shopisle my product gallery is broken after updating woocomerce to 3.0. and now i dont how to fix it. i have also added that code to function.php in theme editor but that mess the pictures.
I love your videos, great teacher, keep up the good work! :)
Ik zag in de gallery edit een paar woocomerce items staan, die staan er bij n iet in. Hoe krijg ik deze erbij in?
Please can you tell me how to make my grid 2x2 instead of 1 x1 in mobile view? Even the basic gallery in Twenty Seventeen does this by default! I see people asking this since 2016!
Responsive Gallery Column Width Feature in Piotnet Addons For Elementor can do it pafe.piotnet.com/#responsive-gallery-column-width
My photos don't want to load up i made the page with skt theme i downloaded and when i use elimentor to load it i cant see the photos can someone help please?
Ferdy, great series man! Quick question -- when I am adding images to my gallery, they often only show the photos as partially loaded. The thumbnail view is fine but if I then click on the image to enlarge it in my lightbox, the image is only a partial image. Are my images too large? If so, what is a good size to make my images? Is there another reason as to why this could be happening? Thanks and best
sorry to be offtopic but does any of you know a tool to log back into an Instagram account??
I was dumb lost the login password. I love any tricks you can offer me
@Kylen Leighton Instablaster :)
@Josue Finn thanks so much for your reply. I found the site thru google and im waiting for the hacking stuff atm.
Looks like it's gonna take a while so I will get back to you later when my account password hopefully is recovered.
@Josue Finn it worked and I now got access to my account again. I am so happy!
Thank you so much you saved my account!
@Kylen Leighton Glad I could help xD
I don't think the gallery comes with the free version any more, though
HI Ferdy, Thank you for this tutorial. How can you make an image gallery responsive on mobile? I would like to have 10 columns on a computer screen and 4 columns on a mobile. Is it possible ? Thanks for your help...
Struggling with this same issue right now. Any solution yet?
Responsive Gallery Column Width Feature in Piotnet Addons For Elementor can do it pafe.piotnet.com/#responsive-gallery-column-width
Hello Fredy, can I add a filter bar for the image gallery?
If you do not see that option you can't.
Thanks Ferdy Korpershoek for your help full video. I want to know
In Elementor, have any slider image function?
You are welcome Mizan. The PRO version of Elementor has a slider. ruclips.net/video/TvcCt9xhD5Y/видео.html
yeah... offcourse... image carousel element is used for making image slider in free elementor basic
thanks ferdy
I like you quick and succinct style.
Thank you Peter
Very helpful, I Must try this on my web site. Thnaks Ferdy.
You are welcome Neil!
You are the best. thanks Ferdy
Thank you Sensei Grant!
Good and Crispy Content brother
hi Ferdy, How do you get those image size options? I only have thumbnail, medium, medium large, large and full.. please??? thanks
Maybe it is updated and not possible anymore.
you have to have WooCommerce installed as a plugin. I didn't have it, I added it, and now it's fine :)
Useful info. Thanks.
How to show title bottom of the every image?
Thank You Fredy
How do you get those image size options?? I only have thumbnail, medium, medium large, large and full..
I don't know why your options are different. Maybe a newer version of Elementor?
Install WooCommerce it will appear image size option.
Hm, well that plugin gave me those image size options but the thumbnails were still uneven.
When i installed that I got a cart in my menu. Any idea how to get rid of it?
Thank you. 2022 - there is no Woocommerce option anymore :/
What about woocommerce gallery images? How to customize that?
You must install the WooCommerce plugin free from wordpress plugin store
:)
Ferdy... good night....please help me: I have 50 images and I want to justify the size of all of them and I also need a navigation bar to be shown in blocks of 9 to 9. There will be some free plugin that does this in elementor pro. Thanks for your help
You great Ferdy. My hero
It's a shame that the image gallery does not offer any options for hovering over the thumbnail images. Disappointed with Elementor already :(
Give them a change. They are amazing!
Thanks for your help
Treasure in 5 minutes❤️❤️❤️
it's not COMPLETE , you didnt mention about mobile view == ~~~~
I have other tutorials about that. By default Elementor does a great job in creating a mobile view.
You are a great man
Thank you Y Abbasi!
Please can you tell me how to make my grid 2x2 instead of 1 x1 in mobile view? (2) this is what I'm lookin for
Responsive Gallery Column Width Feature in Piotnet Addons For Elementor can do it pafe.piotnet.com/#responsive-gallery-column-width
thanks a lot
Bedankt! :)
Thanks
Thanks....
you went right past how to add an image to the gallery....you go too fast and I can't follow. I realize your video is for free, but you go too fast for a complete beginner to follow.
Hello ferdy I am 3thd
Hia Cio! That is great :)
CoOL
Your videos are amazing too mate!
Ferdy Korpershoek are you freddy or ferdy ? Lol most of time i mispell your name as freddy anyways is it possible that we can have a private chat