Edit MenuList output



Total EPiServer newbie here... I'm working on a site whose navigation menu needs to have each page name split over two lines. So while the actual page name could be "News and updates", I'd need to wrap everything after the first word in <span> tags to style that part with CSS, so the output would become "News <span>and updates</span>". From there, I'd make the span a block element on large screens but inline it in my responsive view.

Using the MainNavigation.aspx from the Alloy templates. My goal would probably be to loop through each menu item in the code behind file and pass the final <a> tag, containing the new name with <span> in it, to the view for output. Any ideas? I'm completely lost here. I can come up with the actual regex to wrap the correct words, I just need to find out how to actually edit the output of MenuList.

This is what I've got in my view:

<nav role="navigation">
	<div class="inner">
		<input type="checkbox" id="toggle-menu" />  
			<EPiServer:MenuList PageLink="<%# PageReference.StartPage %>" runat="server" ID="MainMenu">
                   			<li><EPiServer:Property PropertyName="PageLink" runat="server" /></li>
                    			<li><EPiServer:Property CssClass="current-page" PropertyName="PageLink" runat="server" /></li>


Nov 03, 2014 11:20
<p>To do that you would need to write the Html yourself instead of using the EPiServer:Property for the PageLink.</p> <p></p> <pre class="brush:html;auto-links:false;toolbar:false" contenteditable="false"> &lt;ItemTemplate&gt; &lt;li&gt; &lt;a href="&lt;%# Container.CurrentPage.LinkURL %&gt;"&gt; &lt;span class="foo"&gt;&lt;%# Container.CurrentPage.Property["PageName"].ToWebString()YourStringExtentionToGetFirstWordFromString() %&gt;&lt;/span&gt;&lt;span class="bar"&gt;ontainer.CurrentPage.Property["PageName"].ToWebString().YourStringExtentionToRemoveFirstWordFromString()&lt;/span&gt; &lt;/a&gt; &lt;/li&gt; &lt;/ItemTemplate&gt;</pre> <p></p>
Nov 03, 2014 18:54
This topic was created over six months ago and has been resolved. If you have a similar question, please create a new topic and refer to this one.
* You are NOT allowed to include any hyperlinks in the post because your account hasn't associated to your company. User profile should be updated.