Uploaded image for project: 'Moodle'
  1. Moodle
  2. MDL-37565

Better looking tinymce editor: toggle toolbars between 1 and 3 lines

XMLWordPrintable

    • MOODLE_25_STABLE
    • MOODLE_26_STABLE
    • wip-MDL-37565-master
    • Hide

      Test 1

      1. Start with an unpatched clean install
      2. Apply the patch and upgrade
      3. Ensure the toolbar config has been changed from the original default

      Test 2

      1. Open a page with 1 or more text editors
      2. Notice the changed layout of the toolbars
      3. Toggle it open (to multiple toolbars)
      4. Refresh the page
      5. Ensure the state of the toolbars is remembered
      6. Toggle it closed (to a single toolbar)
      7. Ensure the state of the toolbars is remembered

      Test 3

      1. Try changing the TinyMCE buttons to have only one row or more than 3 rows (Site Administration > Text Editors > TinyMCE HTML editor > General settings)
      2. Make sure the toggle icon is absent if there is only 1 row and toggles all rows except first otherwise
      Show
      Test 1 Start with an unpatched clean install Apply the patch and upgrade Ensure the toolbar config has been changed from the original default Test 2 Open a page with 1 or more text editors Notice the changed layout of the toolbars Toggle it open (to multiple toolbars) Refresh the page Ensure the state of the toolbars is remembered Toggle it closed (to a single toolbar) Ensure the state of the toolbars is remembered Test 3 Try changing the TinyMCE buttons to have only one row or more than 3 rows (Site Administration > Text Editors > TinyMCE HTML editor > General settings) Make sure the toggle icon is absent if there is only 1 row and toggles all rows except first otherwise
    • 20
    • FRONTEND Sprint 1

      I suggest few changes to make tinymce editor look better:

      • "Advanced" button that show all hidden button. Hopefully tinymce support this feature.
      • Display the essential buttons in one line only. My preferences are: Bold/Italic/link/Images/heading/lists
      • tweak the CSS to match our current standard theme in a better way than current tinymce theme.

      I'm attaching a picture of Wordpress as example. It is pleasant to look, not overwhelming and show off the media button which is actually the essential one in my opinion => it would show off the pretty Moodle file picker.

      If the advanced button feature exist in tinymce, then I don't think the issue is too hard to implement. Otherwise it may require to change Tinymce and then this improvement would not be great for maintainability.

        1. collapsed editor.png
          collapsed editor.png
          32 kB
        2. editor_1lin.png
          editor_1lin.png
          77 kB
        3. editor_3lines.png
          editor_3lines.png
          120 kB
        4. Screenshot_15_04_13_5_41_PM.png
          Screenshot_15_04_13_5_41_PM.png
          927 kB
        5. wordpress-editor.png
          wordpress-editor.png
          41 kB

            phalacee Jason Fowler
            jerome Jérôme Mouneyrac
            Damyon Wiese Damyon Wiese
            Marina Glancy Marina Glancy
            Rossiani Wijaya Rossiani Wijaya
            Votes:
            5 Vote for this issue
            Watchers:
            17 Start watching this issue

              Created:
              Updated:
              Resolved:

                Error rendering 'clockify-timesheets-time-tracking-reports:timer-sidebar'. Please contact your Jira administrators.