Why is image in detail page scroll able?
This topic contains 17 replies, has 4 voices, and was last updated by Paolo 7 years, 3 months ago.
We have moved to a support ticketing system and our forums are now closed.
Open Support Ticket-
AuthorPosts
-
January 4, 2018 at 2:56 am #411385
Hi, it used that the main image would be shown at the top of the detail page for every listing.
Now, when the images are a bit big only a portion of the image gets shown and to see the rest you have to scroll down, but you never really get to see the hole image, you either see the top half or the bottom half. I would like to see the complete image as before, at some point the changed, how can I make it show the complete image?January 4, 2018 at 4:57 am #411387Hi Rigots,
Well, that’s how it works by default. Check out this example https://wpgeo.directory/supreme-directory/places/united-states/west-virginia/fayetteville/restaurants/chez-jice/ . If you wish to display the entire image without scrolling. Use the custom CSS code below. Not sure if it’s what you’re looking for.
.featured-img { background-size: contain!important; } .featured-area { min-height: 1100px!important; }
Thanks!
January 6, 2018 at 10:21 pm #411763Hi, I used
.featured-area {
min-height: 1000px!important;
}
to make the featured image in the detail page to a minimum height of 1000 pixels. But now it forces all my pictures to 1000 pixels. There are some pictures that are small and by default they were being stretched to 800 px, now with this change they are being stretched to 1000 pixels high.Is there a way to only stretch the pictures to 1000 px only if they are be bigger than 800 px in height?
I don’t want to stretching small pictures too much.Thank you.
January 8, 2018 at 3:22 am #411871Hi, if I use:
.featured-img {
background-size: contain!important;
}It completely messes up my home page, so I will just leave this alone and let the featured image be scroll able and only show part of the image as the featured image on each detail page of each listing.
I will provide you with login details, test it out. when you add the above css my home page goes completely bad. I don’t want to change anything in my home page, I just want to change the features image on the detail page when you click on a listing.
Now, I see a similar problem on my cell phone, when I view any listing the featured image is zoomed in. Why can’s I just see the full picture. Why can’t the theme just resize the picture to fit the picture windows instead of cropping the picture to fit the picture window?
Thanks,
RigoJanuary 8, 2018 at 3:24 am #411872This reply has been marked as private.January 8, 2018 at 4:34 am #411878Hi Rigots,
Unfortunately, that’s how the theme works. It is designed to fit all images into the container. Using custom CSS to manipulate it is the only way. But you won’t get the desired results if you’re using different image sizes. Let us know if you need anything further.
Thanks!
January 8, 2018 at 5:00 pm #411959Ok, so I guess the main image to be displayed at the top of the detail page can not be resized to fit the container window to show the whole image completely. So some pictures will be cropped on the detail page depending on the image size the user uploads. If that is how it works, then I just have to live with it.
But every other listing website that I see when you click on the listing it actually shows the complete picture of the main image at the top, some how they know how to expand and contract the image to fit the container window.
Thanks,
RigoJanuary 9, 2018 at 9:23 am #412032Hi Rigo,
Thanks for your reply. Could you share those listing websites you’re referring to? It might give us some ideas.
Thanks!
January 9, 2018 at 8:45 pm #412114Hi,
When I see a user upload a listing with picture that does not show properly I download the image, resize it and upload it again, so my current listings don’t have that problem, but I need to continuously do that and it is annoying.I am attaching here one of the user pictures that causes this problem, you can create a listing with this picture and you will see what I mean.
The image is 684×751, so it is taller than it width. I think is is when the problem happens when the image is taller than the width.
Attaching image.
January 10, 2018 at 3:29 pm #412187Hi Rigots,
Thanks for your reply. I’ve just created a listing here https://www.partycoop.com/?post_type=gd_service&p=981 and the featured image looks stretched. Is this what you’re trying to show me? If you are, you need to make sure that the uploaded image is at least 1400 wide in media settings as explained here: https://wpgeodirectory.com/docs/supreme-directory-overview/ (Listing Detail Page section)
January 10, 2018 at 6:59 pm #412209Hi Kor,
The issue is that when a portrait image is uploaded as the featured image, you display it on a landscape container, so you can only show the top section and as you scroll down you see the bottom section. I think that it is best if the complete image is shown with a black frame the the right and left side so you can show the complete image at once.For example the new listing that you created with the image I sent you, called “GD TEST” found at: https://www.partycoop.com/event-services/california/san-jose/catering/gd-test/,
When I click on that listing I see the attached “GD Test – top.jpg” image, as you can see, the image only shows the tree top and the sky, you can’t see the tables or the grass.
Then as you scroll down see attached image (screen capture) “GD Test – bottom.jpg”, you can only see the tables, you can’t see the tree top or sky above or even the grass bellow. So you can not enjoy the complete picture, you only get to see parts of it as you scroll up and down.
I hope I was clear now. I will leave the sample “GD Test” listing up until I hear back from you and you had a chance see it, then I will delete it or move it back to draft.
Thanks,
RigoJanuary 10, 2018 at 7:13 pm #412215Hi Rigots,
the supreme child theme is not optimized for portrait images and it could never be because of it’s design.
It is as simple as that.
Thanks
January 10, 2018 at 11:02 pm #412255Got it.
Thank you.
I hope one day it can be optimized for portrait and landscape as well.Rigo
January 10, 2018 at 11:15 pm #412257Hi Rigo,
that is not possible, the featured image is wide and short (that’s how monitors are), so it can only be optimized for landscape images.
Thanks
January 10, 2018 at 11:22 pm #412258Yes, that is what I mean. Make it work for both. It already works for landscape, now make it work for Portrait. When you have a portrait picture just make it skinny so that the height fits on the container and then put borders on the left and right of the picture. That is how other websites do it.
Or just simple warn the user that the first picture is the featured image and that it needs to be in landscape mode, and if they put a portrait then, it is their fault.
Thanks,
Rigo -
AuthorPosts
We have moved to a support ticketing system and our forums are now closed.
Open Support Ticket