Universally Change Iris Palette

  • Resolved natepelzel

    (@natepelzel)


    10 years, 6 months ago

    Hey guys,

    I use wordpress on most of my client’s site, and I recently had the idea to alter the palette below the Iris color picker to match my client’s color scheme. Make it quicker for me and easier for them.

    I did some digging and found this site. It basically just said to paste this in my functions.php:

    // customise palette colours
function firefly_customize_controls_print_footer_scripts() {
?>
<script>
jQuery(document).ready(function($){
$.wp.wpColorPicker.prototype.options = {
palettes: ['#ffffff', '#000000','#ff0000']
};
});
</script>
<?php
}
add_action('customize_controls_print_footer_scripts', 'firefly_customize_controls_print_footer_scripts');

    Makes sense in theory, but I’m having the hardest time getting it to work. The script is definitely running. In my troubleshooting I put an alert in the script and it most definitely fired.

    Any idea what I’m missing? I checked some color pickers on a few different pages, including one for my theme’s built in settings and some in the theme customization page.

    I’m pretty strong with php & css, and have been dabbling in javascript/jQuery for a while now, so I’m comfortable but not fluent with it.

    Any ideas you all have would be greatly appreciated.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Thread Starter natepelzel

    (@natepelzel)

    If anybody’s curious, I figured it out. Just tweaked the code a bit. Instead of putting it all in functions.php, I split it out into a js file and queued it up correctly with functions.

    So I made a js file in my child theme that contained:

    jQuery(document).ready(function($){
	$.wp.wpColorPicker.prototype.options = {
			hide: true,
			palettes: ['#36362C', '#5D917D','#A8AD80','#E6D4A7','#A47FD3']
	};
});

    and then I queued it up like so in functions.php:

    add_action('admin_enqueue_scripts', 'uphill_scripts');

function uphill_scripts() {
	wp_enqueue_script( 'uphill-scripts', get_stylesheet_directory_uri() . '/includes/js/custom.js');
}

    Hope this helps someone in the future.

    Thread Starter natepelzel

    (@natepelzel)

    Sorry, quick edit, I found that having the script queued on pages that didn’t use the color picker caused errors, so I changed the functions.php to this:

    add_action('admin_enqueue_scripts', 'uphill_scripts');

function uphill_scripts() {
	if(wp_script_is('wp-color-picker', 'enqueued')){
		wp_enqueue_script( 'uphill-scripts', get_stylesheet_directory_uri() . '/includes/js/custom.js');
	}
}

    [quote]Hope this helps someone in the future.[/quote]
    @natepelzel, I was looking for this, thank you! ??

    I also would like to point to the Git page of IRIS (for more info and options);
    https://automattic.github.io/Iris/

    Excellent soution.
    Thank you natepelzel!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Universally Change Iris Palette’ is closed to new replies.