Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improved menu/toolbar settings for TinyMCE 6 #109

Merged
merged 2 commits into from
Oct 31, 2024

Conversation

rhoerr
Copy link
Contributor

@rhoerr rhoerr commented Oct 29, 2024

Description (*)

This expands the menu options and buttons loaded in TinyMCE in the admin panel. The buttons were drastically cut back when the editor was upgraded from TinyMCE 5, including removing any font size option, and that's bad for user experience.

This PR enables all of the font/formatting buttons that people are likely to use, reenables the menu bar, and hides the 'Upgrade' promo button from that menu.

Related Pull Requests

#107 upgraded TinyMCE 5 to 6

Fixed Issues (if relevant)

Fixes inability to change font size in text editor

Manual testing scenarios (*)

  1. Go to Admin Panel > Catalog > Products
  2. Create a product
  3. Edit the Description
  4. See the editor load with expanded toolbar options and menu

Questions or comments

Contribution checklist (*)

  • Pull request has a meaningful description of its purpose
  • All commits are accompanied by meaningful commit messages
  • All new or changed code is covered with unit/integration tests (if applicable)
  • README.md files for modified modules are updated and included in the pull request if any README.md predefined sections require an update
  • All automated tests passed successfully (all builds are green)

@rhoerr rhoerr requested a review from a team as a code owner October 29, 2024 14:51
@fballiano
Copy link
Contributor

I've tested this PR and it works as expected

before:
Screenshot 2024-10-30 alle 16 47 24

after:
Screenshot 2024-10-30 alle 16 47 53

but personally I prefer a much simpler toolbar, this one seems too much IMHO

@rhoerr
Copy link
Contributor Author

rhoerr commented Oct 30, 2024

Any suggestions on what specifically to take out?

It's a balancing act between making it minimal and hiding less-used things in the menu, versus making it super easy for people that aren't computer-smart. Most of the merchants I deal with that do content entry would struggle with anything that isn't right there.

The charmap and emojis could certainly be taken out, but seemed like a nice to have.
Strikethrough could also probably be taken out.
Maybe indent/outdent.
Maybe text alignment.

For comparison, here's the menu/toolbar prior to this patch release and Tiny update:
2024-10-30_130652

@fballiano
Copy link
Contributor

so, IMHO, if the first toolbar is kept (the one with the "file" menu) there's not really the need to add many icons below since they're all also inside of the first toolbar itself.

I would personally do something like this:
Screenshot 2024-10-30 alle 17 49 29

because I think those buttons I removed should be used less (or avoided, like changing font interline could screw the design) but are still available in the first toolbar

@rhoerr
Copy link
Contributor Author

rhoerr commented Oct 31, 2024

Updated with a bunch cut out. I opted to keep some of them. Also turned off the status bar, which just takes up space.

Wide:
image

Narrow:
image

Copy link
Contributor

@fballiano fballiano left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

perfect

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants