How do I customize my menu in 3.5?

How do I add my own customized menu in nopcommerce 3.5?

Everything is different from 3.4 and I have no clue where to customize the menu where topics would normally be displayed across.  I want to add a few custom links that link to completely different websites than my application.  I was able to do this fine in 3.4 across that same space but now that the files and structure of 3.5 has changed, I can't seem to find out where to put my code nor what to put in it now.

Thanks

seabass450 wrote:

Are you meaning the main top menu? If so, I think you can just edit the following view to change the top menu in nopCommerce 3.5:

Presentation -> Nop.Web -> Views -> Catalog -> TopMenu.cshtml

Let me know if that's what you were looking for.

Where is the Presentation link?

Hello guys. Im new here, and I want to move business on nopcommerce. How I can do this from picture below?

I'm refering to that, I will try the method, thank you, Tim2376

CarpeDiem wrote:

Hi,

You can do it as following steps:

- Go to Admin > Configuration > Settings > All Settings (Advanced).

- Add a new setting with:
  + Key is "ShowDefaultMenuItems",
  + Value is "True"

- Copy the "TopMenu.cshtml" view to the "Themes/DefaultClean/Views/Catalog" folder.

- Modify this view:

  BEFORE

@model TopMenuModel
@using Nop.Core.Domain
@using Nop.Core.Infrastructure
@using Nop.Web.Models.Catalog;
@{
    var isRtl = this.ShouldUseRtlTheme();
    var supportResponsive = EngineContext.Current.Resolve<StoreInformationSettings>().ResponsiveDesignSupported;
}
@helper RenderCategoryLine(CategorySimpleModel category, int level, bool responsiveMobileMenu)
{
    <li>
        <a href="@Url.RouteUrl("Category", new { SeName = category.SeName })">@category.Name
        @if (category.NumberOfProducts.HasValue)
        {
            <text> </text>@T("Categories.TotalProducts", category.NumberOfProducts.Value)
        }
        </a>
        @{
            var levelClass = "";
            if (level == 0)
            {
                levelClass = "firstLevel";
                <div class="top-menu-triangle"></div>
            }
            if (category.SubCategories.Count > 0)
            {
                if (responsiveMobileMenu)
                {
                    <span class="expand">&nbsp;</span>
                }
                <ul class="sublist @levelClass">
                    @foreach (var subCategory in  category.SubCategories)
                    {
                        @RenderCategoryLine(subCategory, level + 1, responsiveMobileMenu)
                    }
                </ul>
            }
        }
    </li>
}

<ul class="top-menu">
    @Html.Widget("header_menu_before")

    @foreach (var category in Model.Categories)
    {
        @RenderCategoryLine(category, 0, false)
    }
    @foreach (var topic in Model.Topics)
    {
        <li><a href="@Url.RouteUrl("Topic", new { SeName = topic.SeName })">@topic.Name</a></li>
    }
    @if (Model.Categories.Count == 0 && Model.Topics.Count == 0)
    {
        //no categories or topis to display? in this case let's diplay some default menu items (should we?)
        <li><a href="@Url.RouteUrl("HomePage")">@T("HomePage")</a></li>
        if (Model.RecentlyAddedProductsEnabled)
        {
            <li><a href="@Url.RouteUrl("RecentlyAddedProducts")">@T("Products.NewProducts")</a>
            </li>
        }
        <li><a href="@Url.RouteUrl("ProductSearch")">@T("Search")</a> </li>
        <li><a href="@Url.RouteUrl("CustomerInfo")">@T("Account.MyAccount")</a></li>
        if (Model.BlogEnabled)
        {
            <li><a href="@Url.RouteUrl("Blog")">@T("Blog")</a></li>
        }
        if (Model.ForumEnabled)
        {
            <li><a href="@Url.RouteUrl("Boards")">@T("Forum.Forums")</a></li>
        }
        <li><a href="@Url.RouteUrl("ContactUs")">@T("ContactUs")</a></li>
    }
    @Html.Widget("header_menu_after")
</ul>

  AFTER

@model TopMenuModel
@using Nop.Core.Domain
@using Nop.Core.Infrastructure
@using Nop.Services.Configuration
@using Nop.Web.Models.Catalog
@{
    var engineContext = EngineContext.Current;
    var settingService = engineContext.Resolve<ISettingService>();
    var storeInformationSettings = engineContext.Resolve<StoreInformationSettings>();

    var supportResponsive = storeInformationSettings.ResponsiveDesignSupported;
    var isRtl = this.ShouldUseRtlTheme();

    var showDefaultMenuItems = settingService.GetSettingByKey<bool>("ShowDefaultMenuItems");
}
@helper RenderCategoryLine(CategorySimpleModel category, int level, bool responsiveMobileMenu)
{
    <li>
        <a href="@Url.RouteUrl("Category", new { SeName = category.SeName })">@category.Name
        @if (category.NumberOfProducts.HasValue)
        {
            <text> </text>@T("Categories.TotalProducts", category.NumberOfProducts.Value)
        }
        </a>
        @{
            var levelClass = "";
            if (level == 0)
            {
                levelClass = "firstLevel";
                <div class="top-menu-triangle"></div>
            }
            if (category.SubCategories.Count > 0)
            {
                if (responsiveMobileMenu)
                {
                    <span class="expand">&nbsp;</span>
                }
                <ul class="sublist @levelClass">
                    @foreach (var subCategory in  category.SubCategories)
                    {
                        @RenderCategoryLine(subCategory, level + 1, responsiveMobileMenu)
                    }
                </ul>
            }
        }
    </li>
}

<ul class="top-menu">
    @Html.Widget("header_menu_before")
    @if (!showDefaultMenuItems)
    {
        foreach (var category in Model.Categories)
        {
            RenderCategoryLine(category, 0, false);
        }
    }

    @if (showDefaultMenuItems || (Model.Categories.Count == 0 && Model.Topics.Count == 0))
    {
        //no categories or topis to display? in this case let's diplay some default menu items (should we?)
        <li><a href="@Url.RouteUrl("HomePage")">@T("HomePage")</a></li>
        if (Model.RecentlyAddedProductsEnabled)
        {
            <li><a href="@Url.RouteUrl("RecentlyAddedProducts")">@T("Products.NewProducts")</a>
            </li>
        }
        <li><a href="@Url.RouteUrl("ProductSearch")">@T("Search")</a> </li>
        <li><a href="@Url.RouteUrl("CustomerInfo")">@T("Account.MyAccount")</a></li>
        if (Model.BlogEnabled)
        {
            <li><a href="@Url.RouteUrl("Blog")">@T("Blog")</a></li>
        }
        if (Model.ForumEnabled)
        {
            <li><a href="@Url.RouteUrl("Boards")">@T("Forum.Forums")</a></li>
        }
        <li><a href="@Url.RouteUrl("ContactUs")">@T("ContactUs")</a></li>
    }

    @foreach (var topic in Model.Topics)
    {
        <li><a href="@Url.RouteUrl("Topic", new { SeName = topic.SeName })">@topic.Name</a></li>
    }

    @Html.Widget("header_menu_after")
</ul>

Hope this help :)

ima9ines wrote:

Bro I can say that you are nopaholic!
Something on English pls :D
For this I will need a day lol

Edit: Ok I done all what you wrote, but I dont need search and new products in top menu. Thats not big deal, but I lost categories menu on mobile platform. I cant find categories anymore.



mobile

Hi,

Following is update for mobile mode (the text with bold underline are update)

BEFORE EDIT
=========

@if (supportResponsive)
{
    <div id="mob-menu-button">
        <a href="">
            <span class="icon"><span class="line"></span><span class="line"></span><span class="line"></span></span>
            @{
                var responsiveMenuTitle = Model.Categories.Count > 0 ? T("Categories") : T("Menu");
            }
            <span>@responsiveMenuTitle</span>
        </a>
    </div>
    <ul class="mob-top-menu">
        @Html.Widget("mob_header_menu_before")
        @foreach (var category in Model.Categories)
        {
            @RenderCategoryLine(category, 0, true)
        }
        @foreach (var topic in Model.Topics)
        {
            <li><a href="@Url.RouteUrl("Topic", new { SeName = topic.SeName })">@topic.Name</a></li>
        }
        @if (Model.Categories.Count == 0 && Model.Topics.Count == 0)
        {
            //no categories  or topis to display? in this case let's diplay some default menu items (should we?)
            <li><a href="@Url.RouteUrl("HomePage")">@T("HomePage")</a></li>
            if (Model.RecentlyAddedProductsEnabled)
            {
                <li>
                    <a href="@Url.RouteUrl("RecentlyAddedProducts")">@T("Products.NewProducts")</a>
                </li>
            }
            <li><a href="@Url.RouteUrl("ProductSearch")">@T("Search")</a> </li>
            <li><a href="@Url.RouteUrl("CustomerInfo")">@T("Account.MyAccount")</a></li>
            if (Model.BlogEnabled)
            {
                <li><a href="@Url.RouteUrl("Blog")">@T("Blog")</a></li>
            }
            if (Model.ForumEnabled)
            {
                <li><a href="@Url.RouteUrl("Boards")">@T("Forum.Forums")</a></li>
            }
            <li><a href="@Url.RouteUrl("ContactUs")">@T("ContactUs")</a></li>
        }
        @Html.Widget("mob_header_menu_after")
    </ul>

AFTER EDIT
=========

@if (supportResponsive)
{
    <div id="mob-menu-button">
        <a href="">
            <span class="icon"><span class="line"></span><span class="line"></span><span class="line"></span></span>
            @{
                var responsiveMenuTitle = Model.Categories.Count > 0 ? T("Categories") : T("Menu");
                if (showDefaultMenuItems)
                {
                    responsiveMenuTitle = T("Menu");
                }
            }
            <span>@responsiveMenuTitle</span>
        </a>
    </div>
    <ul class="mob-top-menu">
        @Html.Widget("mob_header_menu_before")
        @if (!showDefaultMenuItems)
        {
            foreach (var category in Model.Categories)
            {
                @RenderCategoryLine(category, 0, true)
            }
        }

        @if (showDefaultMenuItems || (Model.Categories.Count == 0 && Model.Topics.Count == 0))
        {
            //no categories  or topis to display? in this case let's diplay some default menu items (should we?)
            <li><a href="@Url.RouteUrl("HomePage")">@T("HomePage")</a></li>
            if (Model.RecentlyAddedProductsEnabled)
            {
                <li>
                    <a href="@Url.RouteUrl("RecentlyAddedProducts")">@T("Products.NewProducts")</a>
                </li>
            }
            <li><a href="@Url.RouteUrl("ProductSearch")">@T("Search")</a> </li>
            <li><a href="@Url.RouteUrl("CustomerInfo")">@T("Account.MyAccount")</a></li>
            if (Model.BlogEnabled)
            {
                <li><a href="@Url.RouteUrl("Blog")">@T("Blog")</a></li>
            }
            if (Model.ForumEnabled)
            {
                <li><a href="@Url.RouteUrl("Boards")">@T("Forum.Forums")</a></li>
            }
            <li><a href="@Url.RouteUrl("ContactUs")">@T("ContactUs")</a></li>
        }
        
        @foreach (var topic in Model.Topics)
        {
            <li><a href="@Url.RouteUrl("Topic", new { SeName = topic.SeName })">@topic.Name</a></li>
        }
        @Html.Widget("mob_header_menu_after")
    </ul>

Hope this help :)

ima9ines wrote:

Bro, for web you said to change it in file TopMenu.cshtml but you didnt said for mob in which file to change it? :(

Hi, it is the same file :)