Add custom pages and tab menu

[George G Halstead]

How can i add custom pages with a working side menu ? Want to be able to make staff, news and various other pages.

 

[Floris]

Click on the show sibbling/child nodes?

 

[Andrea Marucci]

Sorry but I've not understood. I would like to create pages like your Product & services but I've not understood how...

 

[Floris]

I will create a video for you with a walkthrough

 

[Floris]

It is being processed by Vimeo, so try again in a bit

Original quality and full size alternative: http://dl.dropbox.com/u/693961/xenfans_node_page.mov

 

[Andrea Marucci]

Wow, thanks, now I've understood how to create a page like that one. The only step I miss is how to create a menu like Product & Services. I've seen that you've defined it as a page and so do I but it does not appear in the menu bar.

 

[Floris]

Like I said, the menu bar is handled by a plugin I wrote, but .. basically you can extend the template 'navigation'

 

[Andrea Marucci]

Read about the plugin in this forum and read that is only for a prerelease of XF. I'll wait for the release for 1.0

 

[Andrea Marucci]

Floris can I guess that now that your board is updated to 1.0 I can use your plugin to create menu like your Product & Service?

 

[Floris]

Floris can I guess that now that your board is updated to 1.0 I can use your plugin to create menu like your Product & Service?

I have no time to create this as an addon at this point. Until it's done you could open navigator template, copy existing code, and rewrite it to say what you need.

 

[Floris]

		<!-- yourstuff -->
			<li class="navTab yourstuff {xen:if $tabs.yourstuff.selected, 'selected', 'Popup PopupControl PopupClosed'}">
				<a href="{$tabs.yourstuff.href}" class="navLink">{$tabs.yourstuff.title}</a>
				<a href="{$tabs.yourstuff.href}" class="SplitCtrl" rel="Menu"></a>
				<div class="{xen:if {$tabs.yourstuff.selected}, 'tabLinks', 'Menu JsOnly tabMenu'}">
					<div class="primaryContent menuHeader">
						<h3>{$tabs.yourstuff.title}</h3>
						<div class="muted">{xen:phrase quick_links}</div>
					</div>
					<ul class="secondaryContent blockLinksList">

						<li><a href="#">link1here</a></li>
						<li><a href="#">link2here</a></li>
						<li><a href="#">link3here</a></li>

					</ul>
				</div>
			</li>

 

[Andrea Marucci]

Put this after

<xen:else />
                <li class="navTab {xen:if $extraTab.selected, 'selected', 'PopupClosed'}">
                    <a href="{$extraTab.href}" class="navLink">{$extraTab.title}</a>
                    <xen:if is="{$extraTab.selected}"><div class="tabLinks"></div></xen:if>
                </li>
            </xen:if>
        </xen:foreach>
        </xen:if>

So that now is

<xen:else />
                <li class="navTab {xen:if $extraTab.selected, 'selected', 'PopupClosed'}">
                    <a href="{$extraTab.href}" class="navLink">{$extraTab.title}</a>
                    <xen:if is="{$extraTab.selected}"><div class="tabLinks"></div></xen:if>
                </li>
            </xen:if>
        </xen:foreach>
        </xen:if>

        <!-- test sistema di menu -->
            <li class="navTab yourstuff {xen:if $tabs.yourstuff.selected, 'selected', 'Popup PopupControl PopupClosed'}">
                <a href="{$tabs.yourstuff.href}" class="navLink">{$tabs.yourstuff.title}</a>
                <a href="{$tabs.yourstuff.href}" class="SplitCtrl" rel="Menu"></a>
                <div class="{xen:if {$tabs.yourstuff.selected}, 'tabLinks', 'Menu JsOnly tabMenu'}">
                    <div class="primaryContent menuHeader">
                        <h3>{$tabs.yourstuff.title}</h3>
                        <div class="muted">{xen:phrase quick_links}</div>
                    </div>
                    <ul class="secondaryContent blockLinksList">

                        <li><a href="#">link1here</a></li>
                        <li><a href="#">link2here</a></li>
                        <li><a href="#">link3here</a></li>

                    </ul>
                </div>
            </li>
                <!-- fine test sistema di menu -->

but nothing appear at the end of the menu...

 

[Andrea Marucci]

That's the correct code

        <!-- yourstuff -->
            <li class="navTab yourstuff {xen:if $tabs.yourstuff.selected, 'selected', 'Popup PopupControl PopupClosed'}">

                <a href="#" class="navLink">Titolo menu</a>
                <a href="#" class="SplitCtrl" rel="Menu"></a>

                <div class="{xen:if {$tabs.yourstuff.selected}, 'tabLinks', 'Menu JsOnly tabMenu'}">
                    <div class="primaryContent menuHeader">
                        <h3>Titolo Menu</h3>
                        <div class="muted">Sottotitolo</div>
                    </div>
                    <ul class="secondaryContent blockLinksList">
                    <xen:hook name="navigation_tabs_yourstuff">
                        <li><a href="#">link1here</a></li>
                        <li><a href="#">link2here</a></li>
                        <li><a href="#">link3here</a></li>
                    </xen:hook>
                    </ul>
                </div>
            </li>