Title: Post UI Tabs
Author: Mark / t31os
Published: <strong>6 d'abril de 2011</strong>
Last modified: 30 d'abril de 2013

---

Cerca extensions

![](https://ps.w.org/put/assets/banner-772x250.png?rev=700716)

Aquesta extensió **no s’ha provat en les darreres 3 versions majors del WordPress**.
Segurament no està mantinguda o suportada, i pot tenir problemes de compatibilitat
quan s’usa en versions recents del WordPress.

![](https://s.w.org/plugins/geopattern-icon/put_dadada.svg)

# Post UI Tabs

 Per [Mark / t31os](https://profiles.wordpress.org/t31os_/)

[Baixa](https://downloads.wordpress.org/plugin/put.1.1.0.zip)

 * [Detalls](https://ca.wordpress.org/plugins/put/#description)
 * [Ressenyes](https://ca.wordpress.org/plugins/put/#reviews)
 *  [Instal·lació](https://ca.wordpress.org/plugins/put/#installation)
 * [Desenvolupament](https://ca.wordpress.org/plugins/put/#developers)

 [Suport](https://wordpress.org/support/plugin/put/)

## Descripció

Show off your post content inside stylish jQuery powered tabs using one of 24 different
jQuery UI themes or include your own custom stylesheet.

### Filters

The plugin provides various filters to aid users, they are as follows

 * `put_decide_has_tabs`: (bool) true/false value that determines whether to run
   the tabs script(runs inside a filter on `the_content`)
 * `put_theme_dir`: (string) passes the theme directory uri
 * `put_stylesheet`: (string) name of the stylesheet to use for tabs CSS
 * `put_skins`: (array) passes the array of skins available to the plugin
 * `put_stylesheet_uri`: (string) the full stylesheet uri used (easier hook for 
   custom stylesheets)
 * `put_prev_text`: (string) the text used for previous tab navigation(text not 
   shown by default)
 * `put_next_text`: (string) the text used for next tab navigation(text not shown
   by default)
 * `put_nav_class`: (string) the classes applied to the prev and next navigation(
   second arg indicates prev or next text)
 * `put_trailing_linebreak`: (bool) true/false value to determine whether or not
   to add a trailing `<br />` (linebreak) after each tab set

A couple of actions are also available for when you’d rather just turn off skins
and enqueue your own stylesheet

 * `put_enqueue_css`: runs on front facing pages with tab sets when the _Disable
   skins_ is enabled
 * `put_admin_enqueue_css`: runs on the plugin settings page when the _Disable skins_
   is enabled

## Captures

 * [[
 * Two different sets of tabs in a single post.
 * [[
 * The Post UI Tabs settings page.
 * [[
 * One set of tabs in a post.
 * [[
 * TinyMCE buttons in the editor to make adding tabs easier.

## Instal·lació

 1. Upload the `put`(post-ui-tabs) folder to the `/wp-content/plugins/` directory
 2. Activate the plugin through the Plugins menu in WordPress
 3. Visit the plugin configuration screen under **WordPress Admin > Settings > Post
    UI Tabs** and set your preferences
 4. Create posts using the easy to use shortcode and watch the magic happen

## PMF

  So how do i create tabs?

Click one of the simple to use tinymce buttons provided by PUT in the post editor,
quick tags are also available in the text editor.

or

Use the following format to write them directly into the post editor.

    ```
    [tab name="Your tab name 1"]Your tab content[/tab] 
    [tab name="Your tab name 2"]Your tab content[/tab]
    [tab name="Your tab name 3"]Your tab content[/tab]
    [end_tabset]
    ```

**NOTE:**
 It is necessary for all tab sets end with the `[end_tabset]` shortcode,
the tabs will not appear without this shortcode. Please be aware that tab shortcodes
can not be placed on the same line, this is a limitation of shortcode functionality
in WordPress(and i do not wish to bloat this plugin with extra code to work around
it).

  Can i use HTML inside the tabs?

You may use any HTML the WordPress content editor usually allows inside the tab 
content, but not inside the tab names(which are sanitized seperately).

  Can i use tabs in pages?

The plugin is not restricted to a particular kind of content, so yes pages, posts
or custom post types(or at least any type that supports using the content editor).

  Can i use other shortcodes inside the tab content?

Yes you should be able to, it has not been tested, but if you have any problems 
feel free to start a support topic right here in the WordPress.org forums.

  Why do the tabs not look the same when i view them on the front facing side of
my site?

It is possible your theme’s stylesheet is applying CSS to some of the tabs elements,
please feel free to start a support topic if you need help making adjustments.

  How can i remove the UI classes from the next and previous links?

Add the following to your theme’s **functions.php** file.

    ```
    add_filter( 'put_nav_class', '__return_empty_array' );
    ```

  When using text nav links how i can change the link text?

You can modify the previous and next link text using the following in your theme’s**
functions.php** file.

    ```
    // Remove the UI classes(used by default to display nav icons)
    add_filter( 'put_nav_class', '__return_empty_array' );

    // Hook callback functions to the filters
    add_filter( 'put_next_text', 'put_nav_next_text' );
    add_filter( 'put_prev_text', 'put_nav_prev_text' );

    // Callback to change the 'Next' text
    function put_nav_next_text() { return 'Your next text'; }

    // Callback to change the 'Previous' text
    function put_nav_prev_text() { return 'Your previous text'; }
    ```

  How do i include my own CSS in place of one of the jQuery UI themes?

**Method one:**
 _Using a stylesheet in your theme’s directory(will work for child
themes to)_

    ```
    add_filter( 'put_stylesheet_uri', 'my_custom_put_stylesheet' );

    function my_custom_put_stylesheet( $uri ) {
        return get_stylesheet_directory_uri() . '/mycustom.css';
    }
    ```

**Method two:**
 _Adding a filter from inside your own plugin file_

    ```
    add_filter( 'put_stylesheet_uri', 'my_plugin_put_stylesheet' );

    function my_plugin_put_stylesheet( $uri ) {

        // If the stylesheet is in the plugin's main directory

        return plugins_url( '', __FILE__ ) . '/mycustom.css';
        // Eg. http://www.example.com/wp-content/plugins/your-plugin/mycustom.css


        // If the stylesheet is in a subdirectory of the plugin

        return plugins_url( 'dir', __FILE__ ) . '/mycustom.css';
        // Eg. http://www.example.com/wp-content/plugins/your-plugin/dir/mycustom.css
    }
    ```

**Method three:**
 Check the **Disable skins** option on the Post UI Tabs settings
page and do either of the following.

 * Add your own CSS to your theme’s stylesheet(typically **style.css**).
 * Call `wp_enqueue_style` on the `put_enqueue_styles` action, ie. the regular WP
   enqueuing method.

  Can i remove the linebreak that Post UI Tabs after each tab set?

You can, simply place the following code into your theme’s `functions.php` file 
or a plugin.

    ```
    add_filter( 'put_trailing_linebreak', '__return_false' );
    ```

## Ressenyes

![](https://secure.gravatar.com/avatar/0a2f0270132149871864152c692e2d1417d96240426e272fae866852161ee121?
s=60&d=retro&r=g)

### 󠀁[Outstanding and easy to Fly](https://wordpress.org/support/topic/outstanding-and-easy-to-fly/)󠁿

 [eyorks](https://profiles.wordpress.org/eyorks/) 3 de setembre de 2016

Works straight out of the box, and a doddle to configure and tweak. If you need 
Tabs you need this. Thanks Guys

![](https://secure.gravatar.com/avatar/cb7d53b8c5d999a121a2187adcbb32d26d2aa8009f5f0b46f1b37287c4ea79ce?
s=60&d=retro&r=g)

### 󠀁[Make use of Category](https://wordpress.org/support/topic/make-use-of-category/)󠁿

 [Lohith M](https://profiles.wordpress.org/lohith-m/) 7 de febrer de 2017

I am using this plugin but i am unable to find how to make use of category in this
could you please help me out in this? Thaks in advance, loki@emizr.net

 [ Llegiu totes les 15 ressenyes ](https://wordpress.org/support/plugin/put/reviews/)

## Col·laboradors i desenvolupadors

«Post UI Tabs» és programari de codi obert. La següent gent ha col·laborat en aquesta
extensió.

Col·laboradors

 *   [ Mark / t31os ](https://profiles.wordpress.org/t31os_/)

[Traduïu «Post UI Tabs» a la vostra llengua.](https://translate.wordpress.org/projects/wp-plugins/put)

### Interessats en el desenvolupament?

[Navegueu pel codi](https://plugins.trac.wordpress.org/browser/put/), baixeu-vos
el [repositori SVN](https://plugins.svn.wordpress.org/put/), o subscriviu-vos al
[registre de desenvolupament](https://plugins.trac.wordpress.org/log/put/) per [fisl de subscripció RSS](https://plugins.trac.wordpress.org/log/put/?limit=100&mode=stop_on_copy&format=rss).

## Registre de canvis

#### 1.0.10

 * Fix for undefined error in `post-tabs-ui.js` + some additional small adjustments
 * Fix end tabs quicktag in text editor
 * Added toggle option to determine whether to automatically select the active tab(
   disabling allows anchored links to select the active tab)

#### 1.0.9

 * Added WordPress version check
 * Added GPL License to top of plugin main file
 * First pass adding screen help to the plugin’s configuration page(wp 3.3+ only)
 * First pass adding TinyMCE buttons for tab shortcodes
 * Added `<br />` after each tabset(can be removed using the new `put_trailing_linebreak`
   filter)
 * Rewrote some of the Javscript/jQuery code

#### 1.0.8

 * Fixed bug with jQuery code that caused the tabs not to render in IE7/8 (my fault)
 * Added backwards support for jQuery UI tabs prior to jQuery UI 1.9(WordPress 3.1–
   3.4)
 * Update more of the readme, to reflect changes to plugin filter/action names

#### 1.0.7

 * Added two new filters `put_decide_has_tabs` and `put_stylesheet_uri`.
 * Switched the filter names(sorry) to use a more consistent and descriptive naming
   scheme – all hooks are now use the `put_` prefix.
 * Change example code in readme and added a list of all the available plugin hooks

#### 1.0.6

 * Update jQuery functions inline with jQuery UI updates, ie. replace calls to deprecated
   functions
 * Removed cookie support(removed from jQuery UI) – alternative to be provided later
   on
 * Moved some filters that were not working correctly
 * Added some new action hooks for users to disable jQuery UI css and enqueue their
   own
 * Improved some jQuery to better handle previous and next navigation when there
   are disabled tabs

#### 1.0.5

 * Changed the `has_tabs` variable to public

#### 1.0.4

 * Update to jQuery UI 1.8.15 (for skins)
 * Add option to display tab titles and content in feeds
 * Rearrange markup for feeds so titles and content does not bunch together
 * Move enqueues to more appropriate action

#### 1.0.3

 * Rename cookie javascript, possible fix for unknown problem with 404s to cookie
   script
 * Remove shortcode content from feeds(was never intended to be output in feeds)

#### 1.0.2

 * Fix style/script versions
 * Add proper plugin version to plugin(whoops)
 * Add more to readme.txt

## Meta

 *  Versió **1.1.0**
 *  Darrera actualització **fa 13 anys**
 *  Instal·lacions actives **500+**
 *  Versió del WordPress ** 3.1.0 o posterior **
 *  Provada fins a **3.6.1**
 *  Idioma
 * [English (US)](https://wordpress.org/plugins/put/)
 * Etiquetes
 * [editor](https://ca.wordpress.org/plugins/tags/editor/)[jquery](https://ca.wordpress.org/plugins/tags/jquery/)
   [jquery ui](https://ca.wordpress.org/plugins/tags/jquery-ui/)[shortcode](https://ca.wordpress.org/plugins/tags/shortcode/)
   [tabs](https://ca.wordpress.org/plugins/tags/tabs/)
 *  [Vista avançada](https://ca.wordpress.org/plugins/put/advanced/)

## Valoracions

 5 sobre 5 estrelles.

 *  [  14 valoracions de 5 estrelles     ](https://wordpress.org/support/plugin/put/reviews/?filter=5)
 *  [  0 valoracions de 4 estrelles     ](https://wordpress.org/support/plugin/put/reviews/?filter=4)
 *  [  0 valoracions de 3 estrelles     ](https://wordpress.org/support/plugin/put/reviews/?filter=3)
 *  [  0 valoracions de 2 estrelles     ](https://wordpress.org/support/plugin/put/reviews/?filter=2)
 *  [  0 valoracions de 1 estrelles     ](https://wordpress.org/support/plugin/put/reviews/?filter=1)

[Your review](https://wordpress.org/support/plugin/put/reviews/#new-post)

[Visualitzeu totes les ressenyes](https://wordpress.org/support/plugin/put/reviews/)

## Col·laboradors

 *   [ Mark / t31os ](https://profiles.wordpress.org/t31os_/)

## Suport

Teniu quelcom a dir? Necessiteu ajuda?

 [Visualitza els fòrums de suport](https://wordpress.org/support/plugin/put/)