I’ve documented how to do this in my post Navigating to a URL in the Customizer Preview when a Section is Expanded, though naturally you’d just use panels instead of sections.
This should get you what you want:
(function ( api ) {
api.panel( 'my_panel_id', function( panel ) {
panel.expanded.bind( function( isExpanded ) {
if ( isExpanded ) {
api.previewer.previewUrl.set( panelPreviewUrl );
}
} );
} );
} ( wp.customize ) );
You’d replace the panelPreviewUrl
variable with whatever you want to navigate the preview to. And then you’d replace 'my_panel_id'
with whatever the ID is for your panel.
Related Posts:
- Customizer JS API
- Is it Possible to Extend WP Customize JS Methods?
- wp.customize.bind ready event not fired
- Detecting WordPress Customizer Panel
- WP Customizer set a value via javascript (to create presets)
- wp_customize_support_script – do I need it?
- Customizer – instantiating settings and controls via javascript
- Customizer JS API: Defining control settings
- Customizer JS API: Adding Setting Dynamically Not Working
- Customizer: When to use customize_preview_init VS customize_controls_enqueue_scripts
- How to overwrite JS variable with wp_localize _script?
- Theme Customiser not live previewing changes on pseudo elements
- the Customizer – proper way to instantiate an image upload control via javascript
- Preserve Javascript Through Customizer Preview Navigation
- How to check if customize previewer is refreshing?
- JavaScript in WordPress Customizer
- Customizer JS API: Adding a “dropdown-pages” control
- Accessing customizer values in javascript
- Running JS after theme customizer finished initialization
- customize_preview_init: listening for any changes from Customizer preview area
- How to conditionally show/hide controls & sections in WordPress customizer?
- Multiple Conditional Controllers
- WordPress customizer get control
- Using webpack to add customizer live preview functionality – wp.customize is not a function
- Adding and removing hidden buttons from WordPress Customizer Tinymce widget editor using javascript API
- Get a default value of the Customizer setting using wp.customize API (JS)
- How to add customizer control via javascript ( wp.customizer.control.add )
- Customizer JS API: Defining active_callback for a section
- Adding Code into Theme Customizer Header
- Custom JS text area in customizer is being formatted wrong in document
- customize-controls.js – extend api.previewer
- Multiple jQuery inputs or binds in Customizer Control Javascripts
- Show sections based on a control in WordPress Customizer using JS API
- How do I add a class to Customizer preview based on class of Customizer control? (Customizer Javascript API)
- LayersWP Customizer White Blank Screen
- Get a default customizeAction text for a section using Customizer JS API
- Receive “menu-toogle” event from section menu in customizer
- How do I get the current date in JavaScript?
- How to do a redirect to another route with react-router?
- Jest spy on functionality
- Use a JSON array with objects with javascript
- Toggle show/hide on click with jQuery
- JavaScript TypeError: Cannot read property ‘style’ of null
- How to obtain username from Promise
? - How do you check if a variable is an array in JavaScript?
- Understanding React-Redux and mapStateToProps()
- What is the meaning of == $0 that is shown in inspect element of google chrome for the selected element [duplicate]
- Unable to verify leaf signature
- When and why to ‘return false’ in JavaScript?
- In angularjs we are having ng-disabled directive, why ng-enabled directive is not provided by the framework as we are having ng-show and ng-hide
- Send POST data using XMLHttpRequest
- querySelector vs. getElementById
- Google weather widget on my website
- How to generate a simple popup using jQuery
- Understanding how data-dismiss attribute works in Bootstrap
- Add table row in jQuery
- Node.js document is not defined
- Create table with jQuery – append
- When is JavaScript synchronous?
- How to reset a form using jQuery with .reset() method
- Uncaught ReferenceError: Firebase is not defined
- node-request – Getting error “SSL23_GET_SERVER_HELLO:unknown protocol”
- Count the number of occurrences of a character in a string in Javascript
- Javascript removeEventListener not working
- Load image with jQuery and append it to the DOM
- RGB to hex and hex to RGB
- No visible cause for “Unexpected token ILLEGAL”
- Access to Image from origin ‘null’ has been blocked by CORS policy
- Onclick on bootstrap button
- TypeError: res.json is not a function
- How to do case insensitive string comparison?
- Understanding the ngRepeat ‘track by’ expression
- How can I test if a letter in a string is uppercase or lowercase using JavaScript?
- How to create a HTML Cancel button that redirects to a URL
- JavaScript post request like a form submit
- Jest encountered an unexpected token
- How to get the first element of an array?
- bootstrap buttons onclick events
- Cannot read property ‘forEach’ of undefined
- JavaScript: function returning an object
- What is the non-jQuery equivalent of ‘$(document).ready()’?
- What are the benefits of using wp_enqueue_script?
- How to prevent text modified using gettext filter being stomped (presumably) by updateText() js function within a CPT’s edit screen
- Load multiple Javascript scripts
- WP script versioning breaks cross-site caching?
- Is there a client side API for handling transients or options?
- How should I add JavaScript to a child theme?
- Create user from outside WordPress through api?
- Load plugin JS in footer
- Media library not working with wp_editor() on the front end
- Is there a media_upload_tabs-similar filter to add tabs to the simple/featured image picker?
- Tinymce.js editor in Chrome?
- Gutenberg consume wp-json data and reflect in frontend the content
- How to add “on change” to a text input in contact form7?
- How to use WP switchEditors.switchto(this) JS function in your own script?
- Removing admin javascript
- Landing function through URL
- Escaping quotes while enqueuing scripts
- How do I cycle a JS function in WordPress? [closed]
- How can I look at/edit what’s being sent to post.php when I hit the publish/update button?