หลายอินพุตในคอนโทรล Customizer

ว่าฉันมีการควบคุมที่กำหนดเองเดียว แต่การควบคุมนี้มี 2 ปัจจัยการผลิตที่ต้องมีการบันทึกเช่น:

• ประเภทและมูลค่าของสกุลเงิน
• ขนาดและหน่วยวัด
• ชื่อและนามสกุล
• ข้อความและสไตล์
• ภาพและขนาดภาพ
• แบบอักษรตระกูลและน้ำหนักแบบอักษร

ฉันจะทำอย่างไร ฉันเห็นว่ามีตัวเลือกการตั้งค่าเมื่อสร้างตัวควบคุม แต่ไม่มีเอกสารแนะนำวิธีการใช้งานและตัวอย่างเดียวของสิ่งที่ทำในป่าคือ Easy Google Fonts ซึ่งไม่มีคำอธิบายเกี่ยวกับวิธีการทำและ อ่านยาก เป็นไปได้ที่จะซ้อนการควบคุมและส่วนต่างๆหรือไม่?

จนถึงบทเรียนและเอกสารทั้งหมดที่ฉันได้พบพูดคุยเกี่ยวกับการควบคุมด้วยอินพุต html เดียวไม่มีการพูดถึงการควบคุมที่มีอินพุต / การตั้งค่าหลายอย่างแม้ว่า API จะถูกแนะนำ

ปลั๊กอินนี้แสดงให้เห็นถึงวิธีการทำ จากหมายเหตุขั้นตอนที่เกี่ยวข้องคือ:

• ลงทะเบียนแต่ละการตั้งค่าเพื่ออัปเดต / เปลี่ยนแปลง
• เมื่อสร้างตัวควบคุมให้ส่งอาร์เรย์เป็นอาร์กิวเมนต์การตั้งค่า
• เมื่อเรนเดอร์อินพุตให้ป้อนรหัสการตั้งค่าเพื่อเชื่อมโยง
• คีย์การตั้งค่าไม่ใช่ชื่อของการตั้งค่า แต่เป็นดัชนีของอาร์เรย์เช่น 0, 1, 2
• เข้าถึงการตั้งค่าที่ลงทะเบียนไว้กับตัวควบคุมผ่าน $this->settings

นี่คือรหัส:

<?php
/*
Plugin Name: TJN Typography Control Demo
Author: Tom J Nowell
Version: 1.0
License: GPLv2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

add_action( 'customize_register', 'tjn_customize_register' );
function tjn_customize_register( $wp_customize ) {
    if ( ! isset( $wp_customize ) ) {
        return;
    }
    if ( class_exists( 'WP_Customize_Control' ) ) {

        class Toms_Control_Builder extends WP_Customize_Control {

            public $html = array();

            public function build_field_html( $key, $setting ) {
                $value = '';
                if ( isset( $this->settings[ $key ] ) )
                    $value = $this->settings[ $key ]->value();
                $this->html[] = '<div><input type="text" value="'.$value.'" '.$this->get_link( $key ).' /></div>';
            }

            public function render_content() {
                $output =  '<label>' . $this->label .'</label>';
                echo $output;
                foreach( $this->settings as $key => $value ) {
                    $this->build_field_html( $key, $value );
                }
                echo implode( '', $this->html );
            }

        }

        $section = new TJN_Customizer_Section( $wp_customize, 'test', 'Test', 11 );
        $field = new TJN_Customizer_Field( 'testfield','','Test Control' );
        $field->add_to_section( $wp_customize, $section );
    }
}


class TJN_Customizer_Section {
    public $name='';
    public $pretty_name='';
    public function __construct( WP_Customize_Manager $wp_customize, $name, $pretty_name, $priority=25 ) {
        $this->name = $name;
        $this->pretty_name = $pretty_name;

        $wp_customize->add_section( $this->getName(), array(
            'title'          => $pretty_name,
            'priority'       => $priority,
            'transport'      => 'refresh'
        ) );
    }

    public function getName() {
        return $this->name;
    }
    public function getPrettyName() {
        return $this->pretty_name;
    }
}

class TJN_Customizer_Field {

    private $name;
    private $default;
    private $pretty_name;

    public function __construct( $name, $default, $pretty_name ) {
        $this->name = $name;
        $this->default = $default;
        $this->pretty_name = $pretty_name;
    }

    public function add_to_section( WP_Customize_Manager $wp_customize, TJN_Customizer_Section $section ) {

        $wp_customize->add_setting( $this->name, array(
            'default'        => $this->default,
            'type'           => 'theme_mod',
            'capability'     => 'edit_theme_options'
        ) );
        $wp_customize->add_setting( 'moomins', array(
            'default'        => $this->default,
            'type'           => 'theme_mod',
            'capability'     => 'edit_theme_options'
        ) );
        $wp_customize->add_setting( 'papa', array(
            'default'        => $this->default,
            'type'           => 'theme_mod',
            'capability'     => 'edit_theme_options'
        ) );

        $control = new Toms_Control_Builder(
            $wp_customize, $this->name, array(
            'label'    => $this->pretty_name,
            'section'  => $section->getName(),
            'settings'   => array (
                $this->name,
                'moomins',
                'papa'
            )
        ) );

        $wp_customize->add_control( $control );
    }
}