Title: Tabs
Last modified: August 21, 2016

---

# Tabs

 *  Resolved [sleenmg](https://wordpress.org/support/users/sleenmg/)
 * (@sleenmg)
 * [12 years, 9 months ago](https://wordpress.org/support/topic/tabs-5/)
 * I’m hoping you can help me. I’m using the Tabs shortcode and I love it. Is it
   possible to set one of the Tab titles to a link? I really need to have users 
   click on one of the and have them be sent to another page.
 * I have tried setting the title as a link but it just stays on the same page.
 * Sure hope you can help me.
 * [http://wordpress.org/plugins/shortcodes-ultimate/](http://wordpress.org/plugins/shortcodes-ultimate/)

Viewing 13 replies - 1 through 13 (of 13 total)

 *  Plugin Author [Vova](https://wordpress.org/support/users/gn_themes/)
 * (@gn_themes)
 * [12 years, 8 months ago](https://wordpress.org/support/topic/tabs-5/#post-4041315)
 * Hello,
 * I can help you, but you should show me the page with tabs.
 *  Thread Starter [sleenmg](https://wordpress.org/support/users/sleenmg/)
 * (@sleenmg)
 * [12 years, 8 months ago](https://wordpress.org/support/topic/tabs-5/#post-4041318)
 * Thanks, the one that I’m working on is [http://hoffbrausteaks.com/amarillo-menu/](http://hoffbrausteaks.com/amarillo-menu/)
   I want to add one in between Kids and To Go but i want it to link to another 
   page instead.
 * Thanks for your assistance.
 *  Plugin Author [Vova](https://wordpress.org/support/users/gn_themes/)
 * (@gn_themes)
 * [12 years, 8 months ago](https://wordpress.org/support/topic/tabs-5/#post-4041320)
 * You can put link inside tab title, but you need to use single quotes for link
   tag.
 * Code:
 *     ```
       [tabs]
          [tab title="<a href='http://example.com/'>Tab title</a>"] Content [/tab]
       [/tabs]
       ```
   
 * And JS-code:
 *     ```
       <script type="text/javascript">
       jQuery(document).ready(function($) {
          $('.su-tabs-nav span').click(function() {
             if ($(this).find('a').length > 0) window.location.href = $(this).find('a').attr('href');
          });
       });
       </script>
       ```
   
 * You can paste js-code right inside post editor in HTML mode, but I recommend 
   to use theme files.
 *  Plugin Author [Vova](https://wordpress.org/support/users/gn_themes/)
 * (@gn_themes)
 * [12 years, 8 months ago](https://wordpress.org/support/topic/tabs-5/#post-4041321)
 * I found easy way to solve your problem.
 * Go to Dashboard > Shortcodes Ultimate > Custom CSS (tab) and add next portion
   of CSS code to the editor:
 *     ```
       .su-tabs-nav span a {
          display: block;
          margin: -5px -15px;
          padding: 5px 15px;
          font-weight: normal;
       }
       ```
   
 *  Plugin Author [Vova](https://wordpress.org/support/users/gn_themes/)
 * (@gn_themes)
 * [12 years, 8 months ago](https://wordpress.org/support/topic/tabs-5/#post-4041322)
 * Use this CSS code instead of js-code I’ve provided above.
    BTW you still need
   to use link in tab title attribute.
 * And there is final solution:
 * Shortcode
 *     ```
       [tabs]
          [tab title="<a href='http://example.com/'>Tab title</a>"] Content [/tab]
       [/tabs]
       ```
   
 * Custom CSS
 *     ```
       .su-tabs-nav span a {
          display: block;
          margin: -5px -15px;
          padding: 5px 15px;
          font-weight: normal;
       }
       ```
   
 *  Thread Starter [sleenmg](https://wordpress.org/support/users/sleenmg/)
 * (@sleenmg)
 * [12 years, 8 months ago](https://wordpress.org/support/topic/tabs-5/#post-4041323)
 * Thanks, I’m trying to get this to work. Right now I see the code on my sample
   page. I’ thinking I may have put the javascript in the wrong place.
 * Can you tell me exactly where I would put it? I’m trying to put it in the theme
   files and I’ve tried Body Tag, Body Top, Body Header None of them seem to work.
 * My test page is [http://hoffbrausteaks.com/test-menu](http://hoffbrausteaks.com/test-menu)
   and I’ve used
 * [/tab]
    [tab title=”[Tab title](http://hoffbrausteaks.com/bar/)“] Test [/tab][/
   tabs]
 * Thanks for yoyu assistance.
 *  Plugin Author [Vova](https://wordpress.org/support/users/gn_themes/)
 * (@gn_themes)
 * [12 years, 8 months ago](https://wordpress.org/support/topic/tabs-5/#post-4041324)
 * See my latest reply. You can do it without javascript and this way is better.
 *  Plugin Author [Vova](https://wordpress.org/support/users/gn_themes/)
 * (@gn_themes)
 * [12 years, 8 months ago](https://wordpress.org/support/topic/tabs-5/#post-4041325)
 * As I see, you’re using visual editor that converts your link into text.
    I’ve
   recorded a video that will explain you how to add this link properly using visual
   editor.
 * This is code that I paste to editor in the video:
    [tabs] [tab title=”] Content[/
   tab] [/tabs]
 *  Plugin Author [Vova](https://wordpress.org/support/users/gn_themes/)
 * (@gn_themes)
 * [12 years, 8 months ago](https://wordpress.org/support/topic/tabs-5/#post-4041326)
 * Video – [http://www.screenr.com/7oRH](http://www.screenr.com/7oRH)
 *  Thread Starter [sleenmg](https://wordpress.org/support/users/sleenmg/)
 * (@sleenmg)
 * [12 years, 8 months ago](https://wordpress.org/support/topic/tabs-5/#post-4041327)
 * Ok…I’ve added rthe CSS code and used the following shortcode
 *     ```
       [/tab]
          [tab title="<a href='http://example.com/'>Tab title</a>"] Content [/tab]
       [/tabs]
       ```
   
 * all i see is code.
 * Does this need to be set up as another set of tabs?
 *  Plugin Author [Vova](https://wordpress.org/support/users/gn_themes/)
 * (@gn_themes)
 * [12 years, 8 months ago](https://wordpress.org/support/topic/tabs-5/#post-4041329)
 * Please watch the video and make sure you’re doing same things
 *  Thread Starter [sleenmg](https://wordpress.org/support/users/sleenmg/)
 * (@sleenmg)
 * [12 years, 8 months ago](https://wordpress.org/support/topic/tabs-5/#post-4041333)
 * I watched the video and that is how i was adding it. I appreciate it.
 * I did finally get it working though. This is what i did.
 * [tab title=’[Bar](http://example.com)‘][/tab]
    [/tabs]
 * It fits now right under the rest of the tabs and I think I feel comfrtable that
   I can add/move it where i need it to be within the tabs.
 * Thank you so much for your help. I can now finish the page.
 *  Plugin Author [Vova](https://wordpress.org/support/users/gn_themes/)
 * (@gn_themes)
 * [12 years, 8 months ago](https://wordpress.org/support/topic/tabs-5/#post-4041334)
 * Glad to have helped you

Viewing 13 replies - 1 through 13 (of 13 total)

The topic ‘Tabs’ is closed to new replies.

 * ![](https://ps.w.org/shortcodes-ultimate/assets/icon-256x256.gif?rev=2547563)
 * [WP Shortcodes Plugin — Shortcodes Ultimate](https://wordpress.org/plugins/shortcodes-ultimate/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/shortcodes-ultimate/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/shortcodes-ultimate/)
 * [Active Topics](https://wordpress.org/support/plugin/shortcodes-ultimate/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/shortcodes-ultimate/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/shortcodes-ultimate/reviews/)

## Tags

 * [ultimate shortcode](https://wordpress.org/support/topic-tag/ultimate-shortcode/)

 * 13 replies
 * 2 participants
 * Last reply from: [Vova](https://wordpress.org/support/users/gn_themes/)
 * Last activity: [12 years, 8 months ago](https://wordpress.org/support/topic/tabs-5/#post-4041334)
 * Status: resolved