Hello,
I am a beginner. I have questions regarding the Post featured image "Display options" and "Post selection" settings.
My objective is to display featured images (aspect ratio proportionate) and not permit the featured image to display larger than 620px in height, although the width can extend up to the max width of the column.
1. If I select "Custom size" > enter 620px for the height and leave the Featured image width blank, would this limit the height of any featured image to 620px?
2. Would the "Keep original proportion" display the proportionate aspect ratio of the image up to the 620px limit set above, without cropping?
3. How do I determine what to select for "What to display"?
Hi Charles,
Thank you for contacting Toolset support team.
I'm Mohammed, I will be happy to help you with your request.
Actually, this is always tricky.and it depends on how you need your Layout to look like.
1. If I select "Custom size" > enter 620px for the height and leave the Featured image width blank, would this limit the height of any featured image to 620px?
Yes, this will limit the height to 620px.
2. Would the "Keep original proportion" display the proportionate aspect ratio of the image up to the 620px limit set above, without cropping?
Yes, exactly, so, you will get the images with height 620px and the height will be adjusted to keep the dimensions of the image with the same ratio.
3. How do I determine what to select for "What to display"?
As said previously, this depends on how you want your design looks like.
You can do one of two things,
1- control the height and let the width be justified for you.
In this case, to get a good display, you will need to center the image horizontally in its container.
1- control the width and let the height be justified for you.
In this case, to get a good display, you will need to center the image vertically in its container.
I hope I answered your questions clearly.
Thanks.
Thank you for this very helpful information. To clarify the third question, the "What to Display" has a drop-down selector with 9 options the default being "Image HTML tag".
I'm not exactly clear on which option applies. The objective is to display the specific image for the post.
1. On the Archive display, it would be helpful if the Post featured image were clickable and linked to the post page display specific to that image.
2. On the post page display itself, the Featured image can be static (although, I'm using a plugin enabling the post featured image to open in a larger lightbox display)
How exactly does the "What to display" apply?
Please note: There is a typo in the Post featured image drop-down window on which the first option "Proportion opringinal proportion" should actually be "Proportion original proportion".
Hi Charles,
Thank you very much for pointing out to this typo , I'm going to report it to the development team.
For the archive page, to make the image redirect to the post it belongs it after clicking it, you can add it in a <a> tag and in the href attribute, you can add the link to the post.
You can do that using the fields and Views button,
Example:
< a href="[wpv-post-url]">[wpv-post-featured-image]
Note that, the [wpv-post-url] is the post link, [wpv-post-featured-image] is the feature image.
For the single post, the [wpv-post-featured-image] will do the job for you.
I hope this can help you.
Thanks.
Yes, this very helpful, thank you. If possible please hold this ticket open as long as possible.
Hello,
Using Divi Builder to create and edit the Content Template for the Archive originates in a single column Section which at this scale, the 620px "Featured Image" custom size max height limit is ideal.
Will the single row Archive Content Template auto scale down proportionately for a multi-column post Archive display?
Or, does the maximum individual column width of a 3 or 4 column Archive display grid determine the height of each thumbnail Featured Image, the narrower the column, the short the height?
Hi Charles,
I'm not 100% sure but I think if you fixed the width of the image in a column, then when this column gets narrower than the image width, you will get a scroll bar created horizontally in order to be able to see all the image.
If you are using Bootstrap, then it should help you a bit in that because bootstrap sets the width of the cells.
Can you try to add the image to a cell and add the following style to it?:
.some-class img{
margin: auto;
max-height: 100%;
max-width: 100%;
}
This should make the image centered horizontally in its container which will give you at least an acceptable look and will keep the image dimensions ratio as is which means that the image will not be stretched.
BTW, along with the previous style, you can fix the width or the height.
So, you can, for example, set the height to 620px and leave the width. the width will be adjusted automatically.
Or, does the maximum individual column width of a 3 or 4 column Archive display grid determine the height of each thumbnail Featured Image, the narrower the column, the short the height?
Yes, If we are talking about columns, then we are talking about width.
The following works if we don't restrict the height of the image to some value:
If the image width is greater than, for example, the width of the 4 columns, then,
then the more the image width exceeds the width of the 4 columns, the smaller height you get for the image.
This will keep the ratio between the height and the width fixed.
BTW, the ticket will keep open until you close it.
Thanks.
Thank you very much for your response. I'm looking forward to trying your recommendation.
Yes, the maximum individual column width of a 3 or 4 column Archive display grid hopefully will determine the height of each thumbnail Featured Image, the narrower the column, the shorter the height.
I have CSS available that might work to limit the Featured Images to a maximum height value globally by default that can be tested when some of the other Toolset - Divi development is published.
The goal is for the Divi Text module would provide some of the styling, such as centering, Text style, and size, etc. Will Bootstrap block those settings and uses it's own?
Hi Charles,
I can't say yes or no. because, in fact, Bootstrap overrides styles.
You can check which style is being overridden in the browser console. but anyway, nothing to worry about here. you always can use !important for any style in case that a library adds unwanted styles to elements: hidden link
Thanks.
Please hold this discussion open as long as possible.
Thank you.
Hello,
Is there a way I can reactivate tickets which were closed as "Resolved" or at least request they be picked-up by new agents to continue their discussion? The specific topics will be crucial to my being able to complete the development.
Also, I currently have a live domain that I would like to link these tickets to for final development. How can I specify which domain?
Hi Charles,
It's nice to get a message from you again.
You can post a message in the ticket that you need to reopen or, you can create a new ticket and just mention the old ticket there so that we can pick it and get the needed information from there.
You can also pass these ticket to me here and I will try to reopen them.
I'm not sure why you want to link the tickets to a new domain? can you clarify that?
Hi Mohammed,
I thought that it was imporant for the support agents to know the domain of the development. When I first began attemnpting to use Toolset with Divi, I was using a staging site.
Does it not matter which domain I'm working with?
Hi Charles,
It doesn't matter which domain you use as soon as you configure the website properly when you migrate to the production domain.
For Toolset, we use the domain to make sure that the Toolset plugins you use is registered.
Thanks.
