Wrap options on plugin page to second line

[NekoJonez]

​https://ibb.co/m0HF1gs

When translated into Dutch, the amount of options in for example the All in One SEO plugin (combined with the WP Rollback plugin & Loco Translate) has all the options next to each other which is extremely long and which makes all the other columns on the plugin page way to small....

I think it would be a great idea if there is a way to wrap them or split them in a second line when there are too much. It would also make this a bit more responsive as well :)

[sabernhardt]

The plugin name's column has white-space: nowrap (on larger screens), which does not work well when there are several links under the Name.

I considered editing that rule so it only applies when the plugin is inactive, but most public sites should avoid keeping inactive plugins installed (so that idea is not a good option).

[NekoJonez]

Replying to sabernhardt:

The plugin name's column has white-space: nowrap (on larger screens), which does not work well when there are several links under the Name.

I considered editing that rule so it only applies when the plugin is inactive, but most public sites should avoid keeping inactive plugins installed (so that idea is not a good option).

Thanks for editing the tags and such mate :)

[sabernhardt]

setting white-space to normal for plugin action links

[NekoJonez]

Replying to sabernhardt:
How can I help test this?

[sabernhardt]

One procedure would be:

1. Before applying the patch, install and activate a plugin that makes the Plugin name column too wide on the Plugins screen in some situation. (You already found All in One SEO and others that add action links.)
2. ​Apply the patch to your installation.
3. Refresh the browser (clear cache if necessary) and/or open in a private/incognito window.
4. Verify whether the change fixes the column width in that situation.
5. As much as you can or want: Continue testing whether the patch helps with additional browsers or devices, various viewport sizes, different columns showing (adjust screen options), different languages, etc.

I would do well to document my testing here, too :)

[NekoJonez]

Replying to sabernhardt:

One procedure would be:

1. Before applying the patch, install and activate a plugin that makes the Plugin name column too wide on the Plugins screen in some situation. (You already found All in One SEO and others that add action links.)
2. ​Apply the patch to your installation.
3. Refresh the browser (clear cache if necessary) and/or open in a private/incognito window.
4. Verify whether the change fixes the column width in that situation.
5. As much as you can or want: Continue testing whether the patch helps with additional browsers or devices, various viewport sizes, different columns showing (adjust screen options), different languages, etc.

I would do well to document my testing here, too :)

I have to admit, that it's going above my head a bit in applying the patch...

[sabernhardt]

@NekoJonez If it helps, ​another tutorial lists additional methods to apply a patch. If you specifically would like a pull request, perhaps someone else could create one from the patch I uploaded (I use TortoiseSVN). You could also ask for help on Slack, either in the #core-test channel or #core (after devchat).

[Ankit K Gupta]

Test Report

Test Environment

---

• WordPress: 5.9-alpha-51272-src
• Browser: Google Chrome Version 94.0.4606.61 (Official Build) (x86_64)
• OS: macOS Big Sur V 11.5.1
• Theme: Twenty Twenty-One
• Plugins: All in One SEO, Loco Translate, and WP Rollback
• Web Server: nginx
• PHP & MySQL: 8.0.0 & 8.0.16
• Console Log: All fine
• WP Debug Log: All fine.

Steps to test

---

1. Go to WP Dashboard > Plugins
2. Install and Activate 'All in One SEO, Loco Translate, WP Rollback' etc.
3. Plugin options of 'All in One SEO' taking a huge space and reducing the width of other columns.(refer ​https://i.imgur.com/jYQ8CA7.jpg)
4. Now apply the patch file to cross check fixes.
5. See, all other columns have proper width now.(Refer ​https://i.imgur.com/puAgTkb.jpg)

Test Results

---

Plugins listing is looking better now. Current patch file (53275.patch) fixed the above known issue mentioned in ticket description.

Test Status

---

Pass

Screen Shots

Before Patch-

After Patch-

[NekoJonez]

Replying to Ankit K Gupta:

Test Report

Test Environment

---

• WordPress: 5.9-alpha-51272-src
• Browser: Google Chrome Version 94.0.4606.61 (Official Build) (x86_64)
• OS: macOS Big Sur V 11.5.1
• Theme: Twenty Twenty-One
• Plugins: All in One SEO, Loco Translate, and WP Rollback
• Web Server: nginx
• PHP & MySQL: 8.0.0 & 8.0.16
• Console Log: All fine
• WP Debug Log: All fine.

Steps to test

---

1. Go to WP Dashboard > Plugins
2. Install and Activate 'All in One SEO, Loco Translate, WP Rollback' etc.
3. Plugin options of 'All in One SEO' taking a huge space and reducing the width of other columns.(refer ​https://i.imgur.com/jYQ8CA7.jpg)
4. Now apply the patch file to cross check fixes.
5. See, all other columns have proper width now.(Refer ​https://i.imgur.com/puAgTkb.jpg)

Test Results

---

Plugins listing is looking better now. Current patch file (53275.patch) fixed the above known issue mentioned in ticket description.

Test Status

---

Pass

Screen Shots

Before Patch-

After Patch-

Amazing! Thanks for this test... I didn't had the time to test it out well enough looking into the test procedure and this test is showing that it works. :) @sabernhardt I think your patch works flawlessly. Thanks @ankit-k-gupta !

[hellofromTonya]

Great job on the Test Report @ankit-k-gupta! Thanks @sabernhardt for the patch! Marking this for commit. Will get it committed shortly. Thank you @NekoJonez @SergeyBiryukov @sabernhardt and @ankit-k-gupta for your contributions!

[hellofromTonya]

In 51887:

Administration: Allow plugin action links row to wrap.

When there are several action links or the text for these links is long, the plugin name column's width extends causing the other columns to shrink in width. This case is a less than desirable user experience.

The plugin name's column has white-space: nowrap (on larger screens). This commit changes the white-space to normal, allowing the plugin action links row to wrap into more than one line.

Follow-up to [41695].

Props ankit-k-gupta, nekojonez, sabernhardt, sergeybiryukov.
Fixes #53275.