Ari Stathopoulos

Web Developer, Accessibility & Sustainability evangelist, Human.

Hijacking the wp.customize set & get methods for settings

11 May 2019

While refactoring the Kirki framework for v4.0, I needed to hijack the get and set functions from the JS API in order to apply some custom logic, so this is just a quick post to show how you can do that.
Create and enqueue a JS file in the customizer, and add this code in there:

( function( api ) {

	/**
	 * Set the value and trigger all bound callbacks.
	 *
	 * @since 1.0
	 * @param {object} to New value.
	 */
	api.Value.prototype.set = function( to ) {
		var from = this._value,
		parentSetting,
		newVal;

		to = this._setter.apply( this, arguments );
		to = this.validate( to );

		// Bail if the sanitized value is null or unchanged.
		if ( null === to || _.isEqual( from, to ) ) {
			return this;
		}

		this._value = to;
		this._dirty = true;

		this.callbacks.fireWith( this, [ to, from ] );

		return this;
	};

	/**
	 * Get the value.
	 *
	 * @return {mixed}
	 */
	api.Value.prototype.get = function() {
		return this._value;
	};
} ( wp.customize ) );

The code above is a verbatim copy from the core WP files, so you can just tweak them to your liking, add hooks using the new wp.hooks package etc. For an example of what Kirki does, you can check out the code here.


Comments

    No comments found for this article. Comments posted before 2019-09-15 are no longer available due to a system migration since I no longer use Disqus for comments.

    Join the discussion for this article on this ticket. Comments appear on this page instantly.