Create XF Page But Style It Like "Help" Page

[TheBigK]

I'm planning to create a XenForo page (using the inbuilt pages functionality), but I wish to style it like the 'Help Page' -> http://xenforo.com/community/help/

I wish to use it to add tutorials & guides for our forums members. Is it possible? If yes, how?

 

[Paul B]

Copy the CSS from the help_wrapper.css template and the layout from the help_index and help_wrapper templates.

Or use this add-on: http://xenforo.com/community/resources/help-menu-additional-pages.76/

 

[TheBigK]

Copy the CSS from the help_wrapper.css template and the layout from the help_index and help_wrapper templates.

Or use this add-on: http://xenforo.com/community/resources/help-menu-additional-pages.76/

Umm, Okay, I'm going to give it a try; but it already looks like a technical thing to me.

The add-on adds pages to help. I want to create several such pages; each following the style of help page.

 

[Rob]

Umm, Okay, I'm going to give it a try; but it already looks like a technical thing to me.

The add-on adds pages to help. I want to create several such pages; each following the style of help page.

I think the add-on is definitely for you then

 

[TheBigK]

I think the add-on is definitely for you then

Yep, but that add on lets me extend the help section. Am I right?

What if I want to create multiple XF pages that look like the help section?

Here's my attempt, I'll appreciate if someone can tell me what I'm doing wrong -

I put the following in 'Template HTML' section of "Page Options" tab while create a new page:-

<xen:require css="help_wrapper.css" />
 
<div class="container">
    <div class="helpSideBar">
        <ul>
            <li class="section"><h4 class="heading">{xen:phrase help}</h4>
                <ul>
                    <xen:hook name="help_sidebar_links">
                    <li><a href="{xen:link pages/testpage}" class="{xen:if "{$selected} == 'smilies'", 'secondaryContent', 'primaryContent'}">{xen:phrase smilies}</a></li>
                    <!-- slot: pre_bb_codes -->
                    <li><a href="{xen:link help/bb-codes}" class="{xen:if "{$selected} == 'bbCodes'", 'secondaryContent', 'primaryContent'}">{xen:phrase bb_codes}</a></li>
                    <!-- slot: pre_trophies -->
                    <li><a href="{xen:link help/trophies}" class="{xen:if "{$selected} == 'trophies'", 'secondaryContent', 'primaryContent'}">{xen:phrase trophies}</a></li>
                    <!-- slot: pre_tos_url -->
                    <xen:if is="{$tosUrl}">
                        <li><a href="{$tosUrl}" class="{xen:if "{$selected} == 'terms'", 'secondaryContent', 'primaryContent'}">{xen:phrase terms_and_rules}</a></li>
                    </xen:if>
                    </xen:hook>
                </ul>
            </li>
        </ul>
    </div>
   
    <div class="helpContent section sectionMain">{xen:raw $_subView}
 
 
<xen:title>{xen:phrase help}</xen:title>
 
<div class="baseHtml">
    <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>
 
 
 
 
 
</div>
</div>

This replicates the help page on my new XF page. Am I doing it right?

 

[Rob]

If it replicated the help page, then I'd say you are going in the right direction. Take a look at the template... then look at how the page displays. You should be able to work out what to change and where by following it through the code.

Hope this helps,

Rob

 

[TheBigK]

Quick Question: Do the sub-menus that appear in the Help Page point to 'new pages'?

Doh, someone code an add-on,please!

 

[Paul B]

The Help page is separate from Page nodes - it has a different route.

I coded my own Help pages add-on for my own purposes, but I also use Page nodes for other uses.

 

[Infuscu]

Quick Question: Do the sub-menus that appear in the Help Page point to 'new pages'?

Doh, someone code an add-on,please!

Yea, an addon doing that would be wonderful