Forum Replies Created
-
AuthorPosts
-
December 9, 2024 at 10:46 am in reply to: Portfolio grid displays thumbnails incorrectly if they are odd #1473224
Hi Ismael.
I’m almost ready to publish. I’ll update you as soon as I’m online in order to resolve this annoying detailHi Ismael.
I had tried both solutions, including setting the selector to “.av-portfolio-grid-sorting-container”.
I’m almost ready to publish. I’ll update you as soon as I’m online in order to resolve this annoying detailHi Ismael.
I’ve done several tests and research and this is the code that solves my problem. I share it hoping can be useful to someone else.img {
height: auto !important;
max-width: 100% !important;
width: auto !important;
max-height: 100vh;
}The only visible inconvenience is related to the images in the portfolio grids that are not aligned. I therefore created this class, assigning it to the portfolio grids in Advanced > Developer Settings.
.standard_img img {
height: 100% !important;
max-width: 100% !important;
width: 100% !important;
max-height: 100% !important;
}Thanks for your time.
While waiting for a reply for the Editor and the automatic assignment to images instead of manual, I did a series of tests and the code that best solves my problem is the following, because the biggest problem is on vertical dimension:
@media only screen and (max-height: 800px) {
/* Add your Mobile Styles here */
.av-limit-image-height img.avia_image {
width: 80%;
margin: 0 auto;
}
}
On PC everything seems to work correctly, but on two Android smartphones that I tried with Samsung Internet and Chrome I do not understand why the images are scaled even though the screen resolution for both is 1080×2408 pixels.Hi Ismael.
Thanks for your input. When there are hundreds of photos to manage, manually setting each individual image is a long task and can also lead to oversights and errors. I thought it was possible to control them all with a few lines of code rather than manually.
The information to be inserted in the Style.css file is growing rapidly. Referring to your page https://kriesi.at/documentation/enfold/add-custom-css/#enable-custom-css-class-name-support , could you tell me how can I activate the Editor in Appearance? In my installation it is not visiblehttps://img.savvyify.com/image/Immagine-2024-11-27-105508.9GnBf
- This reply was modified 3 weeks, 1 day ago by icarogioiosi.
- This reply was modified 3 weeks, 1 day ago by icarogioiosi.
Hi Ismael.
Thanks for your suggestions and your time.
Obviously the first proposed code distorts the image and is not what I would like.
Maybe it’s my fault, maybe I explained myself badly.
I would like the images to resize while maintaining the proportions, as happens for example when looking at them on a smartphone: for example horizontal photos are visible in their entirety because they are automatically adapted to the screen, while maintaining the ratio between dimensions (e.g. 4:3 – 16:9).
Furthermore, you advise me to set the Custom CSS Class name in Advanced > Developer Settings for each individual image, while I would like to force the automatic resizing system (especially for vertical images) which already works correctly in other situations.
Also, how can I activate the Editor in Appearance? In my installation it is not visibleHi Ismael.
The code doesn’t seem to solve the problem.
The site is under construction, therefore not visible because it is in maintenance mode.
I created a WordPress user whose data I sent privately, as well as the link to the page from which I took the screenshots.Hi Mike.
I’ll try to explain using images.
The first two show how the inserted images can be seen entirely on large screens (in this case 1680×1050).
https://img.savvyify.com/image/1065×800-image-1680×1050-screen.9G3xM
https://img.savvyify.com/image/600×800-image-1680×1050-screens.9GOfAThe second two instead demonstrate how the images behave on smaller screens (in this case 1360×768).
They are not visible in their entirety because the automatic scaling is probably calculated on the horizontal dimension and not on the vertical one.
https://img.savvyify.com/image/1065×800-image-1360×768-screen.9GSb3
https://img.savvyify.com/image/600×800-image-1360×768-screen.9GXULI would like the 800 number to be read correctly in both cases, but especially for the vertical image.
Perfect!
Once again, thanks for your time Guenni007.Hi Rikard.
About this topic your team has been very fast and effective.
But I’ve another topic still open without a solution.Could you be so kind to take a look, please?
Hi Guenni007.
I understand your point of view but the pages are still under construction and therefore not public.
But a solution can also be evaluated at https://enfold.webers-webdesign.de/enfold-photography-portfolio/, isn’t it?If you would like to get a reduction as indicated with the arrows in this image
https://img.savvyify.com/image/01.97WJUto achieve this result
https://img.savvyify.com/image/02.97a1ehow could you do it?
Great solution Ismael. Thanks for your time
It works!
Thanks for your time Guenni007.
About Mike’s proposal “A color section added padding/margin to the footer page, or you can try adding the 3 columns without a color section in your footer page.”
Footer height remains an issue.Using only widgets consisting of 3 lines of text and a title, there is a huge amount of empty space both above and below.
https://img.savvyify.com/image/image.97nP6if I use a page by replacing the footer and socket, the space at the top is just right, but there is too much unused space below.
A footer like this is not aesthetically pleasing.
https://img.savvyify.com/image/image.97BAhThanks for your suggestion Guenni007.
Let’s see if I understood correctly. You recommend duplicating the footer.php file from the theme to the child and modifying the code of lines 311-317 and adding that of lines 11-15, right?
And the remaining code?
#footer, #socket, #footer-page {
z-index: 1000;
}
#footer-page {
position: relative;
}
Where should it be inserted? I don’t find it inside the file https://pastebin.com/JUyUhwDsThe site is under construction, therefore not visible to the public.
You can download a JPG image from the following link:
https://wetransfer.com/downloads/5fe5f19f5cd2eb83a88340c3bbc834b720241116193041/cc2b8820679df52bcee3aa06bea0501220241116193103/9ea811?t_exp=1732044641&t_ lsid=92841b41-560e-4693-9b1b-7b2c092d5f25&t_network=email&t_s=download_link&t_ts=1731785463
The footer is not as wide as the screen but only as the page content, so it is not visible under the menu. -
AuthorPosts