This is a screenshot of facebook fanpage minisite. It is placed on a static FBML tab. You can add image gallery, contact forms and many other features to this tab site.
To make a mini-site on the static FBML tab of your fanpage page you can use this basic code
<!-- navigation elements -->
<a href="#" clicktoshow="nav1" clicktohide="nav2,nav3,nav4">Home</a>
<a href="#" clicktoshow="nav2" clicktohide="nav1,nav3,nav4">Specials</a>
<a href="#" clicktoshow="nav3" clicktohide="nav1,nav2,nav4">Locations</a>
<a href="#" clicktoshow="nav4" clicktohide="nav1,nav2,nav3">About</a>
<!-- Content to display when user clicks on the Home tab -->
<div id="nav1">
Homepage text
</div>
<!-- Content to display when user clicks on the Specials tab -->
<div id="nav2" style="display: none;">
Specials text
</div>
<!-- Content to display when user clicks on the Locations tab -->
<div id="nav3" style="display: none;">
Locations text
</div>
<!-- Content to display when user clicks on the About tab -->
<div id="nav4" style="display: none;">
About text
</div>
This is just the basic code to make such a site. By adding a style sheet it can be made better.
Here is an example style sheet to make the menu tabs.
<style type="text/css">
#body
{
background-color:yellowGREEN;
}
#coolmenu{
margin: 0;
padding: 12px 0 12px 0;
}
#coolmenu a{
text-decoration: none;
font-weight: none;
background:black;
color: silver;
padding:8px 10px;
margin: 0 1px;
}
html>body #coolmenu a{ /*Non IE rule*/
width: auto;
}
#coolmenu a:hover{
background-color:brown;
color: white;
}
</style>
Internet explorer doesn't support <style type="text/css"> so you may need to add external stylesheet like this
<link ref="stylesheet" type="text/css" href="http://yourdomain.com/style.css" />
Some other screenshots
A contact form embedded on fanpage
A popup dialog box
A Like to reveal page
Video Tab