কীভাবে WP_Customize_Control প্রসারিত করবেন


27

আমি কাস্টমাইজ লাইভ প্রিভিউ প্যানেলটিতে নতুন ধরণের নিয়ন্ত্রণ যুক্ত করার উপায় খুঁজছি । আমি দেখেছি কীভাবে প্যানেলে নতুন বিভাগ যুক্ত করা যায় add_action( 'customize_register'...

আমি যে নিয়ন্ত্রণটি প্রয়োগ করতে চাই তা হ'ল ভিন্ন ধরণের রঙ চয়নকারী। ইন একটি আগের পোস্ট , আমরা কোর শ্রেণীর প্রসারিত কিভাবে উইজেট যোগ করার জন্য দেখতে, কিন্তু আমি এখানে অভাব একটি হুক আমার সক্ষম করবে সুযোগ আমার বস্তুর আনতে হয় - WP_Customize_Palette_Control। এ

আপনি কোডের সূচনাটি এখানে দেখতে পারেন । এই কোডটি functions.phpআমার থিমের ফাইলটিতে রয়েছে।

কোন সাহায্যের জন্য ধন্যবাদ। হরণ করা

সবেমাত্র কোড আপডেট হয়েছে। এখন আমি require_onceক্লাস আনতে হবে। সুতরাং এখন আমার কোনও পিএইচপি ত্রুটি নেই তবে আমার নতুন নিয়ন্ত্রণ HTML উপস্থিত হয় না।

<?php

require_once( ABSPATH . WPINC . '/class-wp-customize-setting.php' );
require_once( ABSPATH . WPINC . '/class-wp-customize-section.php' );
require_once( ABSPATH . WPINC . '/class-wp-customize-control.php' );

class WP_Customize_Palette_Control extends WP_Customize_Image_Control {  
        public $type    = 'palette';
        public $removed = '';
        public $context;

        public function enqueue() {
                //wp_enqueue_script( 'wp-plupload' );
        }

        public function to_json() {
                parent::to_json();

                $this->json['removed'] = $this->removed;

                if ( $this->context )
                        $this->json['context'] = $this->context;
        }

        public function render_content() {
                ?>
                <label>
                        <span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>
                        <div>
                                <a href="#" class="button-secondary upload"><?php _e( 'Upload' ); ?></a>
                                <a href="#" class="remove"><?php _e( 'Remove' ); ?></a>
                        </div>
                </label>
                <?php
        }
}

//new WP_Customize_Palette_Control();


//add_action('customize_controls_init', 'WP_Customize_Palette_Control');

// add an option to the customize panel

function sci_customize_controls_init($wp_customize) {
    $wp_customize->add_section( 'themename_color_scheme', array(
        'title'          => __( 'Color Scheme', 'themename' ),
        'priority'       => 35,
    ) );

    $wp_customize->add_setting( 'themename_theme_options[color_scheme]', array(
    'default'        => 'some-default-value',
    'type'           => 'option',
    'capability'     => 'edit_theme_options',
) );


$wp_customize->add_control( 'themename_color_scheme', array(
    'label'      => __( 'Color Scheme', 'themename' ),
    'section'    => 'themename_color_scheme',
    'settings'   => 'themename_theme_options[color_scheme]',
    'type'       => 'palette',
    'choices'    => array(
        'value1' => 'Choice 1',
        'value2' => 'Choice 2',
        'value3' => 'Choice 3',
        ),
) );

}

add_action( 'customize_register', 'sci_customize_controls_init' );

3
মাইনর পয়েন্ট, তবে আপনার নিয়ন্ত্রণটি ওয়ার্ডপ্রেস কোরের ভিতরে না যাওয়া পর্যন্ত WP_ উপসর্গটি ব্যবহার করবেন না। শ্রেণীর নামের উপসর্গ হিসাবে নিজের প্লাগইন / থিমের নামটি ব্যবহার করুন।
অটো

উত্তর:


14

ব্যবহারের জন্য উদাহরণ এবং বর্গ

আপনি আমার বর্তমান থিমটিতে দেখতে পারেন, এটি কীভাবে এটি ব্যবহার সম্ভব। এছাড়াও আপনি ক্লাস ব্যবহার করতে পারেন। এটি অন্তর্ভুক্ত করার জন্য গিথুব এ এই ক্লাসটি দেখুন checkfunctions.php

আরম্ভ করুন!

আপনি customize_register হুকের মাধ্যমে থিম কাস্টমাইজারের জন্য আপনার কাস্টম সেটিংসটি নিবন্ধভুক্ত করতে পারেন :

add_action( 'customize_register', 'themedemo_customize' );
function themedemo_customize($wp_customize) {

    $wp_customize->add_section( 'themedemo_demo_settings', array(
        'title'          => 'Demonstration Stuff',
        'priority'       => 35,
    ) );

    $wp_customize->add_setting( 'some_setting', array(
        'default'        => 'default_value',
    ) );

    $wp_customize->add_control( 'some_setting', array(
        'label'   => 'Text Setting',
        'section' => 'themedemo_demo_settings',
        'type'    => 'text',
    ) );

    $wp_customize->add_setting( 'some_other_setting', array(
        'default'        => '#000000',
    ) );

    $wp_customize->add_control( new WP_Customize_Color_Control( $wp_customize, 'some_other_setting', array(
        'label'   => 'Color Setting',
        'section' => 'themedemo_demo_settings',
        'settings'   => 'some_other_setting',
    ) ) );

}

থিম ব্যবহার:

এটি নীচের উদাহরণের মতো Use ব্যবহার করুন:

echo 'some_setting => ' .get_theme_mod( 'some_setting', 'default_value' )."\n";
echo 'some_other_setting => ' .get_theme_mod( 'some_other_setting', '#000000' )."\n";
echo 'non_existent_setting => '.get_theme_mod( 'non_existent_setting', 'default_value' )."\n";

সমন্বয়

আপনি নিয়ন্ত্রণটি পরিবর্তন করতে পারেন:

$wp_customize->add_control( 'themename_color_scheme', array(
    'label'      => __( 'Color Scheme', 'themename' ),
    'section'    => 'themename_color_scheme',
    'settings'   => 'themename_theme_options[color_scheme]',
    'type'       => 'radio',
    'choices'    => array(
        'value1' => 'Choice 1',
        'value2' => 'Choice 2',
        'value3' => 'Choice 3',
        ),
) );

ডিফল্ট নিয়ন্ত্রণ-ধরন text। এটি একটি পাঠ্য বাক্স নিয়ন্ত্রণ তৈরি করে। আর একটি নিয়ন্ত্রণ-ধরন হ'ল dropdown-pages, যা ওয়ার্ডপ্রেস পৃষ্ঠাগুলির একটি ড্রপডাউন তালিকা তৈরি করে।

কিন্তু এখানেই শেষ নয়. এখানে আরও বেশ কয়েকটি রয়েছে, তবে তারা এতটাই কাস্টম হওয়ায় এগুলি আলাদাভাবে ঘোষণা করা হয়েছে।

এইটি ওওপি ব্যবহার করে:

$wp_customize->add_control(
    new WP_Customize_Color_Control( $wp_customize, 'link_color', array(
        'label'    => __( 'Link Color', 'themename' ),
        'section'  => 'themename_color_scheme',
        'settings' => 'themename_theme_options[link_color]',
    ) )
);

অতিরিক্ত নোট:

  • WP_Customize_Upload_Control- এটি আপনাকে ফাইলগুলির জন্য একটি আপলোড বাক্স দেয়। তবে আপনি সম্ভবত এটি সরাসরি ব্যবহার করবেন না, আপনি অন্য জিনিসগুলির জন্য এটি প্রসারিত করতে চাইবেন ... যেমন: WP_Customize_Image_Control- এটি আপনাকে চিত্র চয়নকারী এবং আপলোডার বাক্স দেয়। এটি আপলোড নিয়ামককে প্রসারিত করে। আপনি এটি কাস্টম ব্যাকগ্রাউন্ড টুকরাটিতে ক্রিয়াতে দেখতে পাচ্ছেন, যেখানে কোনও ব্যবহারকারী ব্যাকগ্রাউন্ড ইমেজ হতে একটি নতুন ফাইল আপলোড করতে পারে।
  • WP_Customize_Header_Image_Control- শিরোনামের টুকরোটির আকার পরিবর্তন করার কারণে এর কিছুটা বিশেষ হ্যান্ডলিং এবং প্রদর্শন দরকার হয়, তাই WP_Customize_Header_Image_Controlপ্রসারিত
  • WP_Customize_Image_Controlযে কার্যকারিতা যুক্ত করতে। আপনি এটি কাস্টম শিরোনামের টুকরোটিতে ক্রিয়াতে দেখতে পাচ্ছেন, যেখানে কোনও ব্যবহারকারী শিরোনাম চিত্র হিসাবে একটি নতুন ফাইল আপলোড করতে পারে।

অটোস ব্লগে আপনি "থিম কাস্টমাইজার" সম্পর্কে আরও জানতে পারেন ।

আপডেট 11/06/2012

পড়ার সম্ভাব্যতা এবং আরও উদাহরণগুলির জন্য লাইভ উদাহরণ, উত্স এবং দকু জন্য উন্মুক্ত রেপো দেখুন ।

আপডেট 01/15/2013

এটি সহজ এবং প্রস্তুত ব্যবহারের জন্য আমরা কাস্টম ক্লাস সহ গিথুবে একটি রেপো তৈরি করেছি । হতে পারে আপনি কেবল এটি ব্যবহার করতে পারেন বা আপনার ধারণাগুলি এবং সমাধানগুলি নিয়ে অগ্রসর হতে পারেন।


4

ঠিক আছে, এখানে এটি কীভাবে করবেন's এক বা একাধিক নতুন ফাইলে আপনার নিয়ন্ত্রণ শ্রেণি (এস) আলাদা করুন।

আপনার কাস্টমাইজ_রেজিস্টারে কোনও ফাংশন বা পদ্ধতি রয়েছে? এই ফাংশন বা পদ্ধতিতে আপনার কাস্টম নিয়ন্ত্রণগুলি যুক্ত করার ঠিক আগে একবার আপনার নতুন ফাইলগুলি প্রয়োজন। তারপরে পিএইচপি ক্লাসগুলির নতুন সংজ্ঞা দেওয়ার বিষয়ে অভিযোগ করবে না।

দ্রষ্টব্য: এটি বাক্সটির বাইরে কাজ করবে না, তবে কৌশলটি দেখায়।

add_action('customize_register', array('myAddControl', 'customize_register') );

class myAddControl{
public function customize_register()
{
    global $wp_customize;


            //This will do the trick
    require_once(dirname(__FILE__).'/class-gctfw-theme-control.php');


    $wp_customize->add_section( 'gctfw_switch_theme' , array(
        'title'      => 'Switch theme',
        'priority'   => 25,
    ) );

    $wp_customize->add_setting( 'gctfw_select_theme' , array(
        'default'     => $wp_customize->theme()->get('Name'),
        'transport'   => 'refresh',
        'capabilities' => 'manage_options'
    ) );

    $myControl = new gctfw_Theme_Control( $wp_customize, 'gctfw_select_theme', array(
        'label'        => __( 'Select theme', 'mytheme' ),
        'section'    => 'gctfw_switch_theme',
        'settings'   => 'gctfw_select_theme',
    ) ) ;
    $wp_customize->add_control( $myControl );
    }
}//class

3

আপনি কখনই আপনার ক্লাস ব্যবহার করছেন না। আপনার শ্রেণীর একটি নতুন উদাহরণটি add_control পদ্ধতিতে পাস করার চেষ্টা করুন:

$control_args = array(
  // your args here
); 

$my_control = new WP_Customize_Palette_Control(
                $wp_customize, 'themename_color_scheme', $control_args);

$wp_customize->add_control($my_control);

এছাড়াও, আমি মনে করি না যে ডব্লিউপি জানেন যে আপনার সেটিংয়ের বিকল্প নামটি একটি অ্যারের অংশ। themename_theme_options_color_schemeপরিবর্তে এটি ভাল হতে পারে themename_theme_options[color_scheme]

আপনার প্রসারিত শ্রেণিটি চিত্র আপলোড নিয়ন্ত্রণের অন্তর্ভুক্ত। আপনি যদি রঙ চয়নকারী তৈরি করে থাকেন তবে আপনার সম্ভবত ডাব্লুপি_ কাস্টমাইজ_কন্ট্রোল ক্লাস বাড়ানো উচিত ।



1

কেবল সম্পূর্ণতার জন্য: কীভাবে থিম কাস্টমাইজারে একটি নম্বর ক্ষেত্র যুক্ত করা যায় তার একটি উদাহরণ।

class Customize_Number_Control extends WP_Customize_Control
{
    public $type = 'number';

    public function render_content()
    {
        ?>
        <label>
            <span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>
            <input type="number" size="2" step="1" min="0" value="<?php echo esc_attr(  $this->value() ); ?>" />
        </label>
        <?php
    }
}

আমি এটি প্রয়োজনীয় বলে মনে করি না, আপনি কেবল ডিফল্ট নিয়ন্ত্রণ numberহিসাবে পাস করতে পারেন এবং পাস করার typeজন্য ব্যবহার input_attrsকরতে পারেন stepইত্যাদি
আইয়ান ডান

@ ইয়ানডুন আপনি কি অতিরিক্ত উত্তর হিসাবে একটি উদাহরণ যুক্ত করতে চান? ধন্যবাদ!
কায়সার

0

আমার মনে হয় ডাব্লুপি_ কাস্টমাইজ করার আগে আপনাকে ব্যাকস্ল্যাশ যুক্ত করতে হবে। সুতরাং, এটি হবে

class WP_Customize_Palette_Control extends \WP_Customize_Image_Control

, কারণ ব্যাকস্ল্যাশ ধরে নিয়েছিল যে ডাব্লুপি_ কাস্টমাইজ_ইমেজ_কন্ট্রোল একই নামস্থান থেকে নয়

যদি এটি সাহায্য করে তবে আমাকে জানান

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.