• This forum has been archived. New threads and replies may not be made. All add-ons/resources that are active should be migrated to the Resource Manager. See this thread for more information.

Help Menu Pages

Status
Not open for further replies.

Anthony Parsons

Well-known member
Purpose

Help Menu is a simple addon that builds upon James' previous work with creating Help Menu pages, as native additions to your Help section. The addon allows you to create your own additional pages, which is explained in the next post.

Content

The default installation achieves the following:
  • Creates five (5) default help menu pages, being:
    • About Us
    • Imprint (For European sites)
    • Newbie (For you to enter new member information)
    • Privacy Policy
    • Staff
  • Places links in the Help Navigation secondary links, Footer and Help Wrapper menu.
  • Pages have default HTML to begin writing the page content.
  • Settings page in style properties to completely enable / disable per page (links included).
How To Install
  • Upload the /library/ folder, overwriting it.
  • Install the addon .xml via ACP > Home > Install Addon
How To Upgrade
  • Upload the /library/folder, overwriting existing files.
  • Upgrade the previous addon, by selecting "upgrade" from the dropdown menu to the right of the addon ACP > Home > Install Addon page.
Version History

1.0.0 - 28 Dec 11

Versions For Use

This should not really be version specific, as it runs independently of XF code, however; it does require the minimum version that uses the appropriate hooks for linking of link templates.

If you use an earlier version that doesn't have the hooks, then you can manually insert the templates by using: <xen:include template="template_name" /> into the appropriate template location.

How To Use

Once installed, you now have five (5) new templates that can be edited directly in your used style/s. They are:
  • About Us - help_about_us
  • Imprint - help_imprint
  • Newbie - help_newbie
  • Privacy Policy - help_privacy_policy
  • Staff - help_staff
There are also three (3) link templates that control the links being inserted into each area, giving you the complete control of what links are shown, there order, etc. They are:
  • Footer - help_links_footer
  • Help Nav Tab - help_links_nav
  • Help Wrapper - help_links_wrapper
Build your pages directly in the new templates inserted. They use default XF styling colour properties.

The very small amount of custom CSS required to render the basics of these pages is contained in help_menu.css if you want to add or edit it.

Screenshots

Screen shot 2011-12-28 at 11.56.22 AM.webp Screen shot 2011-12-28 at 12.24.25 PM.webp Screen shot 2011-12-28 at 12.24.41 PM.webp

Problems

One problem is that the XF help_index page does not contain a hook, therefore if you want that page to reflect the links you use, then you can copy the following over it, then edit the additional pieces as you see fit, ie. add default descriptions that you want.

HTML:
<xen:title>{xen:phrase help}</xen:title>
<div class="baseHtml">
<xen:if is="@helpMenuAbout">
<dl>
<dt><a href="{xen:link help/about-us}">{xen:phrase help_about_us}</a></dt>
<dd>Insert your description here...</dd>
</dl>
</xen:if>
 
<xen:if is="@helpMenuImprint">
<dl>
<dt><a href="{xen:link help/imprint}">{xen:phrase help_about_imprint}</a></dt>
<dd>Insert your description here...</dd>
</dl>
</xen:if>
 
<xen:if is="@helpMenuNewbie">
<dl>
<dt><a href="{xen:link help/newbie}">{xen:phrase help_newbie}</a></dt>
<dd>Insert your description here...</dd>
</dl>
</xen:if>
 
<xen:if is="@helpMenuPrivacyPolicy">
<dl>
<dt><a href="{xen:link help/privacy-policy}">{xen:phrase privacy_policy}</a></dt>
<dd>Insert your description here...</dd>
</dl>
</xen:if>
 
<xen:if is="@helpMenuStaff">
<dl>
<dt><a href="{xen:link help/staff}">{xen:phrase help_staff}</a></dt>
<dd>Insert your description here...</dd>
</dl>
</xen:if>
 
<dl>
<dt><a href="{xen:link help/smilies}">{xen:phrase smilies}</a></dt>
<dd>{xen:phrase this_shows_full_list_of_smilies_you_can_insert_when_posting_message}</dd>
</dl>
 
<dl>
<dt><a href="{xen:link help/bb-codes}">{xen:phrase bb_codes}</a></dt>
<dd>{xen:phrase list_of_bb_codes_you_can_use_to_spice_up_look_of_your_messages}</dd>
</dl>
 
<dl>
<dt><a href="{xen:link help/trophies}">{xen:phrase trophies}</a></dt>
<dd>{xen:phrase you_can_earn_trophies_by_carrying_out_different_actions}</dd>
</dl>
 
<xen:if is="{$tosUrl}">
<dl>
<dt><a href="{$tosUrl}">{xen:phrase terms_and_rules}</a></dt>
<dd>{xen:phrase you_must_agree_to_these_terms_and_rules_before_using_site}</dd>
</dl>
</xen:if>
</div>
 

Attachments

Create Your Own Page

If you have no use for an existing default page, then you can just change that directly to produce the URL and naming conventions you want via editing, instead of creating a complete new page.

However, if you want to build yourself a much more complicated Help section, then this is how using this mod. There are no limits to page numbers created, each one must simply be registered to correctly work.

The best way to do this is in debug mode, adding your new additions into the master template so they traverse through all your templates automatically. Obviously don't modify XF master templates, as they will get wiped when you upgrade. Modify XF templates in your styles directly.

Step One - PHP

Open /library/HelpMenu/ControllerPublic/Help.php

By default, you will see:

PHP:
<?php
 
class HelpMenu_ControllerPublic_Help extends XFCP_HelpMenu_ControllerPublic_Help
{
 
public function actionAboutUs()
{
    return $this->_getWrapper('aboutUs', $this->responseView('XenForo_ViewPublic_Help_AboutUs', 'help_about_us')
);
}
 
public function actionImprint()
{
    return $this->_getWrapper('imprint', $this->responseView('XenForo_ViewPublic_Help_Imprint', 'help_imprint')
);
}
 
public function actionPrivacyPolicy()
{
    return $this->_getWrapper('privacyPolicy', $this->responseView('XenForo_ViewPublic_Help_PrivacyPolicy', 'help_privacy_policy')
);
}
 
public function actionStaff()
{
    return $this->_getWrapper('staff', $this->responseView('XenForo_ViewPublic_Help_Staff', 'help_staff')
);
}
 
public function actionNewbie()
{
    return $this->_getWrapper('newbie', $this->responseView('XenForo_ViewPublic_Help_Newbie', 'help_newbie')
);
}
 
}

Each of these sections of code control one page, being:
PHP:
public function actionNewbie()
{
    return $this->_getWrapper('newbie', $this->responseView('XenForo_ViewPublic_Help_Newbie', 'help_newbie')
);
}

These are what you copy and paste to the bottom each time, above the last closing curly brace }.

Keeping it nice and simple, you change the term to what you want it to be. The above example uses the "newbie" page. So lets create a page called "Frequently Asked Questions" and that is what you want the URL to be.

Our code we add above the last curly brace will look like this:
PHP:
public function actionFrequentlyAskedQuestions()
{
    return $this->_getWrapper('frequentlyAskedQuestions', $this->responseView('XenForo_ViewPublic_Help_FrequentlyAskedQuestions', 'help_frequently_asked_questions')
);
}
Keeping with XF naming conventions, I have used the full word throughout for ease. The first part "actionFrequentlyAskedQuestions" becomes the URL, dropping the "action". The second name is used within the help_wrapper template navigation for highlighting the link when the page is active, the third is XF stuff... the last is the template name.

You could make the template name shorter, ie. help_faq for ease. You could do the same with wrapper link... but if you want the page URL to be /help/frequently-asked-questions/ then you need to leave the other two how they are, and they match obviously.

Adding our new FAQ to the default Help.php file, it would look like the following:

PHP:
<?php
 
class HelpMenu_ControllerPublic_Help extends XFCP_HelpMenu_ControllerPublic_Help
{
 
public function actionAboutUs()
{
    return $this->_getWrapper('aboutUs', $this->responseView('XenForo_ViewPublic_Help_AboutUs', 'help_about_us')
);
}
 
public function actionImprint()
{
    return $this->_getWrapper('imprint', $this->responseView('XenForo_ViewPublic_Help_Imprint', 'help_imprint')
);
}
 
public function actionPrivacyPolicy()
{
    return $this->_getWrapper('privacyPolicy', $this->responseView('XenForo_ViewPublic_Help_PrivacyPolicy', 'help_privacy_policy')
);
}
 
public function actionStaff()
{
    return $this->_getWrapper('staff', $this->responseView('XenForo_ViewPublic_Help_Staff', 'help_staff')
);
}
 
public function actionNewbie()
{
    return $this->_getWrapper('newbie', $this->responseView('XenForo_ViewPublic_Help_Newbie', 'help_newbie')
);
}
 
public function actionFrequentlyAskedQuestions()
{
    return $this->_getWrapper('frequentlyAskedQuestions', $this->responseView('XenForo_ViewPublic_Help_FrequentlyAskedQuestions', 'help_frequently_asked_questions')
);
}
 
}

Save and close the Help.php file.

Create Template Named In Help.php

In your master template, or style if going that route, create a new template and name it exactly as you did in the Help.php, being help_frequently_asked_questions

You can paste in default code used in other pages if you choose, or create your own. Default is:
HTML:
<xen:require css="help_menu.css" />
 
<xen:title>My Page Title</xen:title>
<div class="messageText ugc baseHtml helpAbout">
<div class="helpAboutTitle">Delete this title if you don't want it… Copy it to reuse it in this page...</div>
<div class="content">
 
<p>All page content goes in-between the div content tags.</p>
 
</div>
</div>

Change the "My Page Title" to whatever you want the page title to show as, which will be reflected in both the browser and page heading.

If you want the links to show in the nav, wrapper and footer, then open those 3 templates listed in the first post, copy a list item and paste it alphabetically, or how you desire, changing the parameters. Both help_links_footer and help_links_nav are straight forward links, change the URL and the anchor title to be shown. The help_links_wrapper I will explain in more detail, so you ensure the active page link correctly highlights.

<li><a href="{xen:link 'help/frequently-asked-questions'}" class="{xen:if "{$selected} == 'frequentlyAskedQuestions'", 'secondaryContent', 'primaryContent'}">FAQ's</a></li>

The three red aspects are changed.

The first being the URL, which reflects directly from our .php action command, dropping the action, the rest becomes the URL. Technically, you could actually insert your hyphens anywhere or not at all, and the page will still render. Pretty straight forward across all 3 links templates.

The second was from our .php wrapper command, and it is case sensitive, so it must be exact as listed in:

return $this->_getWrapper('frequentlyAskedQuestions',

This will ensure that when /help/frequently-asked-questions help page is shown, it will correctly highlight the link as the active page.

The third is our anchor text, being our link title that will show. I figured writing "Frequently Asked Questions" is a little long as an anchor link, so FAQ's or such would no doubt be preferred.

If you want the option to enable or disable the link, like the defaults, then in debug mode, master style properties, Help Menu style properties page, create a new property, mimicking an existing one, obviously giving it a unique name, ie. helpMenuFaq, then insert that as a xen:if statement around the links and template code, just like the default five pages have.

Preview

As I said about the URL, you can hyphenate it or not, pretty much how you want it to look, at the point of inputting the href into the link templates. You can see it written with and without hyphens below, and both still render the same page.

Screen shot 2011-12-28 at 1.15.13 PM.webp Screen shot 2011-12-28 at 1.15.25 PM.webp

With the wrapper link, correctly highlighted:

Screen shot 2011-12-28 at 1.25.02 PM.webp
 
I bookmarked some threads that explained how to add additional custom pages to the help menu but it seemed to much of work and I wasn't sure at the time. Thanks Anthony for taking the time and simplify things(y)
 
Great job Anthony - your Help tab is the best I've ever seen - nice of you to share the joy.
I think if the Help Tab could be renamed (ideally the URLs as well) it could be great stuff.

The Help tab needs help.

Ideas: How about cleaning up the Help Tab ?
(1) get rid of the upper breadcrumb (hide it visually).
(2) have nothing in the subtab areas (it is 100% duplication).
(3) Get rid of the word help in a few places ?
(4) Style tweaks ?

Another great Help tab is DarkImmortal's (He renamed it Misc).
 
Sure, all of those things can be done, but that is not what this mod covers.

You can manually edit the navigation template and remove the default links, and hook... thus rendering all your points above done.
 
I especially like the ability to turn off individual pages using style properties settings .. this is super addon
 
I used this to make several additional pages. thank you. modifying it to add the pages was very straight forward. your directions were great.
 
Is there anyway you could add a System to create more Help Pages Automaticly, kind of like the way you post forum threads where the admin can Add Pages and just use the txt editor to create the content :P Cause for Newbs like me this is really confusing. :P
 
Is there anyway you could add a System to create more Help Pages Automaticly, kind of like the way you post forum threads where the admin can Add Pages and just use the txt editor to create the content :p Cause for Newbs like me this is really confusing. :p
Excellent idea.
Everyone wants this.
 
Status
Not open for further replies.
Top Bottom