Support

Account

Home Forums Feature Requests Ability to Link to Specific Tabs on Options Page

Solving

Ability to Link to Specific Tabs on Options Page

  • It would be great to be able to link to a specific Tab when being used on the Options pages and have that tab be the active tab on arrival.

    For example: We place links in our themes that are conditional to certain roles and/or capabilities. An Edit button appears on the front-end for our editors that links to the /wp-admin/admin.php?page=my_custom_options_page – allowing them to get to the right area to edit the content easier. We should be able to include a #tab2 to the end of the link to open that specific tag.

    Hope this makes sense.

  • Agreed. This would be a great feature, and really improve the UX of options (or any edit page).

  • I am doing this on some of my sites with the following code. YMMV performance wise having this inline, in an enqueued file, etc depending on the specific implementation:

    
    add_action( "admin_footer", "acf_link_to_tab" );
    function acf_link_to_tab(){ ?>
    	<script>
    	(function($){
    		acf.add_action('ready', function(){
    			if (location.hash.length>1){	
    				var hash = location.hash.substring(1);
    				$('.acf-tab-wrap .acf-tab-button').each(function(i, button){ 
    					if (hash==$(button).text().toLowerCase().replace(' ', '-')){
    						$(button).trigger('click');
    						return false;
    					}
    				});
    			}
    		});
    	})(jQuery);
    	</script><?php	
    }
  • Nice approach, jsilver. I’d add a decodeUriComponent() around the hash to make it support all languages, some non English chars would be automatically encoded by the browser.
    so, something like this:

    
    //add an ACF tab shortcut link
    add_action( "admin_footer", "acf_link_to_tab" );
    function acf_link_to_tab(){ ?>
    	<script>
    	(function($){
    		acf.add_action('ready', function(){
    			if (location.hash.length>1){	
    				
    				let hash        = location.hash.substring(1);
    				let decodedHash = decodeURIComponent(hash);
    				
    				$('.acf-tab-wrap .acf-tab-button').each(function(i, button){ 
    					
    					let target = $(button).text().toLowerCase().replace(' ', '-');
    					
    					if (decodedHash == target){
    						$(button).trigger('click');
    						return false;
    					}
    					
    				});
    			}
    		});
    	})(jQuery);
    	</script><?php	
    }

    If you really want, you can add a try-catch around the decode call.

Viewing 4 posts - 1 through 4 (of 4 total)

The topic ‘Ability to Link to Specific Tabs on Options Page’ is closed to new replies.