Support

Account

Home Forums Backend Issues (wp-admin) Customizing Tiny MCE Buttons for WYSIWYG Fields

Solved

Customizing Tiny MCE Buttons for WYSIWYG Fields

    • trebor

    • March 24, 2020 at 7:03 am

    Hi there:

    For the WYSIWYG field type I was interested both in creating a custom toolbar and adding additional buttons to the existing basic toolbar. I found this excellent article which explains most of what I am looking to do (https://www.advancedcustomfields.com/resources/customize-the-wysiwyg-toolbars/), however I have four follow up questions I am hoping you could help out with:

    1. I would like to create a custom toolbar which includes the special character button. From the Tiny MCE button the special character button is part of the character map plugin which appears to be loaded by default. Can I add the button simply by adding charmap to the array for my custom toolbar (same array where the bold italic etc are added in the support article)?

    2. For my custom toolbar I would also like to add the paste as text button. From the Tiny MCE documentation this button is part of the paste plugin. What syntax would I use to add this button to the array for my custom toolbar?

    3. How do I add buttons to the existing basic toolbar? The support article shows how to remove a button, just want to make sure I understand how to add a button.

    4. When I add the filter for modifying the toolbars I wanted to confirm that none of the existing data entered in any of the WYSIWYG fields used on my theme would be lost? Just wanted to be sure it was safe to add additional buttons to the basic toolbar without losing data.

    Thanks for your help! Apologies in advance if any of these questions have already been answered (I haven’t had a chance to look at the array structure yet with the code you can uncomment in the support article).

    -Robert

    • trebor

    • March 27, 2020 at 3:52 pm

    I was able to figure out answers for all of my questions from my previous post above by looking at the array structure for the toolbars provided in the documentation for the toolbars filter. Thanks again for providing the detailed information in this documentation which allowed me to answer my questions about modifying the toolbars.

    For those who might need a similar solution, here are the answers to my questions:

    1. The special character button can be added in the same manner as the bold, italic, underline buttons as outlined in the documentation. Just add “charmap” to the array.

    2. Similarly the paste as text button can be added in the same manner as outlined in the documentation. Just add “pasteastext” to the array.

    3. Additional buttons can be added to the Basic toolbar simply by adding the code for the button to the end of the array for the row in the toolbar you want to add the button to. For example to add the special character button to the first row of buttons for the Basic toolbar:

    
    $toolbars['Basic' ][1][] = 'charmap';
    

    4. Data is not lost when editing the toolbar options, whether adding a new toolbar or modifying an existing toolbar.

    Thanks again for the excellent documentation provided here on the ACF site!

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.

We use cookies to offer you a better browsing experience, analyze site traffic and personalize content. Read about how we use cookies and how you can control them in our Cookie Policy. If you continue to use this site, you consent to our use of cookies.