Add a new Tab in the listing detail page

One of the most frequent questions we get, about customizing GeoDirectory, is how to add a new tab for custom content (like data from another plugin) in the listings detail page.

Adding a Tab from the backend is possible for GD custom fields and fieldsets, but if you want to show anything more advanced, please use the example coe below.

This is very easy and you can proceed like this:

To add a new tab labelled “New Tab” add the following code inside your active theme’s functions.php file.

add_filter('geodir_detail_page_tab_list_extend', 'geodir_detail_page_tab_list_extend') ;  
function geodir_detail_page_tab_list_extend($tab_array) {  	
$tab_array['my_new_tab'] = array( 
'heading_text' =>  __('New Tab',GEODIRECTORY_TEXTDOMAIN),
'is_active_tab' => false,
'is_display' =>  apply_filters('geodir_detail_page_tab_is_display', true,'my_new_tab'),
'tab_content' => ''); 	
return $tab_array ; } 

To show your custom content inside the tab, please add the following code inside your active theme’s functions.php file.

add_action('geodir_after_tab_content' ,'geodir_my_new_tab_content');
function geodir_my_new_tab_content($tab_index)
{
if($tab_index =='my_new_tab')
{echo "Hello world!!";}
}

In this case we are simply showing the “Hello World!!” text. Instead of that you can add any code you want, like a shortcode, custom fields or any function to output other plugins’ content.

This will add the “New Tab” to all other custom post types you may have (Should you have the Events or the Custom Post Type addons installed).

If you wish to add a New Tab only to one custom post type, let’s say Events, you would have to slightly modify the 1st code snippet like in the example below.

add_filter('geodir_detail_page_tab_list_extend', 'geodir_detail_page_tab_list_extend');
 
function geodir_detail_page_tab_list_extend($tab_array) {   
if ( 'gd_event' == get_post_type() )
$tab_array['my_new_tab'] = array( 
'heading_text' =>  __('New Tab',GEODIRECTORY_TEXTDOMAIN),
'is_active_tab' => false,
'is_display' =>  apply_filters('geodir_detail_page_tab_is_display', true,'my_new_tab'),
'tab_content' => '');    
return $tab_array ; }

Developers you may be interested in reading more about this filter here :

geodir_detail_page_tab_list_extend

If you want to explore the function that builds and returns the list of available tabs as an array,.you can look here:

geodir_detail_page_tabs_array

We will go through this function in a future post about altering tabs order.

Did you use this function to create a more complex and awesome customization on your Directory. If you care about sharing it, let us know in the content and we will extend this post with your suggestions!