Products

Solutions

Resources

Partners

Community

About

New Community Website

Ordinarily, you'd be at the right spot, but we've recently launched a brand new community website... For the community, by the community.

Yay... Take Me to the Community!

Welcome to the DNN Community Forums, your preferred source of online community support for all things related to DNN.
In order to participate you must be a registered DNNizen

HomeHomeUsing DNN Platf...Using DNN Platf...Skins, Themes, ...Skins, Themes, ...Menu tokens for bootstrap responsive skinMenu tokens for bootstrap responsive skin
Previous
 
Next
New Post
12/19/2012 12:07 PM
 
Hi.
I developed skin based on bootstrap templates
I want create responsive menu to can any body help me to achieve
I want implement similar menu in dnn
Thanks in advance
 
New Post
12/20/2012 2:48 AM
 

HI

 here is a ddrmenu xslt template to create a standard bootstrap one level dropdown menu

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html"/>
<xsl:template match="/*">
<xsl:apply-templates select="root" />
</xsl:template>
<xsl:template match="root">
<ul class="nav">
<xsl:apply-templates select="node">
<xsl:with-param name="level" select="0"/>
</xsl:apply-templates>
</ul>
</xsl:template>
<xsl:template match="node">
<xsl:param name="level" />
<xsl:choose>
<xsl:when test="$level=0">
<li>
<xsl:attribute name="class">
<xsl:if test="@breadcrumb = 1">active</xsl:if>
<xsl:if test="node">
<xsl:text>&#32;dropdown</xsl:text>
</xsl:if>
</xsl:attribute>

<xsl:choose>
<xsl:when test="@enabled = 1">
<a href="{@url}">
<xsl:attribute name="class">
<xsl:if test="node">
<xsl:text>dropdown-toggle</xsl:text>
</xsl:if>
</xsl:attribute>
<xsl:if test="node">
<xsl:attribute name="data-toggle">dropdown</xsl:attribute>
</xsl:if>
<xsl:value-of select="@text" />
<xsl:if test="node">
<strong class="caret"></strong>
</xsl:if>
</a>
</xsl:when>
<xsl:otherwise>
<xsl:value-of select="@text" />
</xsl:otherwise>
</xsl:choose>
<xsl:if test="node">
<ul class="dropdown-menu">
<xsl:apply-templates select="node">
<xsl:with-param name="level" select="$level + 1" />
</xsl:apply-templates>
</ul>
</xsl:if>
</li>

</xsl:when>

<xsl:otherwise>
<li>
<xsl:attribute name="class">
<xsl:if test="@breadcrumb = 1">active</xsl:if>
<xsl:if test="node">
<xsl:text>&#32;dropdown</xsl:text>
</xsl:if>
</xsl:attribute>

<xsl:choose>
<xsl:when test="@enabled = 1">
<a href="{@url}">

<xsl:value-of select="@text" />

</a>
</xsl:when>
<xsl:otherwise>
<xsl:value-of select="@text" />
</xsl:otherwise>
</xsl:choose>

</li>
<xsl:if test="node">
<!--
<xsl:apply-templates select="node">
<xsl:with-param name="level" select="$level + 1" />
</xsl:apply-templates>-->

</xsl:if>

</xsl:otherwise>

</xsl:choose>


</xsl:template>
</xsl:stylesheet>

 
New Post
12/20/2012 5:10 AM
 

hi Armand ,

Thanks for your support i have use the xslt in my skin but i am not getting the dropdown menu style.
i have added  page(Test) and disabled it in setting so that if the user click it will not navigate  and
i have added another page (Testmenu) as child of Test but it is not showing in the dropdown 
i dont have much knowledge in ddrmenu 


 
New Post
12/20/2012 3:35 PM
 
I have tried this using a Razor template. Including unlimited depth.

It should work, but I ran into this issue: http://www.dotnetnuke.com/Resources/F...

I hope this gets fixed soon.

Here is the razor template (note that DDRMenu doesn't work with Razor in DNN 7 RC (when I last checked)):

@using DotNetNuke.Web.DDRMenu;
@{ var root = Page.Source.root; }

@helper RenderMenu(IList nodes) {
if (nodes.Count > 0) {
@nodes[0].Text

    @foreach (var node in nodes) {
    if (node.Children.Count > 0) {

    } else {
    @RenderMenuItem(node)
    }
    }

}
}

@helper RenderMenuItem(MenuNode node) {
var cssClasses = new List();
// if (node.First) { cssClasses.Add("first"); }
// if (node.Last) { cssClasses.Add("last"); }
if (node.Selected) { cssClasses.Add("active"); }
var classString = new HtmlString((cssClasses.Count == 0) ? "" : (" class=\"" + String.Join(" ", cssClasses.ToArray()) + "\""));

  • @node.Text

  • }

    @RenderMenu(root.Children)
     
    New Post
    12/20/2012 8:58 PM
     
    Please take a look at the menu style of our website sunblognuke.com and check out whether it is what you you need. Then I will share you how to apply it with Bootstrap framework. Thanks.

    sunblognuke v5 for dnn

    Ultimate Blogging Module for DotNetNuke Platform
    The professional provider of DotNetNuke support, skin design and custom module development.

     
    Previous
     
    Next
    HomeHomeUsing DNN Platf...Using DNN Platf...Skins, Themes, ...Skins, Themes, ...Menu tokens for bootstrap responsive skinMenu tokens for bootstrap responsive skin


    These Forums are dedicated to discussion of DNN Platform and Evoq Solutions.

    For the benefit of the community and to protect the integrity of the ecosystem, please observe the following posting guidelines:

    1. No Advertising. This includes promotion of commercial and non-commercial products or services which are not directly related to DNN.
    2. No vendor trolling / poaching. If someone posts about a vendor issue, allow the vendor or other customers to respond. Any post that looks like trolling / poaching will be removed.
    3. Discussion or promotion of DNN Platform product releases under a different brand name are strictly prohibited.
    4. No Flaming or Trolling.
    5. No Profanity, Racism, or Prejudice.
    6. Site Moderators have the final word on approving / removing a thread or post or comment.
    7. English language posting only, please.
    What is Liquid Content?
    Find Out
    What is Liquid Content?
    Find Out
    What is Liquid Content?
    Find Out