From the 1.5 release onward there will be a series of basic examples which are intended as starting points for new mapbuilder applications. This tutorial explains how to remove the example layout from these examples so you end up with just the mapbuilder widgets in your page.
In the index.html of each demo there are lines explaining what the remove from the html file to get rid of all other items, without breaking the example.
Choose the example you want to start with, copy the directory and open the index.html file in your favourite editor.
There are 2 (simple and interactive mapviewer) or 3 (enhanced mapviewer) blocks of html you want to remove. Each block starts with:
and end with:
Where the numbers show which block you are removing. Just select everything between cut here and end cut and remove it, obviously you need to take the pairs with the same number. Once you have saved it, you can reopen that file in your browser and you will see the same example, only without the example layout.
Once you have removed all other code you can change the layout by editing the CSS file, which is located at ../../lib/skin/default/demoStyles.css. If you want to modify mapbuilder widgets you need to open config.xml and modify it to your needs. For more information have a look at the User Guide.