Agregar un editor html a la página de configuración del complemento

Navega tus respuestas
4

Estoy creando una página de configuración de complementos utilizando la api register_settings ().

¿Cómo puedo crear un editor html (el editor predeterminado de wordpress sería espléndido) en lugar de solo un área de texto?

Este es un ejemplo del código que estoy usando: 

add_action( 'admin_menu', 'pw_add_admin_menu' );
add_action( 'admin_init', 'pw_settings_init' );


function pw_add_admin_menu(  ) { 

    add_menu_page( 'wpset', 'wpset', 'manage_options', 'pset', 'pw_options_page' );

}


function pw_settings_init(  ) { 

    register_setting( 'pluginPage', 'pw_settings' );

    add_settings_section(
        'pw_pluginPage_section', 
        __( 'Live Credentials', 'pw' ), 
        'pw_settings_section_callback', 
        'pluginPage'
    );
    add_settings_field( 
        'pw_textarea_intro', 
        __( 'Header Intro Text', 'pw' ), 
        'pw_textarea_intro_render', 
        'pluginPage', 
        'pw_pluginPage_section' 
    );
}

function pw_textarea_intro_render(  ) { 

    $options = get_option( 'pw_settings' );
    ?>
    <textarea cols='40' rows='5' name='pw_settings[pw_textarea_intro]'> 
        <?php echo $options['pw_textarea_intro']; ?>
    </textarea>
    <?php

}

He reducido el código a solo un campo, pero hay más campos.

Esto representa el área de texto para mí, pero no puedo formatear el texto y sigue agregando pestañas adicionales antes y después de cualquier texto que ingrese en la página de configuración. 

add_action( 'admin_menu', 'pw_add_admin_menu' );
add_action( 'admin_init', 'pw_settings_init' );


function pw_add_admin_menu(  ) { 

    add_menu_page( 'wpset', 'wpset', 'manage_options', 'pset', 'pw_options_page' );

}


function pw_settings_init(  ) { 

    register_setting( 'pluginPage', 'pw_settings' );

    add_settings_section(
        'pw_pluginPage_section', 
        __( 'Live Credentials', 'pw' ), 
        'pw_settings_section_callback', 
        'pluginPage'
    );
    add_settings_field( 
        'pw_textarea_intro', 
        __( 'Header Intro Text', 'pw' ), 
        'pw_textarea_intro_render', 
        'pluginPage', 
        'pw_pluginPage_section' 
    );
    add_settings_field( 
        'pw_intro', 
        __( 'Intro', 'pw' ), 
        'pw_intro_render', 
        'pluginPage', 
        'pw_pluginPage_section' 
    );
}

function pw_textarea_intro_render(  ) { 

    $options = get_option( 'pw_settings' );
    ?>
    <textarea cols='40' rows='5' name='pw_settings[pw_textarea_intro]'> 
        <?php echo $options['pw_textarea_intro']; ?>
    </textarea>
    <?php

}

function pw_intro_render() {
    $options = get_option( 'pw_settings' );
    echo wp_editor( $options['pw_intro'], 'pw_intro', array('textarea_name' => 'pw_intro', 'media_buttons' => false)  );
}

Agregué el nuevo código como Dave sugirió (¡gracias!) y ahora carga el editor wp, pero cuando hago clic en guardar para confirmar los cambios, no guarda el contenido de wp_editor. ¿Algunas ideas?

    
pregunta pressword 27.03.2017 - 23:04

2 respuestas

2

Aquí hay una versión actualizada de su código original, que resuelve el problema de guardar.

La razón por la que el contenido dentro del Editor de WP no se estaba guardando se debía al valor del parámetro textarea_name pasado a wp_editor() .

Esto está mal: 

 'textarea_name' => 'pw_intro',

Debería verse así: 

 'textarea_name' => 'pw_settings[pw_intro]',

También eliminé el eco de wp_editor() , solucioné los espacios adicionales alrededor del área de texto, etc.

Ejemplo de código completo: 

add_action( 'admin_menu', 'pw_add_admin_menu' );
add_action( 'admin_init', 'pw_settings_init' );
function pw_add_admin_menu(  ) { 
    add_menu_page( 'wpset', 'wpset', 'manage_options', 'pset', 'pw_options_page' );
}

function pw_settings_init(  ) { 
    register_setting( 'pluginPage', 'pw_settings' );

    add_settings_section(
            'pw_pluginPage_section', 
            __( 'Live Credentials', 'pw' ), 
            'pw_settings_section_callback', 
            'pluginPage'
    );

    add_settings_field( 
            'pw_textarea_intro', 
            __( 'Header Intro Text', 'pw' ), 
            'pw_textarea_intro_render', 
            'pluginPage', 
            'pw_pluginPage_section' 
    );

    add_settings_field( 
            'pw_intro', 
            __( 'Intro', 'pw' ), 
            'pw_intro_render', 
            'pluginPage', 
            'pw_pluginPage_section' 
    );
}

function pw_textarea_intro_render(  ) { 
    $options = get_option( 'pw_settings', array() );

?><textarea cols='40' rows='5' name='pw_settings[pw_textarea_intro]'><?php echo isset( $options['pw_textarea_intro'] ) ?  $options['pw_textarea_intro'] : false; ?></textarea><?php
}

function pw_intro_render() {
    $options = get_option( 'pw_settings', array() );
    $content = isset( $options['pw_intro'] ) ?  $options['pw_intro'] : false;
    wp_editor( $content, 'pw_intro', array( 
        'textarea_name' => 'pw_settings[pw_intro]',
        'media_buttons' => false,
    ) );
}

// section content cb
function pw_settings_section_callback() {
    echo '<p>Section Introduction.</p>';
}
    
respondido por el Dave Romsey 28.03.2017 - 19:48
2

siempre siempre escape la salida (ok, algunos casos raros no deberías, pero la regla de oro es escapar). Para textarea necesita html escapar del contenido

<textarea><?php echo esc_html(get_option('my option')?></textarea>

tener el espacio entre las etiquetas textarea inicial y final y la salida real tampoco ayuda y probablemente agregue algunos espacios alrededor de su "" contenido "

    
respondido por el Mark Kaplun 28.03.2017 - 09:14

Lea otras preguntas en las etiquetas

get_parent_theme_file_path vs. get_template_directory Multisite: ¿diferencias entre subdominio y modo subdirectorio? ¿Se puede cambiar después de la instalación?