{"id":17299,"date":"2012-03-20T23:02:49","date_gmt":"2012-03-20T23:02:49","guid":{"rendered":"https:\/\/wordpress.org\/plugins-wp\/tabs-shortcode\/"},"modified":"2024-12-05T00:12:49","modified_gmt":"2024-12-05T00:12:49","slug":"tabs-shortcode","status":"closed","type":"plugin","link":"https:\/\/wordpress.org\/plugins\/tabs-shortcode\/","author":20607520,"comment_status":"closed","ping_status":"closed","template":"","meta":{"version":"3.0.1","stable_tag":"trunk","tested":"6.7.5","requires":"3.4","requires_php":"","requires_plugins":null,"header_name":"Tabs Shortcode","header_author":"CTLT","header_description":"","assets_banners_color":"","last_updated":"2024-12-05 00:12:49","external_support_url":"","external_repository_url":"","donate_link":"","header_plugin_uri":"http:\/\/wordpress.org\/extend\/plugins\/tabs-shortcode\/","header_author_uri":"http:\/\/ctlt.ubc.ca","rating":4.1,"author_block_rating":0,"active_installs":900,"downloads":33982,"num_ratings":12,"support_threads":0,"support_threads_resolved":0,"author_block_count":0,"sections":["description","installation","faq","changelog"],"tags":{"1":{"tag":"1","author":"enej","date":"2012-03-20 23:03:01"},"1.0.1":{"tag":"1.0.1","author":"enej","date":"2012-03-20 23:06:31"},"1.0.2":{"tag":"1.0.2","author":"enej","date":"2012-05-02 21:43:45"},"1.0.3":{"tag":"1.0.3","author":"enej","date":"2012-05-17 21:24:52"},"1.1":{"tag":"1.1","author":"enej","date":"2012-09-18 20:38:47"},"1.1.1":{"tag":"1.1.1","author":"enej","date":"2012-09-18 22:32:58"},"2.0":{"tag":"2.0","author":"enej","date":"2012-11-28 23:59:40"},"2.0.1":{"tag":"2.0.1","author":"enej","date":"2013-01-04 20:13:49"},"2.0.2":{"tag":"2.0.2","author":"loongchan","date":"2013-12-23 23:28:57"},"3.0.0":{"tag":"3.0.0","author":"ctltwp","date":"2024-12-03 21:17:20"}},"upgrade_notice":{"":"<p>If you are updating from the proviso version and you have added css to your theme \nPlease add <code>add_theme_support( &amp;#039;tabs&amp;#039;, &amp;#039;style-only&amp;#039; );<\/code> to you functions file. Preferably somewhere in a function that is being called by the after theme setup action\n     add_action(&#039;after_setup_theme&#039;,&#039;bones_theme_support&#039;);<\/p>\n\n<p>This will tell the plugin to not include tab styling to your theme.<\/p>"},"ratings":{"1":"2","2":0,"3":0,"4":"3","5":"7"},"assets_icons":[],"assets_banners":[],"assets_blueprints":{},"all_blocks":[],"tagged_versions":null,"block_files":[],"assets_screenshots":{"screenshot-1.png":{"filename":"screenshot-1.png","revision":3202725,"resolution":"1","location":"plugin"},"screenshot-2.png":{"filename":"screenshot-2.png","revision":3202725,"resolution":"2","location":"plugin"}},"screenshots":{"1":"Default styling","2":"Styling using the twitter bootstrap"}},"plugin_section":[],"plugin_tags":[80,2150],"plugin_category":[43],"plugin_contributors":[78672,77524,78671],"plugin_business_model":[],"class_list":["post-17299","plugin","type-plugin","status-closed","hentry","plugin_tags-shortcode","plugin_tags-tab","plugin_category-customization","plugin_contributors-ctlt-dev","plugin_contributors-enej","plugin_contributors-oltdev","plugin_committers-ctltwp"],"banners":[],"icons":{"svg":false,"icon":"https:\/\/s.w.org\/plugins\/geopattern-icon\/tabs-shortcode.svg","icon_2x":false,"generated":true},"screenshots":[{"src":"https:\/\/ps.w.org\/tabs-shortcode\/trunk\/screenshot-1.png?rev=3202725","caption":"Default styling"},{"src":"https:\/\/ps.w.org\/tabs-shortcode\/trunk\/screenshot-2.png?rev=3202725","caption":"Styling using the twitter bootstrap"}],"raw_content":"<!--section=description-->\n<p>To add tabs to you post or pages just add this shortcode:<\/p>\n\n<pre><code>[tabs]\n[tab title=\"title1\"] tab content \ntab content \n[\/tab]\n[tab title=\"title2\"] \nanother content tab \n[\/tab]\n[\/tabs]\n<\/code><\/pre>\n\n<p>Here are the some attributes that the shortcode also excepts \n\/\/ default attributes\n    [tabs collapsible=true selected='0' event='click' position='top' ]<br \/>\n    [tab title=\"title1\"]\n    tab content \n    [\/tab]\n    [tab title=\"title2\"] \n    another content tab \n    [\/tab]\n    [\/tabs]<\/p>\n\n<ul>\n<li>collapsible = true or false - weather the tabs should be allowed to be collapsed - this doesn't work with twitter bootstrap <\/li>\n<li>selected = integer for example - what tab should be selected. 0 means the first tab. 1 means the second tab etc. <\/li>\n<li>event = 'click' or 'mouseover' - does do you user need to click on the tab or just mouse over to get to the content. Tip: Don't use mouseover if you are concerned with mobile. <\/li>\n<li>position = 'top' , 'bottom' , 'left', 'right' on what side do you want the tabs to appear. See screenshots for an example. <\/li>\n<li>vertical_tabs = true or false - depreciated is the same as position = left<\/li>\n<\/ul>\n\n<h3>Sample CSS<\/h3>\n\n<p>Want to style the tabs a different way.<\/p>\n\n<p>Here is some sample css to get you started. \nAnother place to look for it would be the http:\/\/jqueryui.com\/themeroller\/, \nThe shortcode used the jQuery UI to generate the tabs unless you are using the twitter bootstrap framework. \nSee the FAQ on how to deal with that case.<\/p>\n\n<pre><code>\/* =tabs\n-------------------------------------------------------------- *\/\n.tabs-shortcode.ui-tabs {\n    padding:.2em;\n    zoom:1;\n    clear:both;\n    background:#FFF;\n    padding:0;\n    margin:0;\n}\n\n.tabs-shortcode.ui-tabs-nav {\n    list-style:none!important;\n    padding:.2em 0 0!important;\n    margin: 0!important;\n}\n.tabs-shortcode .ui-tabs-nav:after{\n    visibility: hidden;\n    display: block;\n    font-size: 0;\n    content: \" \";\n    clear: both;\n    height: 0;\n}\n* html .tabs-shortcode  .ui-tabs-nav          { zoom: 1; } \/* IE6 *\/\n*:first-child+html .tabs-shortcode .ui-tabs-nav { zoom: 1; } \/* IE7 *\/\n\n.tabs-shortcode .ui-tabs-nav li {\n    position:relative;\n    float:left;\n    border:1px solid #CCC;\n    background:#EEE;\n    list-style:none!important;\n    z-index: 100;\n    padding:0;\n}\n\n.tabs-shortcode.ui-tabs .ui-tabs-nav li.ui-tabs-active,\n.tabs-shortcode.ui-tabs .ui-tabs-nav li.ui-tabs-selected {\n    background:#FFF;\n    color:#111;\n}\n\n.tabs-shortcode .ui-tabs-nav li:before {\n    content:\"\";\n}\n\n.tabs-shortcode .ui-tabs-nav li a {\n    float:left;\n    text-decoration:none;\n    padding:2px 1em;\n    color:#333;\n    border:none!important;\n}\n\n.tabs-shortcode.ui-tabs .ui-tabs-nav li.ui-tabs-active a,\n.tabs-shortcode.ui-tabs .ui-tabs-nav li.ui-tabs-selected a,\n.tabs-shortcode.ui-tabs .ui-tabs-nav li.ui-state-disabled a,\n.tabs-shortcode.ui-tabs .ui-tabs-nav li.ui-state-processing a {\n    cursor: default;\n}\n\n.tabs-shortcode .ui-tabs-nav li a,\n.tabs-shortcode.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active a,\n.tabs-shortcode.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a {\n    cursor:pointer;\n}\n\n.tabs-shortcode .ui-tabs-panel {\n    display:block;\n    border-width:0;\n    background:none;\n}\n\n.tabs-shortcode .ui-tabs-hide {\n    display:none!important;\n}\n\n.tabs-shortcode.ui-tabs-panel {\n    clear:both;\n}\n\/* Position  Top and Bottom  *\/\n.tabs-shortcode-top .ui-tabs-nav,\n.tabs-shortcode-bottom .ui-tabs-nav{\n    margin-left:0!important;\n}\n.tabs-shortcode-top .ui-tabs-nav li,\n.tabs-shortcode-bottom .ui-tabs-nav li{\n    position:relative;\n    float:left;\n    position:relative;\n    float:left;\n}\n\n\/* Position Top *\/\n.tabs-shortcode-top .ui-tabs-nav{\n    border-bottom: 1px solid #CCC;\n}\n.tabs-shortcode-top .ui-tabs-nav li.ui-tabs-active,\n.tabs-shortcode-top .ui-tabs-nav li.ui-tabs-selected {\n    padding-bottom:1px!important;\n    border-bottom:0;\n    margin:1px .3em -1px 0!important;\n}\n.tabs-shortcode-top .ui-tabs-nav li {\n    border-bottom-width:0!important;\n    margin:1px .3em 0 0!important;\n}\n\n\/* Position Bottom *\/\n.tabs-shortcode-bottom .ui-tabs-nav{\n    border-top: 1px solid #CCC;\n}\n.tabs-shortcode-bottom .ui-tabs-nav li.ui-tabs-active,\n.tabs-shortcode-bottom .ui-tabs-nav li.ui-tabs-selected {\n    padding-top:1px!important;\n    border-top:0;\n    margin:-1px .3em 1px 0!important;\n}\n\n.tabs-shortcode-bottom .ui-tabs-nav li {\n    border-top-width:0!important;\n    margin:0 .3em 1px 0!important;  \n}\n\n\n\/* Position  Left and Right  *\/\n.tabs-shortcode-left .ui-tabs-nav,\n.tabs-shortcode-right .ui-tabs-nav{\n    width: 150px;\n    margin: 0!important;\n}\n\n.tabs-shortcode-left .ui-tabs-nav li,\n.tabs-shortcode-left,\n.tabs-shortcode-right .ui-tabs-nav li,\n.tabs-shortcode-right{\n    position: relative;\n    overflow: hidden;\n}\n.tabs-shortcode-left .ui-tabs-nav li,\n.tabs-shortcode-right .ui-tabs-nav li{\n    margin:0 0 0.3em 0;\n    width: 100%;\n}\n.tabs-shortcode-left .ui-tabs-nav li a,\n.tabs-shortcode-right .ui-tabs-nav li a{\n    width: 100%;\n}\n.tabs-shortcode-left .ui-tabs-panel,\n.tabs-shortcode-right .ui-tabs-panel{\n    margin-left: 165px;\n}\n\n\/* Position Left *\/\n.tabs-shortcode-left .ui-tabs-nav{\n    border-right: 1px solid #CCC;\n    padding: 0 1px 10px 0!important;\n}\n.tabs-shortcode-left .ui-tabs-nav,\n.tabs-shortcode-left .ui-tabs-nav li{\n    float: left;\n}\n.tabs-shortcode-left .ui-tabs-nav li.ui-tabs-active,\n.tabs-shortcode-left .ui-tabs-nav li.ui-tabs-selected {\n    padding-right:1px;\n    border-right:0;\n    margin:0 1px 0.3em 0;\n}\n\n\/* Position Right *\/\n.tabs-shortcode-right .ui-tabs-nav{\n    border-left: 1px solid #CCC;\n    padding: 0 0 10px 1px!important;\n}\n.tabs-shortcode-right .ui-tabs-nav,\n.tabs-shortcode-right .ui-tabs-nav li{\n    float: right;\n}\n.tabs-shortcode-right .ui-tabs-nav li.ui-tabs-active,\n.tabs-shortcode-right .ui-tabs-nav li.ui-tabs-selected {\n    padding-left:1px;\n    border-left:0;\n    margin:0 0 0.3em 1px;\n}\n<\/code><\/pre>\n\n<!--section=installation-->\n<p>See http:\/\/codex.wordpress.org\/Managing_Plugins#Installing_Plugins<\/p>\n\n<!--section=faq-->\n<dl>\n<dt id='how%20to%20get%20rid%20of%20unwanted%20%60%3Cp%3E%60%20tags'><h3>How to get rid of unwanted `<p>` tags<\/p><\/h3><\/dt>\n<dd><p>Get rid of unneeded white space inside your shortcode<\/p><\/dd>\n<dt id='my%20theme%20already%20has%20styling%20for%20tabs%20how%20can%20i%20remove%20the%20default%20styling'><h3>My theme already has styling for tabs how can I remove the default styling<\/h3><\/dt>\n<dd><p>Easy. Add the line <code>add_theme_support( 'tabs', 'style-only' );<\/code> to you functions.php file. Preferably somewhere in a function that is being called by the after theme setup action\n     add_action('after_setup_theme','bones_theme_support');<\/p><\/dd>\n<dt id='i%20am%20using%20the%20twitter%20bootstrap%20framework%20how%20do%20i%20make%20sure%20that%20the%20tabs%20work%20with%20it.'><h3>I am using the twitter bootstrap framework how do I make sure that the tabs work with it.<\/h3><\/dt>\n<dd><p>The shortcode support the twitter bootstrap framework. \n    add_theme_support( 'tabs', 'twitter-bootstrap' );<\/p><\/dd>\n<dt id='how%20can%20i%20contribute%20to%20this%20plugin'><h3>How can I contribute to this plugin<\/h3><\/dt>\n<dd><p>If you must ask. Checkout the source code at https:\/\/github.com\/ubc\/tabs-shortcode<\/p>\n\n<p>Feel free to submit pull requests.<\/p>\n\n<p><strong>note<\/strong>: The twitter bootstrap framework doesn't use the jquery ui tab javascript.<\/p><\/dd>\n\n<\/dl>\n\n<!--section=changelog-->\n<h4>2.0.2<\/h4>\n\n<ul>\n<li>Minified files so that things are load even faster, saving tree though bandwidth.<\/li>\n<\/ul>\n\n<h4>2.0.1<\/h4>\n\n<ul>\n<li>Bug fixes: Removes notices<\/li>\n<li>updated to styles better with version jQuery 1.9<\/li>\n<\/ul>\n\n<h4>2<\/h4>\n\n<ul>\n<li>Rewrite of the plugin<\/li>\n<li>Now we are adding some tab styling by default<\/li>\n<li>Added position attribute (top, bottom, left, right)<\/li>\n<\/ul>\n\n<h4>1.1.1<\/h4>\n\n<ul>\n<li>removing unwanted warnings. <\/li>\n<\/ul>\n\n<h4>1.1<\/h4>\n\n<ul>\n<li>rewrite to use classes and make the javascript be loaded only when it needs to be. <\/li>\n<\/ul>\n\n<h4>1.0.2<\/h4>\n\n<ul>\n<li>bug fixes now it plays more nicely with other short codes.<\/li>\n<\/ul>\n\n<h4>1<\/h4>\n\n<ul>\n<li>Initial Release<\/li>\n<\/ul>","raw_excerpt":"Lets you add tabs to your post and pages using a shortcode.","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin\/17299","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin"}],"about":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/types\/plugin"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/comments?post=17299"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wporg\/v1\/users\/ctltwp"}],"wp:attachment":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/media?parent=17299"}],"wp:term":[{"taxonomy":"plugin_section","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_section?post=17299"},{"taxonomy":"plugin_tags","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_tags?post=17299"},{"taxonomy":"plugin_category","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_category?post=17299"},{"taxonomy":"plugin_contributors","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_contributors?post=17299"},{"taxonomy":"plugin_business_model","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_business_model?post=17299"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}