The C1MenuExtender control supports using custom icons in the menu. You will use special markup to apply the icons to the C1MenuExtender control.

1. Create an ASP.NET Web application.
2. Add a standard Panel control to the main content of  your page.
3. Add the following markup within the <asp:Panel> tags to create a list that will become the menu.

<ul id="menu1">

                <li><a><span class="ui-icon ui-icon-arrowthick-1-w wijmo-wijmenu-icon-left"></span><span class="wijmo-wijmenu-text">

                    Menu1</span></a></li>

                <li><a><span class="ui-icon ui-icon-arrowrefresh-1-s wijmo-wijmenu-icon-left"></span><span class="wijmo-wijmenu-text">

                    Menu2</span></a>

                    <ul>

                        <li><a>submenu1</a></li>

                        <li><a>submenu2</a>

                            <ul>

                                <li><a>submenu21</a></li>

                                <li><a>submenu22</a></li>

                                <li><a>submenu23</a></li>

                                <li><a>submenu24</a></li>

                                <li><a>submenu25</a></li>

                            </ul>

                        </li>

                        <li><a>submenu3</a></li>

                        <li><a>submenu4</a>

                            <ul>

                                <li><a>submenu41</a></li>

                                <li><a>submenu42</a></li>

                                <li><a>submenu43</a></li>

                                <li><a>submenu44</a></li>

                                <li><a>submenu45</a></li>

                                <li><a>submenu46</a></li>

                                <li><a>submenu47</a></li>

                                <li><a>submenu48</a></li>

                            </ul>

                        </li>

                        <li><a>submenu5</a></li>

                        <li><a>submenu6</a></li>

                        <li><a>submenu7</a></li>

                        <li><a>submenu8</a></li>

                    </ul>

                </li>

                <li><a><span class="ui-icon ui-icon-comment wijmo-wijmenu-icon-left"></span><span class="wijmo-wijmenu-text">Menu3</span></a></li>

                <li><a><span class="ui-icon ui-icon-person wijmo-wijmenu-icon-left"></span><span class="wijmo-wijmenu-text">Menu4</span></a></li>

                <li><a><span class="ui-icon ui-icon-trash wijmo-wijmenu-icon-left"></span><span class="wijmo-wijmenu-text">Menu5</span></a></li>

                <li><a><span class="ui-icon ui-icon-bookmark wijmo-wijmenu-icon-left"></span><span class="wijmo-wijmenu-text">Menu6</span></a>

                    <ul>

                        <li><a>submenu61</a></li>

                        <li><a>submenu62</a></li>

                        <li><a>submenu63</a></li>

                        <li><a>submenu64</a></li>

                        <li><a>submenu65</a></li>

                        <li><a>submenu66</a></li>

                        <li><a>submenu67</a></li>

                        <li><a>submenu68</a></li>

                        <li><a>submenu69</a></li>

                    </ul>

                </li>

                <li><a><span class="ui-icon ui-icon-clock wijmo-wijmenu-icon-left"></span><span class="wijmo-wijmenu-text">Menu7</span></a></li>

                <li><a><span class="ui-icon ui-icon-minusthick wijmo-wijmenu-icon-left"></span><span class="wijmo-wijmenu-text">Menu8</span></a></li>

            </ul>

Click the Panel smart tag and select Add Extender from the Tasks menu.

4. In the Extender Wizard, select C1MenuExtender and click OK. A C1MenuExtender control is added to the page and the TargetControlID is set to Panel1.
5. Press F5 to run the application. Notice the custom icon next to each menu item.