{"id":377,"date":"2018-10-11T13:23:07","date_gmt":"2018-10-11T13:23:07","guid":{"rendered":"https:\/\/wpgeodirectory.com\/docs-v2\/?post_type=docs&#038;p=377"},"modified":"2019-07-12T07:21:06","modified_gmt":"2019-07-12T07:21:06","slug":"tabs","status":"publish","type":"docs","link":"https:\/\/wpgeodirectory.com\/docs-v2\/places\/tabs\/","title":{"rendered":"Places Settings &#8211; Tabs"},"content":{"rendered":"<p><span class='bookmark-index'><br \/>\n<a href=\"#intro\">Introduction<\/a><br \/>\n<a href=\"#settings\">Settings<\/a><br \/>\n<a href=\"#support\">Support<\/a><br \/>\n<a href=\"#faq\">FAQ &#8211; Frequently Asked Questions<\/a><br \/>\n<\/span><\/p>\n<div class=\"embed-responsive embed-responsive-16by9\"><iframe title=\"GeoDirectory V2 - Design customization and the tabs builder\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/XSD1rpp8OBY?feature=oembed&amp;wmode=opaque\" frameborder=\"0\" allow=\"accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture\" allowfullscreen><\/iframe><\/div>\n<h3><a name=\"intro\" href=\"#intro\">Introduction<\/a><\/h3>\n<p>Find the Places Settings Tabs (tab) in the backend.<\/p>\n<p><a href=\"http:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/Screenshot-2018-10-11-at-1.52.30-PM.png\"><img src=\"http:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/Screenshot-2018-10-11-at-1.52.30-PM.png\" alt=\"\" width=\"139\" height=\"166\" class=\"alignnone size-full wp-image-369\" \/><\/a><\/p>\n<h3><a name=\"settings\" href=\"#settings\">Default Settings<\/a><\/h3>\n<p><a href=\"http:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/Place-Tabs.png\"><img src=\"http:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/Place-Tabs.png\" alt=\"\" width=\"600\" class=\"alignnone size-full wp-image-378\" srcset=\"https:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/Place-Tabs.png 727w, https:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/Place-Tabs-300x297.png 300w\" sizes=\"(max-width: 727px) 100vw, 727px\" \/><\/a><\/p>\n<p>When you adjust your tabs, you will:<\/p>\n<p>Click on the field on the left<br \/>\nThe field will then appear at the bottom on the right in the tabs<br \/>\nIf the field is left justified, it will show in it&#8217;s own tab<br \/>\nIf the field is indented under another tab, then it will show with the tab of the field under which it is indented<\/p>\n<p><a href=\"http:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/Screenshot-2018-10-11-at-3.28.04-PM.png\"><img src=\"http:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/Screenshot-2018-10-11-at-3.28.04-PM.png\" alt=\"\" width=\"450\" class=\"alignnone size-full wp-image-380\" srcset=\"https:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/Screenshot-2018-10-11-at-3.28.04-PM.png 407w, https:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/Screenshot-2018-10-11-at-3.28.04-PM-300x224.png 300w\" sizes=\"(max-width: 407px) 100vw, 407px\" \/><\/a><\/p>\n<h3><a href=\"#shortcodes\" name=\"shortcodes\">Shortcodes in Tabs<\/a><\/h3>\n<h4>Tabs Display Settings<\/h4>\n<p>When you add a field to display in the tabs, GeoDirectory is working in the background to display that field with the appropriate Design Element.<\/p>\n<p>For example, if you add the address, it will be displayed with GD Post Meta. A text field will also be displayed with GD Post Meta. A map will be displayed with GD Map.<\/p>\n<p>When fields are displayed in the tabs, the default setting is used for the Design Element.<\/p>\n<p>For example, for a text or URL field, they will be displayed with GD Post Meta and will include the display of the Icon+Label+Value.<\/p>\n<h4>Override default Display Settings with the use of Shortcodes in Tabs<\/h4>\n<p>You don&#8217;t have to settle for the default display. You can use shortcodes in the tabs by adding the &#8220;Shortcode&#8221; element to the tab. <\/p>\n<p>You can add as many shortcode tabs or subtabs as you want, too, just name each one differently.<\/p>\n<h4>When to use<\/h4>\n<p>When you want to use GD Design Element options to change the way a field data is shown in the tabs, use a shortcode. For example:<\/p>\n<p>Photo gallery tab &#8211; change the image size used or other GD Post Images attributes<br \/>\nWebsite URL or text field &#8211; adjust the icon or label settings<br \/>\nMap &#8211; change the option to use listing zoom level<\/p>\n<h4>Example 1 &#8211; Location Tab<\/h4>\n<p>In our example, we are going to make a new tab called &#8220;Location&#8221;. Inside the tab we want to display the post address all on one line, and then show the map. Normally the address is shown on multiple lines and uses the label. We are going to use a custom shortcode because we want to show it all on one line and without the label, only the icon.<\/p>\n<p>For the map, normally it uses the default settings for a post type map, which will make use of the zoom level set by the listing owner when they were moving the map pin. We are going to make a custom shortcode that uses the same zoom level, 14, for each post map because that makes more sense.<\/p>\n<p>So, here are the steps.<\/p>\n<p>Open up the Tabs UI for the CPT Places at Places Settings &#8211; Tabs &#8211; Shortcode (click)<br \/>\nNow that there is a new shortcode tab on the right side, change the name of it to Location and save<br \/>\nClick the shortcode builder icon and setup the GD Post Address shortcode I want. Copy to the clipboard.<br \/>\nClick the shortcode builder icon and setup the GD Map shortcode I want. Click to insert.<br \/>\nPaste the GD Post Address shortcode first.<br \/>\nSave<\/p>\n<p>These are the shortcodes used.<\/p>\n<pre><code>\r\n[gd_post_address show=\"icon-value\" address_template=\"%%street%%, %%city%%, %%region%%, %%country%%\"]\r\n[gd_map width=\"100%\" height=\"425px\" maptype=\"ROADMAP\" zoom=\"14\" map_type=\"post\"]\r\n<\/code><\/pre>\n<p><a href=\"http:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/Screenshot-2019-04-18-at-1.21.44-PM.png\"><img src=\"http:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/Screenshot-2019-04-18-at-1.21.44-PM.png\" alt=\"\" width=\"450\" class=\"alignnone size-full wp-image-726\" srcset=\"https:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/Screenshot-2019-04-18-at-1.21.44-PM.png 596w, https:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/Screenshot-2019-04-18-at-1.21.44-PM-300x185.png 300w\" sizes=\"(max-width: 596px) 100vw, 596px\" \/><\/a><\/p>\n<h4><a href=\"#related-listings\" name=\"related-listings\">Related Listings<\/a><\/h4>\n<p>Add a &#8220;Related Listings&#8221; tab that shows listings with the same default category.<\/p>\n<p>Use GD Listings to create &#8220;Related Listings&#8221; by filtering the GD Listings with the data of the current listing being viewed. You have a choice of the same tags, categories, or just the default category.<\/p>\n<p><a href=\"http:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/related-listings.jpg\"><img src=\"http:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/related-listings.jpg\" alt=\"\" width=\"882\" height=\"80\" class=\"alignnone size-full wp-image-839\" srcset=\"https:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/related-listings.jpg 882w, https:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/related-listings-300x27.jpg 300w, https:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/related-listings-768x70.jpg 768w\" sizes=\"(max-width: 882px) 100vw, 882px\" \/><\/a><\/p>\n<ul>\n<li>Visit the Places CPT -> Settings -> Tabs<\/li>\n<li>Add a shortcode field by clicking on it on the left<\/li>\n<li>Rename the shortcode to &#8220;Similar Nearby&#8221;<\/li>\n<li>Use the shortcode builder to create a &#8220;Related Listings&#8221; feature with GD Listings or add the shortcode below.<\/li>\n<\/ul>\n<pre><code class='php'>\r\n[gd_listings title=&quot;Related Listings&quot; post_type=&quot;gd_place&quot; related_to=&quot;default_category&quot; sort_by=&quot;distance_asc&quot; title_tag=&quot;h3&quot; layout=&quot;5&quot; post_limit=&quot;5&quot;]\r\n<\/code><\/pre>\n<h3><a name=\"support\" href=\"#support\">Get Support<\/a><\/h3>\n<p>Get support on our forum, fnd out more here: <a href=\"https:\/\/wpgeodirectory.com\/docs-v2\/v2\/support\/\" rel=\"noopener\" target=\"_blank\">https:\/\/wpgeodirectory.com\/docs-v2\/v2\/support\/<\/a><\/p>\n<h3><a name=\"faq\" href=\"#faq\">FAQ &#8211; Frequently Asked Questions<\/a><\/h3>\n<blockquote><p>How do I show the listing video?<\/p><\/blockquote>\n<p>Click on the video field on the left so that it appears on the right. By default it will display in it&#8217;s own tab. Drag and drop it &#8220;under&#8221; another tab to show it within a different tab. For example, with this setting the video will display at the end of the profile tab.<\/p>\n<p><a href=\"http:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/Screenshot-2018-10-11-at-3.28.04-PM.png\"><img src=\"http:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/Screenshot-2018-10-11-at-3.28.04-PM.png\" alt=\"\" width=\"407\" height=\"304\" class=\"alignnone size-full wp-image-380\" srcset=\"https:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/Screenshot-2018-10-11-at-3.28.04-PM.png 407w, https:\/\/wpgeodirectory.com\/docs-v2\/wp-content\/uploads\/sites\/23\/2018\/10\/Screenshot-2018-10-11-at-3.28.04-PM-300x224.png 300w\" sizes=\"(max-width: 407px) 100vw, 407px\" \/><\/a><\/p>\n<h3>Customize<\/h3>\n<h4>Hide a tab for a specific category<\/h4>\n<p>The below example would remove the tab \u201cmore_details\u201d for all posts that are not in the cat with ID = 100.<\/p>\n<p>Its best to use the tab key rather than the name (the tab key is what appears after the # when u click the tab).<\/p>\n<pre><code class='php'>\r\nadd_filter('geodir_tab_settings','_my_tabs_edit',10,2);\r\nfunction _my_tabs_edit($tabs,$post_type){\r\n  global $gd_post;\r\n  \r\n  if(!empty($tabs) &amp;&amp; !empty($gd_post-&gt;post_category)){\r\n\t$cats = array_filter(explode(&quot;,&quot;,$gd_post-&gt;post_category));\r\n\t$cat_id = 100; \/\/ set id here\r\n\t$remove_tab_key = &quot;more_details&quot;; \/\/ set tab key here\r\n\tif( !in_array($cat_id,$cats) ){\r\n\t  foreach($tabs as $key =&gt; $tab){\r\n\t  \tif($tab-&gt;tab_key==$remove_tab_key){\r\n\t\t unset($tabs[$key]);\/\/ remove the tab\r\n\t\t}\r\n\t  }\r\n\t}\r\n\t\r\n  }\r\n\r\n  return $tabs;\r\n}\r\n<\/code><\/pre>\n","protected":false},"featured_media":0,"parent":367,"menu_order":3,"comment_status":"closed","ping_status":"closed","template":"","doc_tag":[],"amp_validity":null,"amp_enabled":true,"_links":{"self":[{"href":"https:\/\/wpgeodirectory.com\/docs-v2\/wp-json\/wp\/v2\/docs\/377"}],"collection":[{"href":"https:\/\/wpgeodirectory.com\/docs-v2\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/wpgeodirectory.com\/docs-v2\/wp-json\/wp\/v2\/types\/docs"}],"replies":[{"embeddable":true,"href":"https:\/\/wpgeodirectory.com\/docs-v2\/wp-json\/wp\/v2\/comments?post=377"}],"version-history":[{"count":0,"href":"https:\/\/wpgeodirectory.com\/docs-v2\/wp-json\/wp\/v2\/docs\/377\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/wpgeodirectory.com\/docs-v2\/wp-json\/wp\/v2\/docs\/367"}],"next":[{"title":"Places Settings - General","link":"https:\/\/wpgeodirectory.com\/docs-v2\/places\/general\/","href":"https:\/\/wpgeodirectory.com\/docs-v2\/wp-json\/wp\/v2\/docs\/373"}],"prev":[{"title":"Places Settings - Sorting","link":"https:\/\/wpgeodirectory.com\/docs-v2\/places\/sorting\/","href":"https:\/\/wpgeodirectory.com\/docs-v2\/wp-json\/wp\/v2\/docs\/423"}],"wp:attachment":[{"href":"https:\/\/wpgeodirectory.com\/docs-v2\/wp-json\/wp\/v2\/media?parent=377"}],"wp:term":[{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/wpgeodirectory.com\/docs-v2\/wp-json\/wp\/v2\/doc_tag?post=377"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}