Wp-calypso: Gutenberg: Add justified alignment

[supernovia]

Several of our users like justifying their text. In Calypso they had an alignment button. In wp-admin, they could use a keyboard shortcut. Now neither seems to work, and those who don't have custom CSS capabilities are left editing each paragraph's style by hand by clicking three dots, edit HTML, adding style, converting to HTML... and so on, for each paragraph. It'd be nice if this were easier for them.

(Edit from @gwwar) To re-add visual controls, it seems unlikely that core would accept such a patch since this was intentional (removed in WordPress 4.7), but I think we can consider it as a WordPress.com integration if folks really want this. Underline in particular was hidden to reduce confusion on what is and is not a link, while Justify was removed due to spotty browser implementations.

At the time of this update, this is one of the most common bugs/feedback we've received from the Gutenberg rollout.

For reference, this is what Underline and Justify Options in the Calypso Classic Editor look like

Update 1/23: @gziolo and @jasmussen note that the core Gutenberg project would be open to adding justify and underline, disabled by default, but re-addable as a user option. So for folks taking on this task, try starting with a core patch first, unless things get stuck and be sure to test mobile views and the block toolbar in nested contexts, as this adds additional buttons to the toolbar width.

See related: https://github.com/WordPress/gutenberg/pull/13117, though we'll want to add visual UI here rather than just a keyboard shortcut.

Update (@copons):
This is currently live on WordPress.com Simple sites, and will remain a WordPress.com-only enhancement for the time being.

Update 2 (@copons)
The solution mentioned in the first update is good enough for Simple sites, but we should have a better designed approach for other site types.
This kind of better design likely involves adding an extension point to the Alignment Toolbar (justify should be a block alignment attribute, not an inline format), which is not really straightforward.
I've tried experimenting a bit (https://github.com/WordPress/gutenberg/pull/14824), but couldn't figure out a good and sensible way to proceed, that's also good enough to be reusable by other developers in the wild.

[supernovia]

https://en.forums.wordpress.com/topic/new-post-editor-3/

Noting we've had other folks asking too. :)

[KokkieH]

The broken keyboard shortcuts are being worked on in Core in https://github.com/WordPress/gutenberg/issues/8450

[tbradsha]

See also: p7DVsv-5F7-p2

[erricgunawan]

I have one from 3960759-hc

[supernovia]

https://twitter.com/TwentySwans/status/1067176514117087233

[katiebethbrown]

Another in 3198529-hc

[sdixon194]

1603732-zen

[tbradsha]

1611421-zen

[gemmagarner]

Requested on Twitter.

[arunsathiya]

7819824-hc

[katinthehatsite]

Another in #1647561-zd

[Aurorum]

Another request in the forums: https://en.forums.wordpress.com/topic/justify-text-3/#post-3232361

[sarahfg]

Another in #1650446-ZD and #1649983-ZD

[nerdysandy]

8875156-hc

[donalirl]

Another request for Justify in #8879202-hc

[SiobhyB]

This was requested in the app in 1652134-z also. (Although this was for the app, adding here as it shows demand for a justify option and it's unlikely to be added to the app without first being added to Gutenberg.)

[Aurorum]

Another user looking for this feature in the forums: https://en.forums.wordpress.com/topic/how-can-i-justify-text-in-the-new-layout/

[arunsathiya]

1680099-zen

[aamills]

Another user would like the option, here 9082543-hc

[Aurorum]

Another here: https://en.forums.wordpress.com/topic/where-is-the-justify-button/

[rossanafmenezes]

Another one here 1693452-zen

[SiobhyB]

A review for the app:

There is no option for Justified text, the posts looks too odd without Justified option in the text paragraph.

(As before: Although this was feedback for the app, adding here as it shows demand for a justify option and it's unlikely to be added to the app without first being added to Gutenberg.)

[gemmagarner]

Requested on Twitter.

[SiobhyB]

Another request in 1720247-zen.

[tbradsha]

1731724-zd

[SiobhyB]

Another +1 from the app:

Actually, for every updates of this app, I'm waiting the 'justify' function to appear in the toolbar in compose section. For me--and I believe for other users too--its important, so that my writing would look neat. It's already have a right, center and left alignment. But no justify command. Hope I will use it soon. Thank you.

[jasmussen]

One fixable challenge that might nonetheless delay this feature is that there isn't necessarily always going to be room for this button in every context. In the mean time it could make sense to introduce these features as keyboard shortcuts only. For example in an upcoming version of Gutenberg, the underline feature will be introduced behind a ⌘U shortcut.

[Aurorum]

Request here: https://en.forums.wordpress.com/topic/gutenberg-edition-problems-problems-problems

[Aurorum]

https://en.forums.wordpress.com/topic/how-to-justify-a-text/

[m]

As suggested in this comment, it doesn't look like we're correctly responding to users that they can justify the design with CSS without having to manually set every paragraph:

https://github.com/WordPress/gutenberg/issues/8450#issuecomment-445411782

[Aurorum]

That's true, but I think the intention of this issue is to allow those without access to CSS to be able to justify text in a more efficient way.

Those who don't have custom CSS capabilities are left editing each paragraph's style by hand by clicking three dots

[bakenshake]

I manually set every paragraph using HTML, and my text did not justify. I work in a university setting, and my boss requires all of our pages to have justified text. Hope this gets added soon.

[Aurorum]

https://en.forums.wordpress.com/topic/full-justification-2/

[zdenys]

Another report here 1825832-zen

[katiebethbrown]

One more in 10757717-hc

[zdenys]

11021623-hc

[Aurorum]

https://en.forums.wordpress.com/topic/how-to-align-text-into-a-block-justify-in-the-paragraph-block/

[Gilmoursa]

3162117-hc

[gpmw]

And another #8574984-hc

[Agepeuve]

Another request in 1903732-zen

[sarahcada]

Another at 11536771-hc

[julsyd]

Requested in 1903618-zen.

[Copons]

Requested in 1903618-zen.

@juliasydnor This should have been fixed for Simple sites on Friday by D26137-code (added the Justify button to the Paragraph block toolbar), and we are in process of enabling it for JP and AT.
I don't have access to 1903618-zen, so could you please tell me if it's a Simple and therefore there are other issues going on?

[julsyd]

@Copons Good to know, I haven't seen an announcement about the update.

The user had already switched back to the Classic editor. Their ticket was submitted before Friday, so they wouldn't have seen the option then. I do see the option on my simple sites using Gutenberg, so we should be all set.

[Copons]

@juliasydnor Great, thanks!
We haven't advertised it because the button location is temporary, pending Core changes. 🙂

[scruffian]

I think this is a core issue. Should we close this one and track it there?

[Copons]

@scruffian The button is live on WPCOM Simple, but I'm keeping this issue open to remember porting it on JP/AT when possible.

[gwwar]

@scruffian see also the comments conversation in p7jreA-2em-p2

@Copons do you mind updating the summary of this issue to reflect that this is a wpcom enhancement for now?

[mmtr]

Closing this since the custom format types have been moved to the wpcom-block-editor package and they are available in JP/AT sites (https://github.com/Automattic/jetpack/pull/12070).