XF 1.3 XF Tabs Issue (not navbar tabs)

[PrettyPixels]

I've created some custom tabs as described here. They work perfectly, except for one thing -- when I try to link a tab to a page outside the current page, it doesn't work. I simply get a blanked out tab instead of clicking through to the specified URL. All the other tabs (that link to content within the same page) work correctly.

I've formatted my link using a full URL and a "target" tag, but clicking it still stays in the same page and doesn't open the URL I've specified.

Any ideas why the external link won't work? I appreciate any help or insights into this -- it's been driving me crazy.

Here's what the code looks like:

<ul id="roleplaytabs" class="Tabs tabs" data-panes="#roleplay > li">
    <li>
        <a href="roleplay-topic">Role Playing</a>
    </li>
    <li>
        <a href="http://mydomain.com" target="_self">External Link</a>
    </li>
    <li>
        <a href="about-the-game">About the Game</a>
    </li>
    <li>
        <a href="roleplay-getting-started">Getting Started</a>
    </li>
    <li>
        <a href="roleplay-helpful-links">Helpful Links</a>
    </li>
</ul>
<br />

<ul id="roleplay">
    <li>
         <h2>Role Playing</h2>
    </li>
    <li><!-- This is a placeholder for the external link. If it's not here, the tabs will be out of place by one. --></li>
    <li>
        <h2>About the Game</h2>
    </li>
    <li>
        <h2>Getting Started</h2>
    </li>
    <li>
        <h2>Helpful Links</h2>
   </li>
</ul>

 

[Paul B]

You are using relative links.

What are the actual URLs of those links?

If they are pages within XenForo then use xen:link, otherwise use the absolute URL.

 

[Chris D]

In addition, the links should be anchors.

Take a look at how this is implemented in the member_view template.

            <ul class="tabs mainTabs Tabs" data-panes="#ProfilePanes > li" data-history="on">
                <li><a href="{$requestPaths.requestUri}#profilePosts">{xen:phrase profile_posts}</a></li>
            </ul>

Notice how the tab href is structured.

In addition, the #profilePosts bit relates to the ID of the tab element:

        <ul id="ProfilePanes">
            <li id="profilePosts" class="profileContent"></li>
        </ul>

 

[PrettyPixels]

Got it! Thanks so much for your help!

 

[Jaxel]

Hey... what does the

data-history="on"

property do?