常规设置：在站点地址字段后显示自定义插件字段

时间：2016-10-24 作者：Ethan O\'Sullivan

对于我的自定义设置字段，我希望插入它right after the Site Address (URL) field 在常规设置页面中。

我可以使用add_settings_field(). 默认情况下，它会添加自定义字段at the bottom. 使用jQuery，我可以在网站地址（URL）后显示我的自定义字段：

add_action( \'admin_footer\', \'wpse_243810_admin_footer\' );
function wpse_243810_admin_footer() {
    ?>
    <script type="text/javascript">
    jQuery(\'#protocol_relative\').closest(\'tr\').insertAfter(\'#home-description\').closest(\'tr\');
    </script>
    <?php
}

但是，它看起来如下所示：

查看代码，它会在Site Address字段的<tr> 要素我怎么能把它插到外面呢？下面是每个字段的单独代码段。

<tr>
    <th scope="row"><label for="home">Site Address (URL)</label></th>
    <td>
        <input name="home" type="url" id="home" aria-describedby="home-description" value="http://example.com" class="regular-text code">
        <p class="description" id="home-description">Enter the address here if you <a href="//codex.wordpress.org/Giving_WordPress_Its_Own_Directory">want your site home page to be different from your WordPress installation directory.</a></p>
    </td>
</tr>

这是我的插件生成的自定义字段，我希望在其之后插入：

<tr>
    <th scope="row">Protocol Relative URL</th>
    <td>
        <fieldset>
            <legend class="screen-reader-text"><span>Protocol Relative URL</span></legend>
            <label for="remove_http">
            <input name="protocol_relative" type="checkbox" id="protocol_relative" value="1" checked="checked">Do not apply to external links
            </label>
            <p class="description">Only the internal links will be affected.</p>
        </fieldset>
    </td>
</tr>

3 个回复

最合适的回答,由SO网友:Ethan O\'Sullivan 整理而成

通过使用下面的jQuery函数来解决这个问题。这个#protocol_relative 是我要插入的字段，并且#home-description 是我要插入的字段：

add_action( \'admin_footer\', \'insert_field\' );
function insert_field() {
    # Insert the settings field after the \'Site Address (URL)\'
    ?> <script type="text/javascript">
    jQuery( \'#protocol_relative\' ).closest( \'tr\' ).insertAfter( jQuery( \'#home-description\' ).closest( \'tr\' ) );
    </script> <?php
}

SO网友:wassereimer

我认为，如果不修改核心文件，这是不可能的。我们只有一次do_settings_fields 和do_settings_sections 在选项permalink中。第226行和第232行之间的phpoptional 部分

...
    </tr>
    <?php do_settings_fields(\'permalink\', \'optional\'); ?>
</table>

<?php do_settings_sections(\'permalink\'); ?>

<?php submit_button(); ?>
...

WordPress功能add_settings_field 和add_settings_section 正在使用settings api. 在核心文件中do_settings_fields 和do_settings_sections 将添加自定义字段或节（使用此api添加）的函数。这些是在页面中放置任何内容所必需的。此外，这些功能仅放在permalink页面的选项部分（硬编码）。您在geneal部分没有像options部分那样的访问点。

SO网友:jgraup

你可能只是错过了add_settings_section 之前add_settings_field. 这样可以工作，并将字段保存到option, 但我可能会扣上那部分。我只是想在登机前就上钩options-permalink.php.

<?php

// ADD SETTINGS

add_action(\'admin_head\', function(){

    // Create a section after the permalink

    add_settings_section(
        \'permalink_relative_setting_section_options\',           // id
        __( \'Protocol Relative URL\', \'textdomain\' ),            // title
        \'premalink_relative_setting_section_callback_function\', // callback
        \'permalink\'                                             // page
    );

    // Add a field to the section

    add_settings_field(
        \'permalink_relative_settings_field-id\',          // id
        \'\',                                              // title
        \'permalink_relative_settings_field_callback\',    // callback
        \'permalink\',                                     // page
        \'permalink_relative_setting_section_options\',    // section
        array( \'some_arg\' => \'For use in the callback\' ) // args
    );

});

// SECTION

function premalink_relative_setting_section_callback_function( $args ) {

    // Echo SECTION intro text here

    /*
    echo \'<p>id: \' . esc_html( $args[\'id\'] ) . \'</p>\';                         // id: eg_setting_section
    echo \'<p>title: \' . apply_filters( \'the_title\', $args[\'title\'] ) . \'</p>\'; // title: Example settings section in reading
    echo \'<p>callback: \' . esc_html( $args[\'callback\'] ) . \'</p>\';             // callback: eg_setting_section_callback_function
    */
}

// FIELD

function permalink_relative_settings_field_callback( $args ) {

    $options = get_option( \'permalink_relative_setting_section_options\' );

    $html = \'<input type="checkbox" id="relative_checkbox" name="permalink_relative_setting_section_options[relative_checkbox]" value="1"\' . checked( 1, $options[ \'relative_checkbox\' ], false ) . \'/>\';

    $html .= \'<label for="relative_checkbox">Do not apply to external links</label>\';

    echo $html;
}

// UPDATE

add_action( \'init\', function() {

    // If permalink structure is detected, let\'s update our option before the page can act

    if ( isset( $_POST[ \'permalink_structure\' ] ) || isset( $_POST[ \'category_base\' ] ) ) {

        check_admin_referer( \'update-permalink\' );

        $options = get_option( \'permalink_relative_setting_section_options\' );

        $options[ \'relative_checkbox\' ] = ( isset( $_POST[ \'permalink_relative_setting_section_options\' ][ \'relative_checkbox\' ] ) && $_POST[ \'permalink_relative_setting_section_options\' ][ \'relative_checkbox\' ] === \'1\' )
            ? \'1\' // checked
            : \'\';

        update_option( \'permalink_relative_setting_section_options\', $options );
    }
} );

如果您查看https://github.com/WordPress/WordPress/blob/master/wp-admin/options-permalink.php#L178 没有任何钩子可以做你想做的事。

考虑jQuery的manipulation 方法，如detach 和insertAfter 您可以在admin_footer.

jQuery(\'<h1>Protocol Relative URL Form!</h1>\').insertAfter(\'.form-table.permalink-structure\');

小码农CODE

常规设置：在站点地址字段后显示自定义插件字段

相关推荐

JQuery php请求返回一个奇怪的结果