请在本地主机中尝试此操作：

首先，在中构建自定义字段options-general.php 又名常规设置页面。(source)

/**
 * Class for adding a new field to the options-general.php page
 */
class Add_Settings_Field {

    /**
     * Class constructor
     */
    public function __construct() {
        add_action( \'admin_init\' , array( $this , \'register_fields\' ) );
    }

    /**
     * Add new fields to wp-admin/options-general.php page
     */
    public function register_fields() {
        register_setting( \'general\', \'phone_number_custom\', \'esc_attr\' );
        add_settings_field(
            \'custom_phone_number\',
            \'<label for="custom_phone_number">\' . __( \'Phone Number\' , \'phone_number_custom\' ) . \'</label>\',
            array( $this, \'fields_html\' ),
            \'general\'
        );
    }

    /**
     * HTML for extra settings
     */
    public function fields_html() {
        $value = get_option( \'phone_number_custom\', \'\' );
        echo \'<input type="text" id="custom_phone_number" name="phone_number_custom" value="\' . esc_attr( $value ) . \'" />\';
    }

}
new Add_Settings_Field();

现在，我们需要构建一个短代码来获取值：

    add_shortcode( \'phone\', function () {
        $phonenumber = get_option( \'phone_number_custom\', \'\' );
        $out = \'<span class="phone-styling">\'.$phonenumber.\'</span>\';
        return $out;
    } );

这是调用值的快捷码：[phone]

输出结果如下：https://prnt.sc/vhxgtx

您只需使用CSS类来设置样式：.phone-styling.

希望有帮助。