wordpress how to add wp_editor in an array

Question

I had a small problem in my wordpress code I need to show a wordpress wp_editor in my page where it has array of values.the values are defined like the following

    $fields[] = array(
        'name' => __('Class', 'my-theme'),
        'desc' => __('', 'my-theme'),
        'id' => 'class'.$n,
        'std' => ( ( isset($class_text[$n]['class']) ) ? $class_text[$n]['class'] : '' ),
        'type' => 'text');

When I define my wp_editor like the above array it doesn't display where I want. Instead all the editors displayed at the top before any content in all pages.

I tried like the following set of array for the editor:

    $fields[] = array(
        'name' => __('My Content', 'my-theme'),
        'id' => 'sectioncontent'.$n,
        'std' => ( ( isset($class_text[$n]['content']) ) ? $class_text[$n]['content'] : '' ),
        'type' => wp_editor( '', 'sectioncontent'.$n ));

Attached the image of my problem:

Uncovered

Which hook are you calling wp_editor from? – Biocellate

I think wp_editor is a default editor function in wordpress. I just called as my above code. – Uncovered

The where will determine the when. You just cant modify scripts. You need to know which files to add/modify and which functions to call in order to get what you want where you want. Please check this page codex.wordpress.org/Plugin_API/Action_Reference I will be hapy to help if you tell me exactly where and when you need the editor included (the edit page of a normal post, the edit page of a custom post type, the options page of your plug-in, etc.) – Biocellate

Answer 1

Cause

By default wp_editor prints the textarea that's why you cannot assign it to any variable or array.

Solution

you can use output buffering of php to get printed data in variable like this:

ob_start(); // Start output buffer

// Print the editor
wp_editor( '', 'sectioncontent'.$n );

// Store the printed data in $editor variable
$editor = ob_get_clean();

// And then you can assign that wp_editor to your array.

$fields[] = array(
        'name' => __('My Content', 'my-theme'),
        'id' => 'sectioncontent'.$n,
        'std' => ( ( isset($class_text[$n]['content']) ) ? $class_text[$n]['content'] : '' ),
        'type' => $editor); // <-- HERE

Heliacal

thank you for your answer, but not working only empty page appears. – Uncovered

Op's i got a type in my answer, now check. – Heliacal

the coding of the textarea sits inside the class like this class="section section-<div id="wp-sectioncontent1-wrap" class="wp-core-ui wp-editor-wrap tmce-active"><link rel='stylesheet' id='dashicons-css' href='localhost/wordpress/wp-includes/css/dashicons.min.css?ver=4.3.1' type='text/css' media='all' /> <link rel='stylesheet' id='editor-buttons-css' href='localhost/wordpress/wp-includes/css/editor.min.css?ver=4.3.1' type='text/css' media='all' /> " – Uncovered

@syedmohamed Hi Syed, based on the fact that you are getting that output in the class attribute of the section markup, I am now sure that you are using Redux. See my answer for the resolution, or just replace $editor with 'editor' in the $fields[] array definition :) – Settle

just defining editor doesn't having much options. like uploading media and other – Uncovered

@syedmohamed Check out the documentation I have linked - There are options you can set to control the display of media upload buttons and other portions of the editor. – Settle

This is brilliant, I would have never in a million years thought to print this through ob_start. Works like a champ! – Decency

Answer 2

Looks to me like you're using Redux Framework to set up your theme/plugin option page - If you are looking to add the default Wordpress WYSIWYG (What You See Is What You Get - the same editor from the edit post page in the backend) editor in there you'll need to use the type: 'editor'.

It can be confusing - the wp_editor() function you are using is the right place to start if you were setting up this options page from scratch, but you'd need to do quite a bit of work to have it display where and how you want it. Redux et al make this quite a bit easier for you by generating the editor for you, so instead of you using the wp_editor function at all you just tell Redux that you want an editor field called 'My Content' to be one of the fields on the page.

The documentation for the editor field is here: https://docs.reduxframework.com/core/fields/editor/

If I am correct that you are using redux, the correct code to replace what you have is:

 $fields[] = array(
        'name' => __('My Content', 'my-theme'),
        'id' => 'sectioncontent'.$n,
        'std' => ( ( isset($class_text[$n]['content']) ) ? $class_text[$n]['content'] : '' ),
        'type' => 'editor');

To explain the other parts of this field array:

• 'Name' will be what shows up in the label for this field. In this case you are using the localization functions in wordpress (__()) to get a phrase from the local dictionary in the 'my-theme' domain.
• 'id' is what you will use to retrieve what has been entered into this field. It will also affect the ID attribute assigned to the HTML elements in the options page.
• 'std' is the default for the field, which will be the value of the field when the options page is first displayed, before the user has set any options

On the editor documentation page linked above, you'll see the details of various other options you can define, like whether to show Media Upload buttons, and whether to run the input through wpautop to replace line breaks in the editor with <p> tags (by default both of these are true).

Havard