pops_customizer.php

<?php

//customize appear options
function pops_customize_register( $wp_customize ) {

	$theme_name = get_current_theme();

	$wp_customize->add_section('pops_button_colors', array(
		'title' 	=> __('Popstrap Button Colors', $theme_name),
		'priority'	=> 30
		)
	);

	$pops_color_defaults 	= array(
		'primary'			=> array(
			'color'			=> '#007bff',
			'setting'		=> 'pops_primary_button_color',
			'control'		=> 'pops_primary_button_color_control',
			'label'			=> __('Primary Button Color', $theme_name),
			'selector'		=> '.btn-primary'
		),
		'primary_hover'			=> array(
			'color'			=> '#007bff',
			'setting'		=> 'pops_primary_button_hover_color',
			'control'		=> 'pops_primary_button_hover_color_control',
			'label'			=> __('Primary Button Hover Color', $theme_name),
			'selector'		=> '.btn-primary:hover'
		),
		'secondary'			=> array(
			'color'			=> '#868e96',
			'setting'		=> 'pops_secondary_button_color',
			'control'		=> 'pops_secondary_button_color_control',
			'label'			=> __('Secondary Button Color', $theme_name),
			'selector'		=> '.btn-secondary'
		),
		'secondary_hover'			=> array(
			'color'			=> '#727b84',
			'setting'		=> 'pops_secondary_button_hover_color',
			'control'		=> 'pops_secondary_button_hover_color_control',
			'label'			=> __('Secondary Button Hover Color', $theme_name),
			'selector'		=> '.btn-secondary:hover'
		),
	);

	foreach ($pops_color_defaults as $key => $value) {
		// var_dump($value['setting']);
		// var_dump($key);

		$wp_customize->add_setting($value['setting'], array(
			'default' 	=> $value['color'],
			'transport'	=> 'refresh'
			)
		);


		$wp_customize->add_control( new WP_Customize_Color_Control($wp_customize, $value['control'], array(
			'label'		=> $value['label'],
			'section'	=> 'pops_button_colors',
			'settings'	=> $value['setting']
		)));

		$pops_css_array = array(['selector' => $value['selector']], ['setting' => $value['setting']]);

		pops_customize_css($pops_css_array);
	}


}

add_action('customize_register', 'pops_customize_register');


//output customized css
function pops_customize_css($pops_css_array){ 

	// print_r($pops_css_array);

	$style = array();

	if (is_array($pops_css_array)){

		foreach ($pops_css_array as $key => $value) {
			$selector = $value['selector'];


			$setting = $value['setting'];

			if ($selector)
			{
				$style['selector'] = $selector;
			}

			

			if ($setting)
			{
				$background_color = 'background-color:' . get_theme_mod($setting) . ';';
				$border_color = 'border-color:' .get_theme_mod($setting) . ';';

				$css .= '{' . $background_color . $border_color . '}';
				$style['css'] = $css;
			}

			
			print_r($style);
		}
	}
	

	// print_r($style);


	?>

	

	<style type="text/css">
		.btn-primary {
			background-color: <?php echo get_theme_mod('pops_primary_button_color') ?>;
			border-color: <?php echo get_theme_mod('pops_primary_button_color') ?>;
		}

		.btn-primary:hover {
			background-color: <?php echo get_theme_mod('pops_primary_button_hover_color') ?>;
			border-color: <?php echo get_theme_mod('pops_primary_button_hover_color') ?>;
		}
	</style>

<?php }

add_action('wp_head', 'pops_customize_css');