WordPress.org

Forums

Using the WYSIWYG editor for plugins (9 posts)

  1. Naatan
    Member
    Posted 8 years ago #

    Is it possible to use the WYSIWYG editor wordpress uses for plugins? I searched for this on the website and in other plugins but couldnt find any support..

  2. Michael Bishop

    Posted 8 years ago #

    Can you be more specific on how you want to "use" it with plugins?

  3. Naatan
    Member
    Posted 8 years ago #

    Ok, if my plugin uses a textarea, is there any way I can apply wordpress' wysiwyg to my textarea?

  4. ZephyrSky
    Member
    Posted 8 years ago #

    Thanks for asking.. I'm also hoping to do this.

  5. Naatan
    Member
    Posted 8 years ago #

    anyone? please

  6. Michael Bishop

    Posted 8 years ago #

    No, there's no simple way to simply call the editor for the plugin area.

    I'm sure there's a way to add it, but would require rewriting the plugin.

    What plugin are you using that has such a field that would require the editor?

  7. LK
    Member
    Posted 8 years ago #

    I added a rich-texter to a rough plugin I made... It isn't perfect, but it gets you half way there. Here's an example:


    <script language="javascript" type="text/javascript" src="YOUR_SITE_ADDRESS/wp-includes/js/tinymce/tiny_mce_gzip.php"></script>
    <script type="text/javascript">
    tinyMCE.init({
    mode : "exact",
    elements : "calendar_cost,calendar_ticket_instructions",
    width : "100%",
    theme : "advanced",
    theme_advanced_buttons1 : "bold,italic,strikethrough,separator,bullist,numlist,outdent,indent,se parator,justifyleft,justifycenter,justifyright,separator,link,unlink,separator,undo,redo,code",
    theme_advanced_buttons2 : "",
    theme_advanced_buttons3 : "",
    theme_advanced_toolbar_location : "top",
    theme_advanced_toolbar_align : "left",
    theme_advanced_path_location : "bottom",
    theme_advanced_resizing : true,
    browsers : "msie,gecko",
    dialog_type : "modal",
    theme_advanced_resize_horizontal : false,
    entity_encoding : "raw",
    relative_urls : false,
    remove_script_host : false,
    force_p_newlines : true,
    force_br_newlines : false,
    convert_newlines_to_brs : false,
    remove_linebreaks : true,
    save_callback : "wp_save_callback",
    valid_elements : "-a[id|href|title|rel],-strong/b,-em/i,-strike,-del,-u,p[class|align], -ol,-ul,-li,br,img[class|src|alt|title|width|height|align],-sub,-sup,- blockquote,-table[border=0|cellspacing|cellpadding|width|height|class| align],tr[class|rowspan|width|height|align|valign],td[dir|class|colspa n|rowspan|width|height|align|valign],-div[dir|class|align],-span[class |align],-pre[class],address,-h1[class|align],-h2[class|align],-h3[clas s|align],-h4[class|align],-h5[class|align],-h6[class|align],hr",
    plugins : "wordpress,autosave,"
    <?php do_action('mce_options'); ?>
    });
    </script>

    The key lines are "mode" and "elements". Mode should be "exact"... there are some other mode settings you can apply if you search around. Elements need to match the div's you're turning on. In my example, I've turned on three div's named "calendar_cost" and "calendar_ticket_instructions".

    You'll need to play around with the "buttons" and "plugins" and other lines to get the exact combination and order of buttons you want to show up.

    What I didn't need to look into is whether calling the rich-texter this way obeys the individual user's choice whether to use tiny-mce or quicktags.

    What am I missing? The code to put around your div that you want to turn on. Here's an example using the "calendar_cost" div specified in the "elements" line from the script above:


    <fieldset id="titlediv" class="small">
    <legend><?php _e('Event Cost') ?></legend>
    <div><textarea name="calendar_cost" style="width: 100%;" cols="40" rows="3" /><?php if ($post_ID != 0 && $_GET['action'] == 'edit') { echo wp_richedit_pre(get_post_meta($post_ID, 'calendar_cost', true)); } ?></textarea></div>
    </fieldset>

    Hope that's helpful...

  8. mudar
    Member
    Posted 7 years ago #

    Hi,

    I had the same problem, and this seems to solve it !

    <script type='text/javascript' src='http://localhost/wordpress/wp-includes/js/tinymce/tiny_mce_gzip.php?ver=20070326'></script>
    <script type='text/javascript' src='http://localhost/wordpress/wp-includes/js/tinymce/tiny_mce_config.php?ver=20070225'></script>
    
    <form name="post" action="" method="post" id="post">
    <fieldset id="<?php echo user_can_richedit() ? 'postdivrich' : 'postdiv'; ?>">
    <?php the_editor($post->post_content); ?></fieldset>
    </form>
  9. harknell
    Member
    Posted 7 years ago #

    I just added the advanced visual editor function to my main plugins. It's actually not super hard once you understand what to do. If you grab my news announcement plugin you can see the javascript block you need to add in if you look at the code.

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.