$conf, $runtime; function_exists('chdir') AND chdir(APP_PATH); $r = 'mysql' == $conf['cache']['type'] ? website_set('runtime', $runtime) : cache_set('runtime', $runtime); } function runtime_truncate() { global $conf; 'mysql' == $conf['cache']['type'] ? website_set('runtime', '') : cache_delete('runtime'); } register_shutdown_function('runtime_save'); ?>plugin development - Integrating colorpicker into array field|Programmer puzzle solving
最新消息:Welcome to the puzzle paradise for programmers! Here, a well-designed puzzle awaits you. From code logic puzzles to algorithmic challenges, each level is closely centered on the programmer's expertise and skills. Whether you're a novice programmer or an experienced tech guru, you'll find your own challenges on this site. In the process of solving puzzles, you can not only exercise your thinking skills, but also deepen your understanding and application of programming knowledge. Come to start this puzzle journey full of wisdom and challenges, with many programmers to compete with each other and show your programming wisdom! Translated with DeepL.com (free version)

plugin development - Integrating colorpicker into array field

matteradmin11PV0评论

I am using this code and i am trying to show a colorpicker onto an array field. Any ideas, how to do it?

<?php

class Smashing_Fields_Plugin {

    public function __construct() {
        // Hook into the admin menu
        add_action( 'admin_menu', array( $this, 'create_plugin_settings_page' ) );

        // Add Settings and Fields
        add_action( 'admin_init', array( $this, 'setup_sections' ) );
        add_action( 'admin_init', array( $this, 'setup_fields' ) );
    }

    public function create_plugin_settings_page() {
        // Add the menu item and page
        $page_title = 'My Awesome Settings Page';
        $menu_title = 'Awesome Plugin';
        $capability = 'manage_options';
        $slug = 'smashing_fields';
        $callback = array( $this, 'plugin_settings_page_content' );
        $icon = 'dashicons-admin-plugins';
        $position = 100;

        add_menu_page( $page_title, $menu_title, $capability, $slug, $callback, $icon, $position );
    }

    public function plugin_settings_page_content() {?>
        <div class="wrap">
            <h2>My Awesome Settings Page</h2><?php
            if ( isset( $_GET['settings-updated'] ) && $_GET['settings-updated'] ){
                  $this->admin_notice();
            } ?>
            <form method="POST" action="options.php">
                <?php
                    settings_fields( 'smashing_fields' );
                    do_settings_sections( 'smashing_fields' );
                    submit_button();
                ?>
            </form>
        </div> <?php
    }

    public function admin_notice() { ?>
        <div class="notice notice-success is-dismissible">
            <p>Your settings have been updated!</p>
        </div><?php
    }

    public function setup_sections() {
        add_settings_section( 'our_first_section', 'My First Section Title', array( $this, 'section_callback' ), 'smashing_fields' );
        add_settings_section( 'our_second_section', 'My Second Section Title', array( $this, 'section_callback' ), 'smashing_fields' );
        add_settings_section( 'our_third_section', 'My Third Section Title', array( $this, 'section_callback' ), 'smashing_fields' );
    }

    public function section_callback( $arguments ) {
        switch( $arguments['id'] ){
            case 'our_first_section':
                echo 'This is the first description here!';
                break;
            case 'our_second_section':
                echo 'This one is number two';
                break;
            case 'our_third_section':
                echo 'Third time is the charm!';
                break;
        }
    }

    public function setup_fields() {
        $fields = array(
            array(
                'uid' => 'awesome_text_field',
                'label' => 'Sample Text Field',
                'section' => 'our_first_section',
                'type' => 'text',
                'placeholder' => 'Some text',
                'helper' => 'Does this help?',
                'supplimental' => 'I am underneath!',
            ),
            array(
                'uid' => 'awesome_password_field',
                'label' => 'Sample Password Field',
                'section' => 'our_first_section',
                'type' => 'password',
            ),
            array(
                'uid' => 'awesome_number_field',
                'label' => 'Sample Number Field',
                'section' => 'our_first_section',
                'type' => 'number',
            ),
            array(
                'uid' => 'awesome_textarea',
                'label' => 'Sample Text Area',
                'section' => 'our_first_section',
                'type' => 'textarea',
            ),
            array(
                'uid' => 'awesome_select',
                'label' => 'Sample Select Dropdown',
                'section' => 'our_first_section',
                'type' => 'select',
                'options' => array(
                    'option1' => 'Option 1',
                    'option2' => 'Option 2',
                    'option3' => 'Option 3',
                    'option4' => 'Option 4',
                    'option5' => 'Option 5',
                ),
                'default' => array()
            ),
            array(
                'uid' => 'awesome_multiselect',
                'label' => 'Sample Multi Select',
                'section' => 'our_first_section',
                'type' => 'multiselect',
                'options' => array(
                    'option1' => 'Option 1',
                    'option2' => 'Option 2',
                    'option3' => 'Option 3',
                    'option4' => 'Option 4',
                    'option5' => 'Option 5',
                ),
                'default' => array()
            ),
            array(
                'uid' => 'awesome_radio',
                'label' => 'Sample Radio Buttons',
                'section' => 'our_first_section',
                'type' => 'radio',
                'options' => array(
                    'option1' => 'Option 1',
                    'option2' => 'Option 2',
                    'option3' => 'Option 3',
                    'option4' => 'Option 4',
                    'option5' => 'Option 5',
                ),
                'default' => array()
            ),
            array(
                'uid' => 'awesome_checkboxes',
                'label' => 'Sample Checkboxes',
                'section' => 'our_first_section',
                'type' => 'checkbox',
                'options' => array(
                    'option1' => 'Option 1',
                    'option2' => 'Option 2',
                    'option3' => 'Option 3',
                    'option4' => 'Option 4',
                    'option5' => 'Option 5',
                ),
                'default' => array()
            )
        );
        foreach( $fields as $field ){

            add_settings_field( $field['uid'], $field['label'], array( $this, 'field_callback' ), 'smashing_fields', $field['section'], $field );
            register_setting( 'smashing_fields', $field['uid'] );
        }
    }

    public function field_callback( $arguments ) {

        $value = get_option( $arguments['uid'] );

        if( ! $value ) {
            $value = $arguments['default'];
        }

        switch( $arguments['type'] ){
            case 'text':
            case 'password':
            case 'number':
                printf( '<input name="%1$s" id="%1$s" type="%2$s" placeholder="%3$s" value="%4$s" />', $arguments['uid'], $arguments['type'], $arguments['placeholder'], $value );
                break;
            case 'textarea':
                printf( '<textarea name="%1$s" id="%1$s" placeholder="%2$s" rows="5" cols="50">%3$s</textarea>', $arguments['uid'], $arguments['placeholder'], $value );
                break;
            case 'select':
            case 'multiselect':
                if( ! empty ( $arguments['options'] ) && is_array( $arguments['options'] ) ){
                    $attributes = '';
                    $options_markup = '';
                    foreach( $arguments['options'] as $key => $label ){
                        $options_markup .= sprintf( '<option value="%s" %s>%s</option>', $key, selected( $value[ array_search( $key, $value, true ) ], $key, false ), $label );
                    }
                    if( $arguments['type'] === 'multiselect' ){
                        $attributes = ' multiple="multiple" ';
                    }
                    printf( '<select name="%1$s[]" id="%1$s" %2$s>%3$s</select>', $arguments['uid'], $attributes, $options_markup );
                }
                break;
            case 'radio':
            case 'checkbox':
                if( ! empty ( $arguments['options'] ) && is_array( $arguments['options'] ) ){
                    $options_markup = '';
                    $iterator = 0;
                    foreach( $arguments['options'] as $key => $label ){
                        $iterator++;
                        $options_markup .= sprintf( '<label for="%1$s_%6$s"><input id="%1$s_%6$s" name="%1$s[]" type="%2$s" value="%3$s" %4$s /> %5$s</label><br/>', $arguments['uid'], $arguments['type'], $key, checked( $value[ array_search( $key, $value, true ) ], $key, false ), $label, $iterator );
                    }
                    printf( '<fieldset>%s</fieldset>', $options_markup );
                }
                break;
        }

        if( $helper = $arguments['helper'] ){
            printf( '<span class="helper"> %s</span>', $helper );
        }

        if( $supplimental = $arguments['supplimental'] ){
            printf( '<p class="description">%s</p>', $supplimental );
        }

    }

}
new Smashing_Fields_Plugin();

I am using this code and i am trying to show a colorpicker onto an array field. Any ideas, how to do it?

<?php

class Smashing_Fields_Plugin {

    public function __construct() {
        // Hook into the admin menu
        add_action( 'admin_menu', array( $this, 'create_plugin_settings_page' ) );

        // Add Settings and Fields
        add_action( 'admin_init', array( $this, 'setup_sections' ) );
        add_action( 'admin_init', array( $this, 'setup_fields' ) );
    }

    public function create_plugin_settings_page() {
        // Add the menu item and page
        $page_title = 'My Awesome Settings Page';
        $menu_title = 'Awesome Plugin';
        $capability = 'manage_options';
        $slug = 'smashing_fields';
        $callback = array( $this, 'plugin_settings_page_content' );
        $icon = 'dashicons-admin-plugins';
        $position = 100;

        add_menu_page( $page_title, $menu_title, $capability, $slug, $callback, $icon, $position );
    }

    public function plugin_settings_page_content() {?>
        <div class="wrap">
            <h2>My Awesome Settings Page</h2><?php
            if ( isset( $_GET['settings-updated'] ) && $_GET['settings-updated'] ){
                  $this->admin_notice();
            } ?>
            <form method="POST" action="options.php">
                <?php
                    settings_fields( 'smashing_fields' );
                    do_settings_sections( 'smashing_fields' );
                    submit_button();
                ?>
            </form>
        </div> <?php
    }

    public function admin_notice() { ?>
        <div class="notice notice-success is-dismissible">
            <p>Your settings have been updated!</p>
        </div><?php
    }

    public function setup_sections() {
        add_settings_section( 'our_first_section', 'My First Section Title', array( $this, 'section_callback' ), 'smashing_fields' );
        add_settings_section( 'our_second_section', 'My Second Section Title', array( $this, 'section_callback' ), 'smashing_fields' );
        add_settings_section( 'our_third_section', 'My Third Section Title', array( $this, 'section_callback' ), 'smashing_fields' );
    }

    public function section_callback( $arguments ) {
        switch( $arguments['id'] ){
            case 'our_first_section':
                echo 'This is the first description here!';
                break;
            case 'our_second_section':
                echo 'This one is number two';
                break;
            case 'our_third_section':
                echo 'Third time is the charm!';
                break;
        }
    }

    public function setup_fields() {
        $fields = array(
            array(
                'uid' => 'awesome_text_field',
                'label' => 'Sample Text Field',
                'section' => 'our_first_section',
                'type' => 'text',
                'placeholder' => 'Some text',
                'helper' => 'Does this help?',
                'supplimental' => 'I am underneath!',
            ),
            array(
                'uid' => 'awesome_password_field',
                'label' => 'Sample Password Field',
                'section' => 'our_first_section',
                'type' => 'password',
            ),
            array(
                'uid' => 'awesome_number_field',
                'label' => 'Sample Number Field',
                'section' => 'our_first_section',
                'type' => 'number',
            ),
            array(
                'uid' => 'awesome_textarea',
                'label' => 'Sample Text Area',
                'section' => 'our_first_section',
                'type' => 'textarea',
            ),
            array(
                'uid' => 'awesome_select',
                'label' => 'Sample Select Dropdown',
                'section' => 'our_first_section',
                'type' => 'select',
                'options' => array(
                    'option1' => 'Option 1',
                    'option2' => 'Option 2',
                    'option3' => 'Option 3',
                    'option4' => 'Option 4',
                    'option5' => 'Option 5',
                ),
                'default' => array()
            ),
            array(
                'uid' => 'awesome_multiselect',
                'label' => 'Sample Multi Select',
                'section' => 'our_first_section',
                'type' => 'multiselect',
                'options' => array(
                    'option1' => 'Option 1',
                    'option2' => 'Option 2',
                    'option3' => 'Option 3',
                    'option4' => 'Option 4',
                    'option5' => 'Option 5',
                ),
                'default' => array()
            ),
            array(
                'uid' => 'awesome_radio',
                'label' => 'Sample Radio Buttons',
                'section' => 'our_first_section',
                'type' => 'radio',
                'options' => array(
                    'option1' => 'Option 1',
                    'option2' => 'Option 2',
                    'option3' => 'Option 3',
                    'option4' => 'Option 4',
                    'option5' => 'Option 5',
                ),
                'default' => array()
            ),
            array(
                'uid' => 'awesome_checkboxes',
                'label' => 'Sample Checkboxes',
                'section' => 'our_first_section',
                'type' => 'checkbox',
                'options' => array(
                    'option1' => 'Option 1',
                    'option2' => 'Option 2',
                    'option3' => 'Option 3',
                    'option4' => 'Option 4',
                    'option5' => 'Option 5',
                ),
                'default' => array()
            )
        );
        foreach( $fields as $field ){

            add_settings_field( $field['uid'], $field['label'], array( $this, 'field_callback' ), 'smashing_fields', $field['section'], $field );
            register_setting( 'smashing_fields', $field['uid'] );
        }
    }

    public function field_callback( $arguments ) {

        $value = get_option( $arguments['uid'] );

        if( ! $value ) {
            $value = $arguments['default'];
        }

        switch( $arguments['type'] ){
            case 'text':
            case 'password':
            case 'number':
                printf( '<input name="%1$s" id="%1$s" type="%2$s" placeholder="%3$s" value="%4$s" />', $arguments['uid'], $arguments['type'], $arguments['placeholder'], $value );
                break;
            case 'textarea':
                printf( '<textarea name="%1$s" id="%1$s" placeholder="%2$s" rows="5" cols="50">%3$s</textarea>', $arguments['uid'], $arguments['placeholder'], $value );
                break;
            case 'select':
            case 'multiselect':
                if( ! empty ( $arguments['options'] ) && is_array( $arguments['options'] ) ){
                    $attributes = '';
                    $options_markup = '';
                    foreach( $arguments['options'] as $key => $label ){
                        $options_markup .= sprintf( '<option value="%s" %s>%s</option>', $key, selected( $value[ array_search( $key, $value, true ) ], $key, false ), $label );
                    }
                    if( $arguments['type'] === 'multiselect' ){
                        $attributes = ' multiple="multiple" ';
                    }
                    printf( '<select name="%1$s[]" id="%1$s" %2$s>%3$s</select>', $arguments['uid'], $attributes, $options_markup );
                }
                break;
            case 'radio':
            case 'checkbox':
                if( ! empty ( $arguments['options'] ) && is_array( $arguments['options'] ) ){
                    $options_markup = '';
                    $iterator = 0;
                    foreach( $arguments['options'] as $key => $label ){
                        $iterator++;
                        $options_markup .= sprintf( '<label for="%1$s_%6$s"><input id="%1$s_%6$s" name="%1$s[]" type="%2$s" value="%3$s" %4$s /> %5$s</label><br/>', $arguments['uid'], $arguments['type'], $key, checked( $value[ array_search( $key, $value, true ) ], $key, false ), $label, $iterator );
                    }
                    printf( '<fieldset>%s</fieldset>', $options_markup );
                }
                break;
        }

        if( $helper = $arguments['helper'] ){
            printf( '<span class="helper"> %s</span>', $helper );
        }

        if( $supplimental = $arguments['supplimental'] ){
            printf( '<p class="description">%s</p>', $supplimental );
        }

    }

}
new Smashing_Fields_Plugin();
Share Improve this question edited Dec 10, 2018 at 23:16 jeejee asked Dec 10, 2018 at 22:46 jeejeejeejee 234 bronze badges 2
  • You should probably elaborate some more and provide more code – Tim Hallman Commented Dec 10, 2018 at 22:59
  • Looks like you will need to define a colorpicker in your switch statement. Then you can reference that with a new array in your setup_fields method – Tim Hallman Commented Dec 10, 2018 at 23:23
Add a comment  | 

1 Answer 1

Reset to default 0

Real quick this should point you in the right direction, you need to define your colorpicker and then reference it, so like:

switch( $arguments['type'] ){
       case 'text':
       case 'password':
       case 'number':
       printf( '<input name="%1$s" id="%1$s" type="%2$s" placeholder="%3$s" value="%4$s" />', $arguments['uid'], $arguments['type'], $arguments['placeholder'], $value );
    break;
    case 'colorpicker':
       printf( '<input name="%1$s" id="%1$s" type="%2$s" placeholder="%3$s" value="%4$s" />', $arguments['uid'], $arguments['type'], $arguments['placeholder'], $value );
    break;
    ...
}

Then reference it in your setup_fields method:

public function setup_fields() {
        $fields = array(
            array(
                'uid' => 'awesome_text_field',
                'label' => 'Sample Text Field',
                'section' => 'our_first_section',
                'type' => 'text',
                'placeholder' => 'Some text',
                'helper' => 'Does this help?',
                'supplimental' => 'I am underneath!',
            ),
            array(
                'uid' => 'awesome_color_picker',
                'label' => 'Sample colorpicker',
                'section' => 'our_whatever_section',
                'type' => 'colorpicker',
                'placeholder' => 'Some text',
                'helper' => 'Does this help?',
                'supplimental' => 'I am underneath!',
            ),
            ....
}
Post a comment

comment list (0)

  1. No comments so far