Showing posts with label design. Show all posts
Showing posts with label design. Show all posts
Tuesday, April 26, 2011
Create Comics Online For Free
Friday, March 25, 2011
Mini Site On Facebook Fanpage
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
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.
Internet explorer doesn't support <style type="text/css"> so you may need to add external stylesheet like this

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
Monday, November 1, 2010
Subscribe to:
Posts (Atom)