Plugin Author
Vova
(@gn_themes)
Hello,
I can help you, but you should show me the page with tabs.
Thanks, the one that I’m working on is 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
(@gn_themes)
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
(@gn_themes)
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
(@gn_themes)
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;
}
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 and I’ve used
[/tab]
[tab title=”Tab title“]
Test
[/tab]
[/tabs]
Thanks for yoyu assistance.
Plugin Author
Vova
(@gn_themes)
See my latest reply. You can do it without javascript and this way is better.
Plugin Author
Vova
(@gn_themes)
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
(@gn_themes)
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
(@gn_themes)
Please watch the video and make sure you’re doing same things
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‘][/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.
