Extending the global menu - generating the required scripts for E

Extending the global menu - generating the required scripts for EPiServer look and feel

Anders Murel

Vote:

Hi,

I'm extending the global menu in EPiServer 7 and would like the plugin to have the EPiServer look and feel.

In the old days (.aspx) we used:

<%= Page.ClientResources("ShellCore") %>
<%= Page.ClientResources("ShellWidgets") %>
<%= Page.ClientResources("ShellCoreLightTheme") %>
<%= Page.ClientResources("ShellWidgetsLightTheme")%>
<%= Page.ClientResources("Navigation") %>

Which generated the needed scripts for the look and feel of EPiServer like this:

<link rel="stylesheet" type="text/css" href="/EPiServer/Shell/2.1.90/ClientResources/epi/themes/legacy/ShellCore.css" />
<script type="text/javascript" src="/EPiServer/Shell/2.1.90/ClientResources/ShellCore.js"></script>
<link rel="stylesheet" type="text/css" href="/EPiServer/Shell/2.1.90/ClientResources/epi/themes/legacy/ShellWidgets.css" />
<script type="text/javascript" src="/EPiServer/Shell/2.1.90/ClientResources/ShellWidgets.js"></script>
<link rel="stylesheet" type="text/css" href="/EPiServer/Shell/2.1.90/ClientResources/epi/themes/legacy/ShellCoreLightTheme.css" />
<link rel="stylesheet" type="text/css" href="/EPiServer/Shell/2.1.90/ClientResources/epi/themes/legacy/ShellWidgetsLightTheme.css" />

Does anyone know hos to accomplish this when using MVC Razor? (.cshtml)

I have tried this:

@Html.Raw(Html.ShellScriptResource("ShellCore"))
@Html.Raw(Html.ShellScriptResource("ShellWidgets"))
@Html.Raw(Html.ShellScriptResource("ShellCoreLightTheme"))
@Html.Raw(Html.ShellScriptResource("ShellWidgetsLightTheme"))
@Html.Raw(Html.ShellScriptResource("Navigation"))

But this is not quite correct:

<script src="/EPiServer/Shell/2.1.90/ShellCore" type="text/javascript"></script>
<script src="/EPiServer/Shell/2.1.90/ShellWidgets" type="text/javascript"></script>
<script src="/EPiServer/Shell/2.1.90/ShellCoreLightTheme" type="text/javascript"></script>
<script src="/EPiServer/Shell/2.1.90/ShellWidgetsLightTheme" type="text/javascript"></script>
<script src="/EPiServer/Shell/2.1.90/Navigation" type="text/javascript"></script>

So, in short, the question is: Whats the equivalent for Page.ClientResources("ShellCore") when using MVC and Razor?

#76858

Nov 05, 2013 7:38

Vote:

Try using:

@Html.Raw(ClientResources.RenderResources("ShellCore"))

#76866

Nov 05, 2013 10:57

Sergii Vorushylo

Vote:

This should work:

@using EPiServer.Framework.Web.Resources
...
@Html.Raw(ClientResources.RenderResources("ShellCore"))
@Html.Raw(ClientResources.RenderResources("ShellWidgets"))
@Html.Raw(ClientResources.RenderResources("ShellCoreLightTheme"))
@Html.Raw(ClientResources.RenderResources("ShellWidgetsLightTheme"))
@Html.Raw(ClientResources.RenderResources("Navigation"))
...
@Html.Raw(Html.GlobalMenu())

#76867

Nov 05, 2013 11:04

Roy Gonzalez

Vote:

Hi this code only show the fix menu, i want to collapse and extend

like this one

<>div id="globalMenuContainer" class="epi-navigation-container epi-navigationContainer" widgetid="globalMenuContainer">
       <>div data-dojo-attach-point="accordionNode" class="epi-navigation-accordioncontainer" style="height: 0px;">
           <>div data-dojo-attach-point="containerNode" class="dijitHidden" style="position:absolute; bottom:0; left:0; width:100%">
               <>div class="epi-navigation-container-root">
                   
                   @Html.Raw(Html.GlobalMenu())
               div><>div class="epi-navigation-delimiter">div>
 
           div>
       div>
       <>div data-dojo-attach-point="expandCollapseContainer" class="epi-navigation-expandcollapseContainer">
           <>a data-dojo-attach-point="expandCollapseButton" href="javascript:void(0)" class="epi-navigation-expandcollapseBtn" tabindex="0"><>span class="epi-navigation-expandcollapseIcon">span>a>
       div>
   div>


But the problem is that i don't know how to load the dojo library, it is not working for me


Do you know if there are some reference that explain better the part of the Episerver Styles and Epi and dojo register libraries.

Regards

#90603

Sep 14, 2014 23:40

Søren Raarup

Vote:

https://blog.mathiaskunto.com/2015/01/20/getting-episervers-global-menu-to-work-on-your-own-pages/

https://blog.mathiaskunto.com/2015/01/21/adding-items-to-episervers-global-menu-in-editadmin-mode/

#120097

Edited, Apr 10, 2015 9:30

Try our conversational search powered by Generative AI!

Extending the global menu - generating the required scripts for EPiServer look and feel