How to get toolbar in textarea

  • I want to get the edit toolbar in each <textarea>. How can I activate this in below code for example:
    <div class=”form-field-text”>
    <label>’. __(‘company_profile’, ‘agent-plugin’).'<span class=”field-tip”><i class=”fa fa-info-circle” aria-hidden=”true”></i><span class=”tip-content”>’. __(‘Describe your company’, ‘agent-plugin’).'</span></span></label>
    <textarea class=”textblock” cols=”6″ rows=”12″ name=”company_profile” placeholder=”‘. __(‘customer_profile’, ‘agent-plugin’).'” >’.$result->company_profile.'</textarea>
    <span><i class=”fa fa-check” style=”display:none;”></i></span>
    </div>

    see link for screenshot: https://prntscr.com/gdz3rc

    • This topic was modified 7 years, 3 months ago by RonaldS.
    • This topic was modified 7 years, 3 months ago by RonaldS.
    • This topic was modified 7 years, 3 months ago by RonaldS.
Viewing 3 replies - 1 through 3 (of 3 total)
  • Moderator bcworkz

    (@bcworkz)

    Textareas are primitive form fields which have no associated toolbars. You want the output from wp_editor(). Ultimately it’s still a textarea, but with toolbars and other tinyMCE features. Look at the User Notes near the bottom of the linked reference for how to specify what’s in the toolbars.

    Thread Starter RonaldS

    (@norus)

    It doesn’t work. See code below. The code shows the field via a modal popup. Maybe there is something wrong. Modal works great. Var $result->company_profile is correct shown in wp-editor. But I don’t get the toolbar.
    See: https://prntscr.com/gectcy

    !it does work outside the modal!

    $content   = $result->company_profile;
$editor_id = 'mycustomeditor';
$args = array(
    'tinymce'       => array(
        'toolbar1'      => 'bold,italic,underline,separator,alignleft,aligncenter,alignright,separator,link,unlink,undo,redo',
        'toolbar2'      => '',
        'toolbar3'      => '',
    ),
);
wp_editor( $content, $editor_id, $args );
    • This reply was modified 7 years, 3 months ago by RonaldS.
    Moderator bcworkz

    (@bcworkz)

    There’s apparently a conflict between your modal script and the toolbar script. Check you browser console for any JavaScript errors, they would need to be resolved. If there are no errors, you might be better off with different modal script that does not conflict. The simpler the better. Avoid jQuery modal libraries. You might go so far as developing your own proof of concept modal to see if anything is possible at all. Start with simply changing the editor display attribute via script of the editor that does work.

    If that much works, change the CSS so the editor appears like a modal would. Toggle the display with the same script. You now have a rudimentary modal that should work.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘How to get toolbar in textarea’ is closed to new replies.