Fonksiyon şu şekilde;
function laura_theme_customizer( $wp_customize ) {
class Laura_Image_Radio_Button_Custom_Control extends Laura_Custom_Control {
public $type = 'image_radio_button';
public function enqueue() {
wp_enqueue_style( 'laura-custom-controls-css', $this->get_laura_resource_url() . 'inc/assets/css/customizer.css', array(), '1.0', 'all' );
}
public function render_content() {
?>
<div class="image_radio_button_control">
<?php if( !empty( $this->label ) ) { ?>
<span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>
<?php } ?>
<?php if( !empty( $this->description ) ) { ?>
<span class="customize-control-description"><?php echo esc_html( $this->description ); ?></span>
<?php } ?>
<?php foreach ( $this->choices as $key => $value ) { ?>
<label class="radio-button-label">
<input type="radio" name="<?php echo esc_attr( $this->id ); ?>" value="<?php echo esc_attr( $key ); ?>" <?php $this->link(); ?> <?php checked( esc_attr( $key ), $this->value() ); ?>/>
<img src="<?php echo esc_attr( $value['image'] ); ?>" alt="<?php echo esc_attr( $value['name'] ); ?>" title="<?php echo esc_attr( $value['name'] ); ?>" />
</label>
<?php } ?>
</div>
<?php
}
}
}
add_action('customize_register', 'laura_theme_customizer');Ayarları şu şekilde;function laura_home_page_theme_customizer( $wp_customize ) {
$wp_customize->add_setting( 'number_home_page_columns',
array(
'transport' => 'refresh',
'sanitize_callback' => 'laura_radio_sanitization'
)
);
$wp_customize->add_control( new Laura_Image_Radio_Button_Custom_Control( $wp_customize, 'number_home_page_columns',
array(
'label' => __( 'Number of Home Page Columns', 'laura' ),
'description' => esc_html__( 'The home page view changes according to the number of columns.', 'laura' ),
'section' => 'laura_home_style',
'choices' => array(
'one-column' => array(
'image' => trailingslashit( get_template_directory_uri() ) . 'inc/assets/img/one-column.png',
'name' => __( '1 Column', 'laura' )
),
'two-columns' => array(
'image' => trailingslashit( get_template_directory_uri() ) . 'inc/assets/img/two-columns.png',
'name' => __( '2 Columns', 'laura' )
),
'three-columns' => array(
'image' => trailingslashit( get_template_directory_uri() ) . 'inc/assets/img/three-columns.png',
'name' => __( '3 Columns', 'laura' )
),
'four-columns' => array(
'image' => trailingslashit( get_template_directory_uri() ) . 'inc/assets/img/four-columns.png',
'name' => __( '4 Columns', 'laura' )
)
)
)
));
add_action('customize_register', 'laura_home_page_theme_customizer');Yapmak istediğim eklediğim yere seçeneklere göre önceden girdiğim metin ekleyecek(class yazacak).Örnek:
1. görsel seçilirse: <article class="col-sm-12">
2. görsel seçilirse: <article class="col-sm-6">
3. görsel seçilirse: <article class="col-sm-4">
4. görsel seçilirse: <article class="col-sm-3">
Kaynak: https://github.com/maddisondesigns/customizer-custom-controls#user-content-image-radio-button