Hook into the WordPress Theme Customizer save action

Question

I am facing the following issue :

I used to keep all the styling in a theme options page. When the user clicked the save button, i had a backend script that generated a css file with the changes so that they will not be output inline in each page. This has a lot of benefits, amongst them caching.

I have switched to the Theme Customizer, and everything is fine except i can't find a way to hook into the the "save" button. I would like to trigger a function that updates the content of the css file when that button is clicked in the backend.

Is this even possible ?

Thanks !

Answer 1

Since WordPress 3.6.0 you can now call customize_save_after.

<?php
function emailAdmin(){
    mail('your@email', 'Woza!', 'You won\'t believe this but someone has updated the theme customizations!!');
}
add_action( 'customize_save_after', 'emailAdmin' );
?>

More info: http://developer.wordpress.org/reference/hooks/customize_save_after/

Answer 2

I'm facing the same situation. The customize_save works BEFORE the options are saved, so that's out. I've emailed Otto (ottodestruct.com) about it.

The solution I have right now is as follows:

add_action('customize_save', 'regenCSS', 100);
function regenCSS( $wp_customize ) {
    checkCSSRegen(); // Checks if I need to regen and does so
    set_theme_mod('regen-css', time()+3); // Waits 3 seconds until everything is saved
}
function checkCSSRegen() {
    if (get_theme_mod('regen-css') != "" && get_theme_mod('regen-css') < time()) {
        makecss();
        remove_theme_mod('regen-css');
    }
}

I also add an extra checkCSSRegen(); to my customize_controls_init function.

Again, this is a little bit of a hack. Unfortunately, it's the best I can find to do at the time.

Another option would be to use a ajax response that just pings a php file. That feels even more of a hack than this.

Another quick hack would be to do a javascript action that when the save button is clicked, it sets a timer to delay a call to a PHP file that runs the compile. That is VERY hacky to me.

The only fallback of the above, is unless the customizer is reloaded or another value saved, you may not get all the values you want.

Anyone else have a better idea?

** Update ** Just added the following request to the Wordpress team. Hopefully we'll get it squeezed in there.

http://wordpress.org/ideas/topic/do-customize_save-action-hook-after-the-settings-are-saved?replies=3#post-24853

* Update 2 * Looks like it will be in the 3.6 release as customize_save_after. Guess a few tweets and example code can make stuff happen even with the Wordpress team. ;)

Answer 3

As describe by @Dovy already you can hook customize_save_after to do this now:

do_action('customize_save_after', 'savesettings', 99);

When savesettings save settings to a file it will be bad practice to do this with native php file functions (like file_put_contents()) as described here: http://ottopress.com/2011/tutorial-using-the-wp_filesystem/ by @otto.

Solution for file saving will be to use wp_filesystem. To use wp_filesystem you will need the file credentials (ftp) of the user.

customize_save_after will be called in a AJAX request and the result won't be visible. Cause of the AJAX handle you can't ask the user for the file credentials which requires a form submit.

Solution can be found by saving the file credentials to wp-config.php and add them ( temporary ) to the database. Doing this savesettings can read the credentials from the database and use them to save the file by using credentials. (this solution is described in more detail here: https://wordpress.stackexchange.com/a/126631/31759)