- This topic has 9 replies, 2 voices, and was last updated 3 years, 6 months ago by
.
The Image content element doesn’t appear to have a property for width. As such, you only get the full size image. In some use cases, where the image is in a column with other content, you can’t use the padding to control the image without impacting everything else in that column.
I realize I can set global CSS to target the image and give it width/max-width properties, but it seems wrong to need a global style to impact one element of one page. I don’t see a way to set page-specific CSS for this purpose.
Thanks.
Hi @jkloptosky,
I hope you are well today and thank you for your question.
Are you using the image element of the Unyson page builder or WpBakery page builder?
Could you please share the page URL from your site where it is displaying so that I can help you?
Best regards,
Shufflehound teamSee private.
I’m using the Unyson image element, sitting inside a half-width (if I recall correctly) column, with header and text elements, inside a section.
It’s the AWS partner logo. The one there currently was sized specifically for the current space. When I replace it with a bigger image, the image takes up the full width of the column, which is undesirable.
You can set image size in the Image element as shown in the attached screenshot.
There is a difference between large and full-width image.
The only option I have in that dropdown other than “Full” is “Large”. That doesn’t really give me design control, especially since I don’t know what the impact of it is on the site without trial and error. And in this case, setting it to “Large” presents the same as “Full” (i.e. it takes up the full column width).
Images like these would be used throughout the site. It should be uploaded to media once, and then should be reusable on different pages in whatever size/presentation makes sense for the page. For that to happen, having a text field where I could specify image width as px or % would be appropriate. As it is currently, I have to upload multiple copies of the same image at different sizes.
In that case, you can use the text block element and use the image in it as shown in the attached screenshots.
This works and I guess is a fine interim solution, if a little odd to use a text component strictly to render an image.
One point of note, with this approach I lose access to the alternative alignment option on mobile. For instance, it would make sense to have this left-aligned on web and center-aligned on mobile.
Is there a strong reason not to introduce width and width(mobile) attributes that would scale the source image accordingly for ultimate design flexibility?
Is there a strong reason not to introduce width and width(mobile) attributes that would scale the source image accordingly for ultimate design flexibility?
The unsyon page builder does not provide this functionality and we recommend using the WPBakery page builder as the unsyon plugin no longer implements more features.
How do I go about switching over to the WPBaker page builder? I provided an attachment of what I see when I come to a page.
Can existing pages be switched over?
How do I go about switching over to the WPBaker page builder? I provided an attachment of what I see when I come to a page.
You can click on the two buttons displayed in the attached screenshot to switch to WPBakery page builder.
Please note that you can only edit the page using the same page builder that you used to create it so if you have used WPBakery or Unyson or Gutenberg or any other page builder then please use the same page builder to edit the page.
Can existing pages be switched over?
Do not switch between page builders or else you will lose the content so choose the page builder that you want to use initially when you create the article content.
