Having trouble with option tabs

Matthew Hawley

Well-known member
So Im using this tutorial here http://xenforo.com/community/threads/how-to-use-tabs-to-separate-your-add-on-options.28169/ And here is what I have

And yes some options are 1 and some are 100, etc

The template name: FontAwesomeIcons_OptionTabs
Contents:
Code:
<xen:title>{xen:phrase options}: {$group.title}</xen:title>
<xen:h1>{$group.title}</xen:h1>
<xen:container var="$head.optionCss">
<style>
.hiddenOption  { display: inline-block; font-size: 9px; margin-right: 3px; color: @mutedTextColor; }
.hiddenOption a { position: static; }
.optionList a.optionAnchor { position: absolute; top: -80px; } /* prevents anchors pointing going under the fixed header */
</style>
</xen:container>
<xen:if is="{$canEditGroup}">
<xen:topctrl>
<a href="{xen:adminlink 'options/add-option', '', "group_id={$group.group_id}"}" class="button">+ {xen:phrase add_option}</a>
<a class="button" href="{xen:adminlink 'options/display-order', $group}">{xen:phrase display_order}</a>
<a class="button" href="{xen:adminlink 'options/edit-group', $group}">{xen:phrase edit_group}</a>
</xen:topctrl>
</xen:if>
<xen:form action="{xen:adminlink 'options/save', $group}">
<div class="topChoosers">
<div class="Popup">
<span class="muted">{xen:phrase option_groups}:</span> <a rel="Menu">{$group.title}</a>
<div class="Menu">
<div class="primaryContent menuHeader"><h3>{xen:phrase option_groups}</h3></div>
<ul class="secondaryContent blockLinksList">
<xen:foreach loop="$groups" value="$_group">
<li><a href="{xen:adminlink 'options/list', $_group}">{$_group.title}</a></li>
</xen:foreach>
</ul>
</div>
</div>
</div>
<xen:if hascontent="true"><div class="optionGroupDescription muted"><i><xen:contentcheck>{xen:raw $group.description}</xen:contentcheck></i></div></xen:if>
<ul class="tabs mainTabs Tabs" data-panes="#OptionPanes > li" data-history="on">
<li><a href="{$requestPaths.requestUri}#1">Visitor Tabs & Account Wrapper</a></li>
<li><a href="{$requestPaths.requestUri}#2">Quick Navigation Menu</a></li>
<li><a href="{$requestPaths.requestUri}#3">Message User Info</a></li>
<li><a href="{$requestPaths.requestUri}#4">Message Buttons</a></li>
<li><a href="{$requestPaths.requestUri}#5">Registration Form</a></li>
<li><a href="{$requestPaths.requestUri}#6">Help Wrapper</a></li>
<li><a href="{$requestPaths.requestUri}#7">Sidebar</a></li>
</ul>
<ul id="OptionPanes">
<xen:foreach loop="$renderedOptions" value="$_group">
<xen:if hascontent="true">
<li id="{$i}" class="profileContent">
<fieldset class="optionList">
<xen:contentcheck>
<xen:set var="$i">{xen:calc '{$i} + 1'}</xen:set>
<xen:foreach loop="$_group" key="$optionId" value="$renderedOption">{xen:raw $renderedOption}</xen:foreach>
</xen:contentcheck>
</fieldset>
</li>
</xen:if>
</xen:foreach>
</ul>
<xen:submitunit save="{xen:phrase save_changes}">
<input type="reset" class="button" value="{xen:phrase cancel}" accesskey="r" />
</xen:submitunit>
</xen:form>

The Listener:
Code:
<?php
class FontAwesomeIcons_Listener
{
    /***
    * This is the event listener callback. All the params are explanaded in the Code Event Listener page in the AdminCP.
    */
    public static function templatePostRender($templateName, &$content, array &$containerData, XenForo_Template_Abstract $template)
    {
        /* If the template is the one we want to change */
        if ($templateName == 'option_list')
        {
            /* If we are viewing our addon options page */
            if ($containerData['title'] == 'Font Awesome Icons')
            {
                /* Change the default options list template to our new one */
                $content = $template->create('FontAwesomeIcons_OptionTabs', $template->getParams());
            }
        }
    }
}

And here is what I have in the Code Event Listener:

ld31.png


Any suggestions?
 
The tabs dont show up in the options. Idk whats wrong with my code so thats why Im asking...
This to me came across as very rude. And perhaps you don't realise but you probably just alienated @King Kovifor who is actually just as much of a talented developer as Waindigo. Yet there you are tagging myself and Waindigo when someone more than able to help was already trying to help you.

Perhaps if you hadn't come across so rude, King K might have spent further time trying to help you. You have to understand that his question was born out of the fact that although you gave us all of your code, you neglected to give us any detail as to what wasn't working. Was there an error? Was the code not working as expected? You eventually provided that in response to his question, but by that time you probably pissed him off enough to not feel like helping you anymore.
 
This to me came across as very rude. And perhaps you don't realise but you probably just alienated @King Kovifor who is actually just as much of a talented developer as Waindigo. Yet there you are tagging myself and Waindigo when someone more than able to help was already trying to help you.

Perhaps if you hadn't come across so rude, King K might have spent further time trying to help you. You have to understand that his question was born out of the fact that although you gave us all of your code, you neglected to give us any detail as to what wasn't working. Was there an error? Was the code not working as expected? You eventually provided that in response to his question, but by that time you probably pissed him off enough to not feel like helping you anymore.

Oh...

@King Kovifor I am very sorry If was being rude, that was not my intention.
 
Good.

As it happens, you haven't quite followed the instructions of the tutorial fully, but it's a really small detail you over looked.

PHP:
            /* If we are viewing our addon options page */
            if ($containerData['title'] == 'Font Awesome Icons')
            {
                /* Change the default options list template to our new one */
                $content = $template->create('FontAwesomeIcons_OptionTabs', $template->getParams());
            }

$containerData['title'] contains the title of the page when you're viewing it in the options. To clarify: That is not necessarily the same as the title you see in the H1 tag. This is the title that appears in the title bar of your browser.

On any Options page, the title of the page is Options: <Option Group Title Here> (Followed by the board URL etc).

So, to get this going you need to change:

PHP:
if ($containerData['title'] == 'Font Awesome Icons')

to:

PHP:
if ($containerData['title'] == 'Options: Font Awesome Icons')

You will notice in the original tutorial it is prefixed with "Options: " too.
 
Good.

As it happens, you haven't quite followed the instructions of the tutorial fully, but it's a really small detail you over looked.

PHP:
            /* If we are viewing our addon options page */
            if ($containerData['title'] == 'Font Awesome Icons')
            {
                /* Change the default options list template to our new one */
                $content = $template->create('FontAwesomeIcons_OptionTabs', $template->getParams());
            }

$containerData['title'] contains the title of the page when you're viewing it in the options. To clarify: That is not necessarily the same as the title you see in the H1 tag. This is the title that appears in the title bar of your browser.

On any Options page, the title of the page is Options: <Option Group Title Here> (Followed by the board URL etc).

So, to get this going you need to change:

PHP:
if ($containerData['title'] == 'Font Awesome Icons')

to:

PHP:
if ($containerData['title'] == 'Options: Font Awesome Icons')

You will notice in the original tutorial it is prefixed with "Options: " too.

Thanks Chris, it worked!
 
Last edited:
Top Bottom