• <div class="body"> <ul class="navbar"> <li><a href="http://www.jiffycms.net">Home page</a></li> <li><a href="#">Musings</a></li> <li><a href="#">My town</a></li> <li><a href="#">Links</a></li> </ul> <!-- Main content --> <h1> My very first home page</h1> <p> Hello World!</p> <p> It lacks images, but at least it has style. And it has links, even if they don't go anywhere&hellip;</p> <p> There should be more here, but I don't know what yet. mm perhaps lorem Ipsum? :-)</p> <ul> <li>Aliquam sit amet erat non neque hendrerit porta.</li> <li>Pellentesque facilisis dictum urna, sed ultricies enim dignissim sit amet.</li> <li>Praesent viverra velit sit amet velit volutpat sed volutpat magna mollis.</li> <li>Aliquam ultricies augue non urna cursus id dapibus est laoreet.</li> <li>Sed luctus hendrerit ligula, a tincidunt nisl mollis id.</li> <li>Pellentesque hendrerit consequat sapien, id posuere felis sollicitudin nec.</li> <li>Fusce et elit sit amet justo pharetra molestie.</li> </ul> <dl> <dt>Definition list</dt> <dd> Etiam commodo iaculis tincidunt. Etiam dignissim quam id diam posuere mollis. Praesent vulputate tortor arcu. Cras sed leo enim, vitae venenatis felis.</dd> <dt>Lorem ipsum dolor sit amet</dt> <dd> Vestibulum quis nulla id odio faucibus feugiat a non nibh. Incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</dd> </dl> <address> Made 18 November 2009<br /> by <b>myself</b>.</address> </div>

Note the brand new toolbarset above containing a single ToolbarItem (horizontal rule).

This was created declaratively. To achieve this, first we want to try and serialize all the defaults into the page. This can be done by selecting this option from the smart menu. Reference screen shot below :

Then simply use the toolbar collections editor in designview

<cc1:ToolBarSet>
                    <Items>
                        <cc1:ToolBarItem Command="inserthr" Icon="~/Toolbar-Items/hr.gif" 
                            ToolTip="Add a horizontal line." />
                    </Items>
                    <ToolBarItemStyle BorderColor="#EEEEEE" BorderStyle="Solid" BorderWidth="1px" 
                        CssFloat="Left" Cursor="Pointer" Display="Block" Height="22px" 
                        MarginBottom="1px" MarginTop="1px" Width="24px" />
                    <ToolBarStyle BackColor="#DADCDC" BackgroundPositionX="1px" 
                        BackgroundPositionY="1px" BackgroundRepeat="Repeat" BorderColor="#646464" 
                        BorderStyle="Outset" BorderWidth="1px" CssFloat="Left" Height="26px" 
                        MarginBottom="2px" MarginLeft="2px" MarginRight="5px" MarginTop="2px" />
                </cc1:ToolBarSet>

After this, simply keep the items of interest to you. In this case, we want all the default settings for the toolbaritems. Everything else is irrelevant and can be removed. Then turn off the serialization since we don't require it anymore and proceed to adding your custom toolbarset declaratively. Follow the highlighted code below :

Toggle (declarative syntax and remarks);