How to modify default controls in WordPress theme customizer

I’m trying modify the default control in the wordpress theme customizer specifically the action for the close button. By default clicking it will make you go back to the themes page, but I want it to go to another page.

Here’s what I tried so far:

Read More
  1. add inline script to wp_head
  2. add script to customize_register hook
  3. enqueued script via admin_enqueue_scripts hook

Here’s the script that I’m trying to add:

jQuery(function(){
  jQuery('#customize-header-actions a').attr('href', 'index.php');
});

So basically I’m trying to redirect the user to the admin dashboard upon clicking the close button in the theme customizer.

But no luck so far, for the first and second method that I mentioned above it doesn’t recognize jquery. So I tried plain javascript:

window.onload = function() {
  var customizer_header = document.getElementById('customize-header-actions');
  customizer_header.children[2].setAttribute('href', 'index.php');
}

But still it doesn’t work. The customization bar seems to be existing somewhere else like inside an iframe but when I checked in chrome dev tools only the preview of the wordpress index page is in an iframe.

As for the third method its basically the same problem. Its returning null for the selector as if the element didn’t exist.

Any ideas?

Related posts

Leave a Reply