Gutenberg: Gutenberg's Default Width Fails to work with Desktop-based Blog

[TheRealRequnix]

I updated to Gutenberg this evening to write a new review, and was surprised to find the ultra-crazy small edit width (600 pixels or something? What were you guys thinking?) was "static" and cannot be changed except through some custom code. This makes absolutely no sense, and now I can't write blogs that even appear properly on my website (www.requnix.com). The text isn't the issue, it's the WYSIWYG layout aspect of Gutenberg; my blog is 1140x wide - has been for years - now I can't use Gutenberg to properly lay out images, etc.

Also, I don't understand why Header 1 isn't an option in the selection - only H2+. Very strange given I've used H1 for years. I have to now manually put in H1 as HTML. Another thing that makes no sense.

Anyway - something needs to be done about this absurdly small and unacceptable width - Gutenberg is supposed to improve the visual representation of WIP as it relates to publication.

Right now, it's completely broken (and useless) for me. Forcing people to write custom code to address this problem is not good design; at a minimum add some sort of Width-based option that allows people to either customize or inherit the width based on the selected theme.

[kaffeeringe]

Headings structure a document. H1-H6-tags are there to give you six levels of hierarchy. Every tutorial tells you to use H1 only for the title. Even SEO-experts say, it's good for search engines to know, which one is really the title of a document.

I think it's good for WordPress to only support the standard. Maybe you could try and get used to it, and regard it as an improvement to your website?

[TheRealRequnix]

Thanks kaff - you're probably right. I'm old school, and to me Title is different from Header, so I think it's a mistake for the industry to adopt H1 as the title (which it is technically not). But, I guess that's what the norm is now. Unfortunate.

I certainly hope the team is able to address the editing width ASAP; that is definitely a problem and I've seen it mentioned numerous times throughout the internet.

[kaffeeringe]

It seems, the width of the editor is adjustable. See #8643

https://wordpress.org/gutenberg/handbook/extensibility/theme-support/#changing-the-width-of-the-editor

[TheRealRequnix]

IMO this goes against everything Gutenberg is trying to accomplish. Requiring users to write custom CSS code to adjust what should be available through the user interface (or settings). And if, as they say, it's up to the theme, then they should have an option to override the theme -- especially since 99% of all themes currently have no forward compatibility with Gutenberg.

Yes, we can write custom CSS, but that burdens the users of the new UI and is a cheap excuse for poor design, planning and execution from the Gutenberg team to become the next "normal" editor for Wordpress. And once Gutenberg becomes "required" (i.e. is integrated by default into WordPress) this issue is going to become a big and common problem worldwide. And it's going to piss users of WordPress off.

[kaffeeringe]

You don't have to write CSS to make Gutenberg work - only if you don't like the standard width. And future themes will support custom width for Gutenberg.

I think, the team should discuss to slightly widen the standard width, as it's really narrow. Or maybe it could add a 100%-switch. But I think then it won't be too big a problem for most users.

[TheRealRequnix]

Additionally I have NO IDEA how to edit style-editor.css through Wordpress. I can't find it anywhere, nor can I find documentation on exactly where it is, which tells me I must now synch the files to my PC, download them, hunt the file down, edit it, and upload the file to make the adjustment. This is EXACTLY why this issue needs to be fixed/added to the UI. Forcing Worpress users to engage in such a cumbersume process of search/figuring out/frustrating to do something so simple it should have been built into the UI is why this bug report exists.

Plus your above comment hits the nail on the head. There is no retroactive width definition for the MILLIONS of users who have and are using themes that are not "Gutenberg Compliant". Anyone trying to create a new post in Gute on a modern PC with a screen at least 1920 in width will see the ultra narrow editing width and NOT be comfortable it it. I'm on a 2560 width monitor and as I'm editing, the majority of my screen is empty white space. Oh, and I cannot see WYSIWYG for the true 1440px as I place images embedded within the text.

This issue is a far bigger deal than people realize, especially as it relates to displaying images in text and visually aligning them.

[chrisvanpatten]

There's discussion about supporting the legacy $content_width variable, which might help with this, being discussed in #5650.

[kaffeeringe]

Nobody is forced to edit any CSS-files. Only if you want to customize more advanced stuff - like with anything else in WordPress.

Usually you don't produce articles for only one width. Themes from the last 3 years are responsive. So the editors width will always be a compromise...

[TheRealRequnix]

sigh So I've already wasted a good hour or more of my time relative to this issue - and in researching it, I see many other people bringing up the same problem (not just in tickets but in other chat/discussion mediums). I guarantee the time it would take to simply add a feature to adjust the width in the Gutenberg options (for those who want to) would save the amount of time numerous future tickets (which I guarantee are going to keep flowing in, especially once Guten is integrated into WP forever) will consume.

BTW - my theme is responsive, and the only way I can currently change the width is to manually edit the style-editor.css.

There's definitely some sort of disconnect here. I'll wrap up by stating I think it's a big mistake to force (for the future implementation) people who work on a 2560 width monitor to edit in little 640px (or whatever) size blocks just because their theme doesn't have some unique setting. BTW requiring the theme to adjust the width is ridiculous (given the massive majority of worldwide WP sites don't have Gutenberg settings) . There should be a global width setting as part of the Gutenberg options.

Oh and another note - as I mentioned above - my theme is responsive. So Gutenberg is actually restricting my editing by failing to show the proper width of my PC so I can see how the content looks as I'm editing it.

Gutenberg actually looks worse (for WYSIWYG) than the classic editor -- when putting it all together. Almost like it's forcing me to write in the width of a mobile phone. That's not a good thing.

[chrisvanpatten]

Oh and another note - as I mentioned above - my theme is responsive. So Gutenberg is actually restricting my editing by failing to show the proper width of my PC so I can see how the content looks as I'm editing it.

The problem is that Gutenberg has no way to know that. It isn't possible to automatically detect the width of your theme unless the theme explicitly provides that information.

Remember that Gutenberg right now is still just a beta, and is an opt-in plugin (not officially in Core) precisely to give theme developers time to update their themes to be compatible with Gutenberg. I'd strongly recommend you write to your theme's support email and ask them to address this in a theme update on their end. At this point, aside from the possibility of $content_width support (#5650), putting pressure on theme developers to update their themes for Gutenberg compatibility is the best option we all have.

[TheRealRequnix]

The problem is that Gutenberg has no way to know that. It isn't possible to automatically detect the width of your theme unless the theme explicitly provides that information.

Which is exactly why they should add global settings for those who want to manually set it (like myself).

At this point, aside from the possibility of $content_width support (#5650), putting pressure on theme developers to update their themes for Gutenberg compatibility is the best option we all have.

While future themes should evolve to include such features, there are many legacy themes (that are reactive and even recent) that perhaps may not be updated, but people want to keep using them because they like them -- and so... users should have the options to set the values themselves in the global settings of the editor (same as above).

I think the discussion everyone has provided herein should serve as a request and even warning to the devs - users need this, and IMO will also expect this (as I did).

[designsimply]

Thank you for your feedback. Because the current recommendation is for themes to be the place to modify the editor width if needed (https://github.com/WordPress/gutenberg/issues/8643#issuecomment-410973542), I am closing this issue for now but welcome further discussion here and would like to note that while adding a user-facing option to change the editor width is not currently a planned change it can be re-visited at a later time.

[designsimply]

Adding a quick note as a reference point, in my experience, designers and developers often point to readability as a reason for keeping content width not-too-wide and I spotted a comment about that at https://github.com/WordPress/gutenberg/issues/1483#issuecomment-311667185. I understand there are exceptions and that it is your preference to use a wider content width compared to that recommendation and just wanted to include it as a point for the discussion in case it is helpful.

[TheRealRequnix]

Closing this thread is a mistake. The core issue is those who use themes that don't have the setting defined simply won't work the way they did, limiting users to the minuscule and ridiculous 640px (or whatever) it is editing width. This is NOT a good design, and putting the burden solely on the theme to address this (or requiring the user to write/use custom code) is a bad idea. As mentioned here, Gutenberg needs the option of manually setting this (in the settings) for those using themes that do not have the new custom settings. Don't ostracize users of themes that don't update to support Gutenberg.

[designsimply]

I understand that you are upset and I'm sorry for the trouble! The reason for closing right now is that there are no immediate plans to add a user-facing option to change the editor width at this time and that the option for themes to add support for different widths is available as a workaround. Closing doesn't mean that we cannot re-visit this issue later when it comes up again. I have also added this issue to the Ideas board at https://github.com/WordPress/gutenberg/projects/8 for consideration.

[TheRealRequnix]

Putting this off is the wrong decision and you will be hit with tons of similar EMails/issue requests when Gutenberg gets full integration. Omitting a configuration option is simple laziness. Your team has an obvious disconnect with the actual "use" of Wordpress as it relates to many (potentially tens of thousands or more) users. This is going to come back and bite you and your team and waste a ton of time, energy and effort for everyone involved -- all because you didn't listen. You were warned.

[timnicholson]

I was pretty astonished at the default editor width being so narrow too. I am a theme developer so of course I can change it, but I do think a lot of users are going to be startled and frustrated. A global user setting for GB seems reasonable, especially if theme developers can set that for the user and perhaps even block them from changing it.

One thing I can tell you is that every single WordPress theme listed on WordPress.org is required to specify a content width in the theme and that has been the case for many years. So I would think at the very least, Gutenberg should use that.

Now in today's responsive world that probably doesn't make a lot of sense because the theme will display different widths with a sidebar or no sidebar, etc. I set my themes to the narrowest "max-width" of a content area when a sidebar is present. In my case, 970px which is certainly better than 640px as a default for the editor.

Any rate, the point is that it's required by all themes and thus could easily be counted on by GB to be set and have GB use that setting (or I suppose for a non-compliant theme, use whatever default you want but probably should be a lot more than 640px wide).

[TheRealRequnix]

Well said, Tim. Thank you!

[Zaparl]

Hi! This is also a big problem for me. I just answered same question in other thread so I will post the link here to not repeat the same since I don't know if it is accepted to write the same reply.

https://github.com/WordPress/gutenberg/issues/8643#issuecomment-445172026