Block Editor Images and Callouts
in progress
Amanda Atzil
It is incredibly poor design to not have a method in the Block Editor for setting an image dimension in terms of % rather than pixels. Not only can I not specify % in the main editor, but any attempt to override the width setting in code view does not get saved. What is the point of the code view if I can't actually fully customize it. The WYSIWYG(HTML) editor allows me to do this and my project layouts depend on %.
Additionally, the Block Editor does not seem to actually differentiate all the different callout types in the actual html/css. I currently have very specific Custom CSS settings for each callout type when I am using the WYSIWYG(HTML) editor. But in the block editor these seem to all be the exact same element and I have no way to customize each one anymore. And no, I cannot achieve what I want by just changing the color.
Log In
D
D360 Product Management
in progress
Prabhakaran Parasuraman
Hi Amanda, we truly understand your issues with the Block editor. We are aware of the image resizing issue in the Block editor. We will surely fix this issue in our forthcoming release.
In the code view, the changes will be saved as we expected. Could you please provide additional details on this issue? A screenshot could be more useful for us to understand your issue.
The configured custom CSS and JavaScript won't be supported with the Block editor. In the block editor, the callout function is provided with additional features for configuring the border color, background color, and font colors.
We would like to know the additional elements you've in the callouts to understand your use case and try to incorporate the same with the block editor to solve your issue.
Your patience and understanding are appreciated.
Amanda Atzil
Prabhakaran Parasuraman: Thank you for your response. In regards to the release, is there an estimate as to when it is happening? And will it specifically allow you to resize an image based on %?
The code view in the block editor is not 100% editable and customizable like the WYSIWYG(HTML) editor's code view. As a simple example, if I were to try to set the width of an image in terms of % within the block editor code view and click save, that change will not be saved since it is not allowed for some reason. I have chatted with a support team member. This is not some error and is a purposeful design. So the highlighted portion in the attached image will not actually save or do anything. It will disappear. I have encountered this with other customizations I try to make as well. There is no clear way to tell what is allowed and what is not.
Now, when you say "The configured custom CSS and JavaScript won't be supported with the Block editor." It is currently working with the block editor now...are you saying it is going to stop working later? That is hugely concerning. My current issue with the CSS customization feature is just that the callouts in the WYSIWYG(HTML) editor were treated as different elements in the backend whereas they are all the same element in the block editor. I can no longer apply different custom styles for each callout.
The ability to change the background color and border color in the block editor UI are incredibly limited. I need to change more aspects than are currently possible for each callout to match exactly what I want it to look like. As a small example, there is no way to remove the vertical border on the left-hand side of the callout. The CSS customization is also incredibly powerful because it means I don't have to manually edit each individual callout every time I use it. The customization code does it for me.
Prabhakaran Parasuraman
Amanda Atzil: Thanks for your response. We will investigate your issue and resolve this as soon as possible. The implementation of the % is planned for the March release. You can expect this feature in our forthcoming release.
Your patience and understanding are appreciated.