Hi baiker,
Can you try adding this code at the bottom of functions.php:
function mygallery_thumbnails(){
?>
<script>
(function() {
const thumbnails = document.querySelectorAll('.avia-gallery-thumb a');
thumbnails.forEach(el => {
const width = parseFloat(el.getBoundingClientRect().width) * 0.84;
el.style.height = width + 'px';
});
})();
</script>
<?php
}
add_action('wp_footer', 'mygallery_thumbnails');
The code will basically get the width of the thumbnails and adjust the height with respect to the width of the thumbnails to remove those extra spaces below.
Let us know if this helps.
Best regards,
Nikko
This reply has been marked as private.
Hi,
I get an issue in the WooCommerce Product Gallery when enabling the “Product Video for WooCommerce” plugin in Enfold.
You can see the normal gallery view here:
Test Site Link 1
And the gallery when enabling a video:
Test Site Link 2
I already selected “using a page builder” in the settings, but the whole gallery view and thumbnails seem to shrink somehow?
Do you have a solution to fix it?
Best regards
hi support team
I would like to change athttps://www.laden70.ch/shop/ the image size woocommerce_thumbnail size / shop_catalog from 450/450 to 450/800.
i load the simple size plugin and change the value:
woocommerce_thumbnail size Maximum width
450
Maximum height
800
Public name
woocommerce_thumbnail
Cropping
Yes
Show in post insertion ? Delete
and
shop_catalog size Maximum width
450
Maximum height
800
Public name
shop_catalog
Cropping
Yes
Show in post insertion ? Delete
alos i add in funktions.php of the child theme:
add_image_size( ‘woocommerce_thumbnail’, ‘450’, ‘800’, true );
add_image_size( ‘shop_catalog’, ‘450’, ‘800’, true );
but in the simple impage size plugin in the Thumbnail regeneration section are stil the old value.
What did i wrong?
All the best,
Pascal
Hi,
To hopefully end this debate
This is the data from an original testfile which was on my server at the moment when i made that screenshot
As obvious: It contains metadata.
maskenzauber.com/temp/IPTC-with.jpg
This is the so called thumbnail (705×470)which has been generated by Enfold from the testfile.
It contains no more metada
maskenzauber.com/temp/IPTC-without.jpg
And more:
There is no difference between metadata & IPTC
IPTC IS metadata.
Its just a standardized vocabulary.
Tipps:
1: Google for “photographer Enfold” or “Fotograf Enfold” and find some
2: Do a sitesearch for the founded sites (site:domain) in imagesearch
3: Flip through the images and check some images and you will find what i described
Hey Ismael,
thank you for checking.
1) Muting the video does not change anything. I do not want the video muted anyway. Neither do I want autoplay. I just need to show the thumbnail and then play the video with sound once it is clicked.
2) Did you check on mobile? On my end it only works on desktop. Checking with a Samsung Galaxy S20+.
Thank you and best regards!
Hey Nicco
That works for Desktop View. On Mobile view, there is now some space between the thumbnail rows. I could live with it, but if there’s a solution…
René
-
This reply was modified 5 years, 2 months ago by
baiker.
Hi baiker,
Some of the thumbnails are slightly larger than the others which causes the issue.
To fix it, try adding this CSS code in Enfold > General Styling > Quick CSS:
#top #wrap_all .avia-gallery-thumb a {
height: 82px;
}
Hope it helps.
Best regards,
Nikko
Once again:
3: Enfold deletes the metadata from the images, at least for every image which is generated by Enfold
Example: The original image “test.jpg” contains all IPTC-data, the image “test-845×684.jpg” (which is an Enfold-thumbnail) has no IPTC-data anymore.
(you can easily check it yourself by adding this plugin into your Chrome or Firefox: addons.mozilla.org/en-US/firefox/addon/iptc-photo-metadata-inspector/)
Hi,
Thank you for the inquiry.
In the blog post element, you could select a different thumbnail from the Styling > Preview Image Size settings. Have you tried it? However, it is best to always upload images with the same size and aspect ratio to get a consistent grid.
Best regards,
Ismael
Hi
I use a on pages Gallery, big picture with thumbnails below, Gallery (845×684), and same size for all thumbnails (Portfolio 495×400).
But even when all pictures have the same size, there are caps/spaces between the thumbnails. Got this problem on different Pages.
What is here the problem? See for example Link in private content.
Thanks
René
Hi,
HOWEVER it is now creating 7 sets of each image !
Those thumbnails are probably from another plugin. In Enfold > Performance > Responsive Images And Lazy Loading section, you could enable the Image Thumbnails Info option to display all registered thumbnails from the theme and from other plugins, including the name of the thumbnail and their sizes.
Best regards,
Ismael
You’ll need to use Chrome Lighthouse, or the 3G throttling mode to see what I am referring to. On that page or related ones, with a 3G throttle:
– logo loads after menu
– all the related product thumbnails load before the main image (because they are above the fold due to description tag not yet expanding)
– +/- buttons for quantity load
– description tab loads pushing thumbnails below the fold
– then main product image loads
The core web vitals scores in Lighthouse demonstrate this with very different scores compared to an unthrottled test like GTMetrix.
Thanks,
Jason
I have seen older threads like this one
so I have used the filter below in my child theme
`function ava_image_sizes() {
remove_image_size(‘widget’);
remove_image_size(‘featured’);
remove_image_size(‘featured_large’);
remove_image_size(‘extra_large’);
remove_image_size(‘portfolio_small’);
remove_image_size(‘magazine’);
remove_image_size(‘masonry’);
remove_image_size(‘entry_without_sidebar’);
remove_image_size(‘entry_without_sidebar’);
remove_image_size(‘entry_without_sidebar’);
}
add_action( ‘after_setup_theme’, ‘ava_image_sizes’, 11 );
and it has reduced the number of sizes created – HOWEVER it is now creating 7 sets of each image !
here is a record of one of the images
https://gccre.com.au/wp-content/uploads/2021/02/image-creation.pdf
Hi,
@smarta-brett: Please refrain from opening up old threads and create your own ticket instead. The inquiry form is located in the following page.
// https://kriesi.at/support/forum/enfold/#new-post
We replied here: https://kriesi.at/support/topic/media-upload-and-enfolds-thumbnail-sizes/#post-1278521
Best regards,
Ismael
Hi,
As recommended by @Guenni007 above, you could use the provided filter to disable the default thumbnails and prevent regeneration of images that were registered by the theme.
// https://kriesi.at/support/topic/media-upload-and-enfolds-thumbnail-sizes/#post-1270140
Best regards,
Ismael
Screenshot is not necessary.
I solved the problem in another way: “… changed Gallery styling from “Small thumbnails” to “Big image with thumbnails below”, which allows better navigation between thumbnails and full-view images.
In the older “Small thumbnails” Gallery styling, it was certainly possible to scroll through the linked images in full resolution using the arrows – and animated closing symbol. I don’t mean the arrows on the keyboard, but the ones on the screen – similar to the Slider “Slideshow control” element.
This option seems to have been removed in some newer versions of the Enfold template. Could it be so?
If so, then the current “Small thumbnails only” styling is very little usable.
—
However, sometimes it is more convenient to have thumbnails the right.
Can you please add the option “Big image with thumbnails right” to the “Gallery” – “Styling” tab?
—
Thank you for your cooperation and please move the theme for the new gallery style“Big image with thumbnails right” to the list of requirements in one of the next versions.
Best regards,
ViBe
-
This reply was modified 5 years, 2 months ago by
VB_web.
Hi
I am working on this problem too
I have a situation where I have a site that is importing real estate listings from a hub – the site only needs 2 thumbnails of a certain size (one for from end and one for admin/media library) and 3 larger images of a certain size for the font end
it seem WP & Enfold crate 29 versions of each image
I have worked out which images I need to keep
eg
18195851__1612125956-22539-Office1-300×225.jpg
18195851__1612125956-22539-Office1-300×200.jpg
18195851__1612125956-22539-Office1-845×684.jpg
18195851__1612125956-22539-Office1-scaled-800x500_c_epl_slider.jpg
18195851__1612125956-22539-Office1-2048×1536.jpg
and all these are not needed
18195851__1612125956-22539-Office1-100×100.jpg
18195851__1612125956-22539-Office1-1030×773.jpg
18195851__1612125956-22539-Office1-1210×423.jpg
18195851__1612125956-22539-Office1-1500×1125.jpg
18195851__1612125956-22539-Office1-1500×430.jpg
18195851__1612125956-22539-Office1-1500×630.jpg
18195851__1612125956-22539-Office1-1536×1152.jpg
18195851__1612125956-22539-Office1-180×180.jpg
18195851__1612125956-22539-Office1-2048×1536.jpg
18195851__1612125956-22539-Office1-260×185.jpg
18195851__1612125956-22539-Office1-36×36.jpg
18195851__1612125956-22539-Office1-495×400.jpg
18195851__1612125956-22539-Office1-705×529.jpg
18195851__1612125956-22539-Office1-710×375.jpg
18195851__1612125956-22539-Office1-768×576.jpg
18195851__1612125956-22539-Office1-80×80.jpg
18195851__1612125956-22539-Office1-845×321.jpg
18195851__1612125956-22539-Office1-845×684.jpg
18195851__1612125956-22539-Office1-scaled-120x120_c_epl_slider.jpg
18195851__1612125956-22539-Office1-scaled-400×300.jpg
18195851__1612125956-22539-Office1-scaled-800x500_c_epl_slider.jpg
18195851__1612125956-22539-Office1-scaled.jpg
18195851__1612125956-22539-Office1.jpg
how can I add these to the above code for my child there functions.php file
maybe
remove_image_size(‘1030×773.jpg’);
would that work ?
or do I need it without the .jpg ?
Hi Guys
some of that coding is way above me but seems it may be the key to my problem – however I do know how to add code to my child themes functions.php file – though often I have no idea what the code means!!
I have a situation where I have a site that is importing real estate listings from a hub – the site only needs 2 thumbnails of a certain size (one for from end and one for admin/media library) and 2 larger images of a certain size for the font end
the site is at https://gccre.com.au/
is there code to control what images are created when they are imported?
currently it appears that Enfold is creating many different sized images that are wasting a lot of server space
the images it uses seem to be just
300×225 for the media library
300×200 for the front end thumbnail
800×500 for the listing image
and the full size image for a clickable larger pop-up image from the listing images
my question is – is it possible to set it so only those image sizes are created from the import?
I’m not too worried about quality as I have Short Pixel that can set the compression quality and max size
if you could supply me with the code that would do this I shall be eternally grateful!
Hi smarta-brett,
We apologize for the inconvenience.
You may want to check on Guenni007’s post here: https://kriesi.at/support/topic/media-upload-and-enfolds-thumbnail-sizes/#post-1270140
It would require using a child theme, you can download and find instructions on how to use it here: https://kriesi.at/documentation/enfold/child-theme/
Best regards,
Nikko
Hi
I posted this a few days ago and have had no reply – I’m hoping this one will have more luck ;-)
It’s getting kinda urgent!
I have a site that is importing real estate listings from a hub – the site only needs one thumbnail of a certain size and one larger image of a certain size
is there setting to control what images are created when they are imported?
currently it appears that Enfold is creating many different sized images that are wasting a lot of server space
Hi all team members, I have the problem similar to described here:
—edit—
I changed Gallery styling from “Small thumbnails” to “Big image with thumbnails below” – it’s much clearer.
However, sometimes it is more convenient to have thumbnails the right.
Can you please add the option “Big image with thumbnails right” to the “Gallery” – “Styling” tab?
—
https://kriesi.at/support/topic/portfolio-grid-images-not-showing-3/
“… still failed to add the IMAGE ARROWS for pictures convenient visiting.
Every time when I click a picture, it will show a new page with that picture only, without any arrows …”
I don’t mean the arrows on the keyboard, but the ones on the screen – similar to the Slider “Slideshow control” element.
There are no navigation (left / right, closing symbol … ) in gallery image with full view, simple image only.
Recommended plugin “Enable jQuery Migrate Helper” installed and set to “Legacy 1.12.4 – wp” – no changes.
After display a selected picture, still picture only, without any navigation …
Some months ago my galleries were O.K.
—
WordPress version 5.6.1
Enfold 4.7.6.4
—
Can you help me?
ViBe
—
Nobody knows?
Missing navigation is bad for our customer …
-
This topic was modified 5 years, 2 months ago by
VB_web.
I figured out how to do part of this – for the home page ALB blog posts in grid layout, but I need some help tweaking it. If I use the .small.avia-copyright within the Featured Image, then I can display it on the home page using the following selector. However, the following is tied to a specific post – how do I streamline this CSS so that it pulls the .small.avia-copyright for whatever post is appearing in the content slider?
#featured-news > div > div > div > div > div > div.flex_column.av_three_fourth.flex_column_div.av-zero-column-padding.avia-builder-el-5.el_after_av_one_fourth.el_before_av_hr > div.avia-content-slider.avia-content-grid-active.avia-content-slider1.avia-content-slider-even.avia-builder-el-7.el_after_av_textblock.el_before_av_hr.post-featured-news > div > div > article.slide-entry.flex_column.post-entry.post-entry-5416.slide-entry-overview.slide-loop-1.slide-parity-odd.av_one_half.first.real-thumbnail.post-format-standard > a > small {
display: block!important;
}
Hiu
I have a site that is importing real estate listings from a hub – the site only needs one thumbnail of a certain size and one larger image of a certain size
is there setting to control what images are created when they are imported?
currently it appears that Enfold is creating many different sized images that are wasting a lot of server space
It does not work, maybe I I didn’t set the css correctly,
One more thing I need to hide the header in some pages like portfolio items https://cincomilmillas.com/portfolio-item/jam-flamenca-gestalguinos/
and maybe in some pages more ,like tienda (in woocommerce)
https://cincomilmillas.com/mi-cuenta/?preview_id=1684&preview_nonce=37f25d9c49&_thumbnail_id=-1&preview=true
or https://cincomilmillas.com/mi-cuenta/?preview_id=1684&preview_nonce=37f25d9c49&_thumbnail_id=-1&preview=true
I want to hide the header in this pages because the links in the menu does not work
Too many things I know…
Thanks a lot
Hi,
is there a way where both can work together?
This may not be possible because when the responsive image option is enabled, WP will automatically select the appropriate size based on the current screen resolution instead of the selected thumbnail. Did you refresh the site or purge the cache before regenerating the images? Please make sure that the site is using the latest version of the theme, 4.7.6.4.
Would you mind providing the WP and FTP login details again so that we could test it properly?
Best regards,
Ismael
I am using the Media Elements component, Gallery on the website at https://www.ciadaspersianas.com/produto/papel-de-parede-rio-de-janeiro/
However, when I click on the thumbnails the image opens without the ability to move the images (left arrow and right arrow).
How do I do that?
How do I open the image and be able to switch images?
thanks
Hi,
you know what IPTC-data is?!
iptc.org/
Its a kind of important metadata, specially regarding SEO.
Issues:
1: The metadata field “Copyright” does not grab the content from the appropriate IPTC-fields (you can easily check it yourself) out from the image when uploaded to the medialibrary like it does with “Titel” & “Beschriftung”
This is a “pia” since users have to paste the copyright field manually on hundreds or thousands of images via medialibrary.
2: The same issue with the fields for Description (and alt-attribute. This might be not Enfolds fault but at least you should be modern and progressive enough to provide a solution in usability instead of developing gimmicks) although ALL existing IPTC & Metadata fields has been filled out.
3: Enfold deletes the metadata from the images, at least for every image which is generated by Enfold
Example: The original image “test.jpg” contains all IPTC-data, the image “test-845×684.jpg” (which is an Enfold-thumbnail) has no IPTC-data anymore.
(you can easily check it yourself by adding this plugin into your Chrome or Firefox: addons.mozilla.org/en-US/firefox/addon/iptc-photo-metadata-inspector/)
EDIT to #3:
It is not always like that, but in most cases and i have no idea under which circumstances the metadata gets lost and when not
Maren
Hi Mike,
the speed person regenerated the thumbnails which fixed the issue of the post slider images on my home page, blog and destination pages. However, the featured images on the posts are still thin. This person keeps saying its a theme issue but it’s not. I scrolled up in this thread and it seemed like you said before Jetpack is the problem. Can you check on this? I want the images to be the size the image is on my Destinations page. The difference is the destination page is built with Avia where as the posts are in classic editor and I do not have as much direct control over the image size.
Hi Ismael,
we’ve disabled the responsive option and the imges get displayed with the correct cropping position in the page but in the dropdown the sizes are still wrong. Unfortunately the responsive thumbnails of the images don’t get loaded… is there a way where both can work together?
We’ve insert the snippet and regnereated all thumbnails but the size didn’t change…
Regards,
Sebastian.