How to add content to top header in nopCommerce

In this blog post, we will look into the steps to add any kind of content to the top header in nopCommerce.

 

Go to this location:

Views > Shared > Header.cshtml

Open “Header.cshtml” file and look for the code block below:

<div class="header">
    @Html.Widget("header")
    <div class="header-upper">
        <div class="header-selectors-wrapper">
             
            @Html.Action("TaxTypeSelector", "Common")
             
            @Html.Action("CurrencySelector", "Common")
             
            @Html.Action("LanguageSelector", "Common")
             
            @Html.Widget("header_selectors")
        </div>
        <div class="header-links-wrapper">
            @Html.Action("HeaderLinks", "Common")
            @Html.Action("FlyoutShoppingCart", "ShoppingCart")
        </div>
    </div>
    <div class="header-lower">
        <div class="header-logo">
            <a href="@Url.RouteUrl("HomePage")">
                <img title="" alt="@storeName" src="@Url.Content(logoPath)">
            </a>
        </div>
        <div class="search-box store-search-box">
            @Html.Action("SearchBox", "Catalog")
        </div>
    </div>
</div>

 

 

Now, we will add a test content line in the top header like this-

  <div class="header-upper">
 <div class="header-selectors-wrapper">
 
 @Html.Action("TaxTypeSelector", "Common")
 
 @Html.Action("CurrencySelector", "Common")
 
 @Html.Action("LanguageSelector", "Common")
 
 @Html.Widget("header_selectors")
 </div>
 <div>This is a test line</div>
 <div class="header-links-wrapper">
 @Html.Action("HeaderLinks", "Common")
 @Html.Action("FlyoutShoppingCart", "ShoppingCart")
 </div>
 </div>

 

On the public store you should see the result like this-

 

 Looking for quality nopCommerce Web Hosting? Look no further than Arvixe Web Hosting!

Tags: , , , , | Posted under nopCommerce | RSS 2.0

Author Spotlight

Lavish Kumar

Founder, developer and owner of StrivingProgrammers.com - By profession, he is a software programmer / web developer, web designer & DBA. He is passionate about technology and electronic gadgets. He enjoys writing tech articles and developing web applications. He is a nopCommerce MVP and author of official nopCommerce Designer's Guide.

2 Comments on How to add content to top header in nopCommerce

  1. IT world says:

    thanks for sharing it

Leave a Reply

Your email address will not be published. Required fields are marked *