Add justified text alignment option to text alignment toolbar

[ZebulanStanphill]

There is a text alignment option missing

The standard text alignment toolbar component in Gutenberg currently supports left, center, and right alignment. However, it currently does not have an option for justified text alignment (text-align: justify). I think this option should be added to the standard text alignment toolbar component.

[vtrpldn]

Justify and underline were dropped from the default editor since 4.7. I don't remember the exact reasons but I don't think it's coming back.

[danielbachhuber]

I've filed this away in the Ideas project for future consideration.

[ajitbohra]

The underline and justify buttons are no longer available. According to Andrew Ozz, who primarily works on the TinyMCE editor in WordPress, underlining text causes confusion as readers may interpret it as a link. The justify button was removed because it has uneven browser implementation and often makes text less readable. However, keyboard shortcuts for both buttons will continue to work in 4.7.

https://wptavern.com/wordpress-4-7-removes-the-underline-and-justify-buttons-from-the-editor

[mlopezcoria]

Justify and underline were dropped from the default editor since 4.7. I don't remember the exact reasons but I don't think it's coming back.

But you could use the shortcut Shift + Alt + J to justify the selected text. With Gutenberg this shortcut does not work anymore!

[Mc61]

Justify and underline were dropped from the default editor since 4.7. I don't remember the exact reasons but I don't think it's coming back.

But you could use the shortcut Shift + Alt + J to justify the selected text. With Gutenberg this shortcut does not work anymore!

return at least Shift + Alt + J

[Shivangi1985]

Shift+Alt+J doesn't work in Gutenberg editor. Please tell any other option to justify text alignment.

[mikeicode]

Shift+Alt+J doesn't work in Gutenberg editor. Please tell any other option to justify text alignment.

You can achieve this with CSS.

If you add the following CSS at Appearance → Customize → Additional CSS:

/* --- Justify Text Option --- */
.justify-text {
    text-align: justify;
}

Then in the editor when you have a block selected you can add the CSS class justify-text in the right bar under "Advanced", example: https://snag.gy/SKIoHe.jpg

[BrunoBoehm]

Hi there, this is truly a weird choice, justified text is something that clients ask for a lot, and having to use a class for this seems quite overkill. Any update on this, or maybe a way to extend components to add it in?

[helen-oneill]

i too agree with BrunoBoehm. frustrating that justify text has been removed.

[helen-oneill]

Shift+Alt+J doesn't work in Gutenberg editor. Please tell any other option to justify text alignment.

You can achieve this with CSS.

If you add the following CSS at Appearance → Customize → Additional CSS:

/* --- Justify Text Option --- */
.justify-text {
  text-align: justify;
}

Then in the editor when you have a block selected you can add the CSS class justify-text in the right bar under "Advanced", example: https://snag.gy/SKIoHe.jpg

Worked perfectly, THANK YOU so much!

[okainov]

Any updates on this one? Justify was really nice feature.

[Misiu]

@ajitbohra if there are so many people asking for this option why can't it be added back? If you don't need it, then you don't have to use it. At least give us an option. Custom CSS is a workaround, but there should be an option (button) that does this, without any workarounds.

[ilDon]

Why is this closed?!

[mikeicode]

Why is this closed?!

The Paragraph block now has a justify option:

Full image: https://d.pr/i/eIecWQ

[ilDon]

@mikeicode thanks for the update, do you know since what version? I fear that I'm stuck with an older one...

[mikeicode]

thanks for the update, do you know since what version? I fear that I'm stuck with an older one...

I might have been slightly incorrect about that. After further testing I see that the latest Gutenberg and latest WP doesn't have this option. If you have Jetpack enabled on the site this option is available.

[toudal]

This is the main reason why we do not use Gutenberg and the only reason I don't use it. Why would the only professional looking text alignment be insignificant and a dropped feature? Where are the business developers who actually listen to the end-users?

[strarsis]

@toudal: The Gutenberg Page Building Toolkit – EditorsKit plugin extends the Gutenberg editor by a text-align justify format option. It also offers other features (which can be all turned on/off).

While I agree that some important features for Gutenberg are still missing (notably multiple block style selection), the extensible nature of WordPress and Gutenberg can often offset this (like in this case by using a plugin).

[ZebulanStanphill]

Well, this is funny. I'm the person who created this ticket asking for this feature, but now my opinion has flipped, and I think justified text is a bad idea. :laughing:

@toudal It's worth noting that the justify option was removed from the classic editor due to accessibility concerns, since justified text is considered harder to read than standard left/right-aligned text, since:

• Every line being the same width makes it more difficult to find your place in a long paragraph compared to standard left/right-aligned text.
• You have to hyphenate text to make sure there isn't a silly amount of space between words in a line, and this is really difficult in the context of responsive websites without using CSS properties that have limited browser support.

So user feedback is actually why the option was removed in the first place.

It's also worth noting that justified text is something you probably would never use on one or two blocks alone. If you're using it, it's probably a general design choice that applies across your site. Because of that, it should probably be up to the theme (or else the upcoming Global Styles system) to set the default text alignment to justified.

Because of these factors, I don't think it makes sense to provide a (visible) option to set individual paragraph blocks to justified text alignment in core WordPress. Of course, a plugin can add the option if you really want it, but since it is considered bad practice, it shouldn't be promoted as a visible option by a default WP installation.

[ilDon]

@ZebulanStanphill your point makes 100% sense and I am too now convinced that it should not be there. As you correctly pointed out, I did indeed add the justified style via CSS, as it was a general setting that I wanted for each paragraph of each article.

However, I still think that something should be done about it. A proper explanation, perhaps in the tutorial, or simply an "official" blog post on WordPress, would probably be enough. Otherwise it might look as if the lack of a justified option is due to a bad design of Gutenberg, which is on the contrary pretty well designed.

This is especially true for non tech-savvy users, which are the most likely to have troubles getting used to the idea of plugins, not to mention editing CSS.

[toudal]

@ZebulanStanphill I have never read a book that was not text style justified ... Pick Up any physical paper book, like you know, an oldschool papyrus thing, so what you talking about? I agree that it should be default as it is the way everyone with an eye for design would normally write...from an UI design point of view; Two of the other types of text alignment styles can be challenged as excess as they are never utilized.

[toudal]

@ilDon Yes but I cannot see how to avoid having the button... If you have a button change the text style to one thing and change your mind, you would need the button to revert text to justified. Just plain simple; Text alignment justified should be part of the UI.

[toudal]

To complement all of you guys! Gutenberg is quite perfect and a great thing happening in the WordPress community but it will never be considered a success by the general public before you add this exact lack of functionality. Text justified is the main reason why the old editor and other similar plugins are popular with so many downloads.

[ZebulanStanphill]

@toudal I suppose instead of paraphrasing and potentially misrepresenting (which I probably did a bit in my prior post), I ought to just link to what an accessibility specification actually says:

https://www.w3.org/TR/WCAG20-TECHS/G169.html

On paper, hyphens are carefully set to ensure a mostly consistent spacing between words. But in the context of websites, the number of words per line often changes depending on the screen width, so manually inserted hyphens are rarely a good idea (and are annoying to have to insert anyway). (And CSS support for automatic hyphens appears to be less than ideal across browsers.)

As for the other text alignment options, center alignment is obviously very popular. It has its own accessibility issue: the starting position of a line changes every line, which can be annoying during reading. For short spans of text, though, it's usually fine, e.g. how this site uses it. The right alignment option is less useful, but I still see it used in some cases, mainly for visual flair. I used to use it on my website's home page, though I've since moved away from that since I figured that consistently using left alignment would be more quickly readable. It's also worth noting that right alignment is the default for sites using an RTL language.

As an aside: In the context of standard post editing, I guess you don't really need any of the text alignment options. They're really only useful for more complicated landing pages and such. I wonder if WordPress should provide an option to disable some styling options for certain user roles. Someone who writes blog posts on a website probably doesn't need the same amount of per-block styling controls as a designer building a fancy home page. But I suppose that's a topic for a separate issue.

On a related note, I think a justify-text option could/should be provided in the upcoming Global Styles interface alongside other text controls. Do you think that would more or less resolve the issue?

[ZebulanStanphill]

@toudal

Text justified is the main reason why the old editor and other similar plugins are popular with so many downloads.

But... the justify option doesn't exist in the classic editor either. It was removed when WP 4.8 came out in 2017. Installing the Classic Editor plugin doesn't give you a justify text option.

Of course, popular plugins like TinyMCE Advanced can bring back the option in the classic editor, but the same can be said for the block editor. (Notably, although TinyMCE Advanced does support the block editor, it doesn't add a justify option to blocks. Other plugins like EditorsKit do add that option, though.)

[toudal]

@ZebulanStanphill You are right. We have TinyMCE installed also and it does not work with Gutenberg hence we use the old editor.

[toudal]

@ZebulanStanphill Automatic hyphens on a website, ok. Everybody search the internet and finds the solution. If end-users has the option in Gutenberg, they will never search for the solution online hence the number of people utilizing Gutenberg would be quantizilladroupled.

[gasova]

I do not understand why this has been closed?

They are situations where justified text is necessary and perfectly readable? No-one should dictate what can or cannot be done justified text has to be enabled and implemented on gutenberg editor.

Please stop that sheet telling, justification not working, hyphens, etc., etc,. It is nonsence to not include this feature.

For you it can be useless for others it can be a must have.

In our case I'm developing a wp plugin where the user has to create a page or post with dynamic fields, (using the gutenberg editor).

So when the visitor fills a form, the custom post is called and converted into a pdf.

This document can be a contract having administrative purposes with non-breakable formats given by the government and may contain justified text as well.

Instead of forcing us to hack the editor, or google it, you should add it to the editor with the other alignment options.

wewantjustifiedtextback.