How To Create Horizontal Drop Down Menu at the Bottom Header

Well time for me to share the experience again by creating a Menu Horizontal Drop Down Under Header, actually the same as a horizontal menu which I have earlier post, just his style horizontal menu of the different course.
Okay Kia immediately wrote. 


  1. Login to page Dashboar> Layout> Edit HTML.
  2. Do not Forget to 'Download Full Template' to anticipate the event of an error on your favorite template.
  3. Copy the code below and paste it just above the code  ]]></b:skin>

#catmenucontainer{
height:33px;
width:1000px;
margin:0 auto;
background:url(http://4.bp.blogspot.com/_4HKUHirY_2U/S6mTqAdkycI/AAAAAAAAA2E/zxCSk-6MwLI/catmenu.jpg) repeat-x;
display:block;
padding:0px 0 0px 0px;
font-size:12px;
font-family:"Segoe UI",Calibri,"Myriad Pro",Myriad,"Trebuchet MS",Helvetica,Arial,sans-serif;
font-weight:normal;
border-top:1px solid #252424;
}

#catmenu{

margin: 0px;
padding: 0px;
width:1000px;
background:#252525 url(http://4.bp.blogspot.com/_4HKUHirY_2U/S6mTqAdkycI/AAAAAAAAA2E/zxCSk-6MwLI/catmenu.jpg) repeat-x;
height:33px;
}

#catmenu ul {

float: left;
list-style: none;
margin: 0px;
padding: 0px;
}

#catmenu li {

float: left;
list-style: none;
margin: 0px;
padding: 0px;
}

#catmenu li a, #catmenu li a:link, #catmenu li a:visited {

color: #fae7df;
display: block;
margin: 0px;
padding: 9px 10px 10px 10px;
}

#catmenu li a:hover, #catmenu li a:active {

background:url(http://3.bp.blogspot.com/_4HKUHirY_2U/S6mTqmy1HdI/AAAAAAAAA2M/6D7APyygWZA/catmenuhov.jpg) repeat-x;
color: #fff;
margin: 0px;
padding: 9px 10px 10px 10px;
text-decoration: none;
}

#catmenu li li a, #catmenu li li a:link, #catmenu li li a:visited {

background:#ED4A05;
width: 150px;
color: #fae7df;
font-family:Tahoma,century gothic,Georgia, sans-serif;
font-weight: normal;
float: none;
margin: 0px;
padding: 9px 10px 10px 10px;
border-bottom: 1px solid #FF7800;

}


#catmenu li li a:hover, #catmenu li li a:active {

background:url(http://3.bp.blogspot.com/_4HKUHirY_2U/S6mTqmy1HdI/AAAAAAAAA2M/6D7APyygWZA/catmenuhov.jpg) repeat-x;
color: #fff;
padding: 9px 10px 10px 10px;
}

#catmenu li ul {

z-index: 9999;
position: absolute;
left: -999em;
height: auto;
width: 170px;
margin: 0px;
padding: 0px;
}

#catmenu li li {

}

#catmenu li ul a {

width: 140px;
}

#catmenu li ul a:hover, #catmenu li ul a:active {

}

#catmenu li ul ul {

margin: -34px 0 0 170px;
}

#catmenu li:hover ul ul, #catmenu li:hover ul ul ul,

#catmenu li.sfhover ul ul, #catmenu li.sfhover ul ul ul {
left: -999em;
}

#catmenu li:hover ul, #catmenu li li:hover ul,

#catmenu li li li:hover ul, #catmenu li.sfhover ul,
#catmenu li li.sfhover ul, #catmenu li li li.sfhover ul {
left: auto;
}

#catmenu li:hover, #catmenu li.sfhover {

position: static;
}
  • After that copy the code below and paste it right under the code <div id='content-wrapper'>


<div id='catmenucontainer'>
<div id='catmenu'>

<ul>

<li><a href='http://NAMA LINK BLOG ANDA/'>Home</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-1</a>
<ul class='children'>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-1-1</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-1-2</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-1-3</a></li>
</ul>
</li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-2</a>
<ul class='children'>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-2-1</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-2-2</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-2-2</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-2-3</a></li>
</ul>
</li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-3</a>
<ul class='children'>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-3-1</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-3-2</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-3-3</a></li>
</ul>
</li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-4</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-5</a>
<ul class='children'>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-5-1</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-5-2</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-5-3</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-5-4</a></li>
</ul>
</li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-6</a>
<ul class='children'>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-6-1</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-6-2</a></li>
</ul>
</li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-7</a></li>
<li><a href='Your-Link-Here' title='Link-Title'>Link-Name-8</a></li>
</ul>

<div style='float:right;margin-right:20px;'>

<a href='http://feedburner.google.com/fb/a/mailverify?uri=pbtemplates'><img src='http://4.bp.blogspot.com/_4HKUHirY_2U/S6m5f0b1vkI/AAAAAAAAA38/wPNiRj2nZ9w/Mail_Read.png'/></a>
<a href='http://feeds.feedburner.com/pbtemplates'><img src='http://1.bp.blogspot.com/_4HKUHirY_2U/S6m5gDGJGAI/AAAAAAAAA4E/cHINlVzdTLI/RSS.png'/></a>
<a href='http://www.twitter.com/btipandtrick'><img src='http://2.bp.blogspot.com/_4HKUHirY_2U/S6n2fLHS5RI/AAAAAAAAA4c/G9M3awpSwZI/Twitter.png'/></a>
<a href='mailto:123@abc.com'><img src='http://3.bp.blogspot.com/_4HKUHirY_2U/S6n2qsFN6vI/AAAAAAAAA4k/NrkOt_6IvYs/contact.png'/></a>
</div>

</div>

</div>

<div class='clear'/>


  • Done, Save Template and Look at the result.
READ MORE»

How To Create Horizontal Menu


How To Create Horizontal Menu, Tab Menu Horizontal, or Static Page in Blogger Blogspot.It was if the blog is no navigation menu on the header of the function can store the content that we feel is important for the click and the search will not feel seen, what if you think?
So like what the heck horizontal horizontal navigation menu or menu that? For more details see example image below:

In the language of his blog, a horizontal menu or horizontal menu tab is commonly referred to as a static page. With the presence of updates from blogger.com, now make static pages more easily.
We just need to log into blogger.com, Then select a post, click edit pages, then we make dech tuch stay static page or a horizontal menu. However, static pages are created in this way will generate a special page that is really a static page and there are no comments mailboxes. That is, static pages that we created not from the posting page. The difference, if we create a static menu page instead of posting page means the page is static or static page does not have a comment box.

I prefer to make a static page using two ways: static page without the comment box and static page with the comment box, the goal yes just because I think in a static page for the blog I may have that can be commented and there is no need to comment as the page Home, About, ...
If you want to create a static page or tab menu horizontal menu that most of his commentary box there too, probably want to follow the following steps:
  1. Log into blogger.com
  2. From the dashboard click the design, then select Edit HTML
  3. Check Expand Widget Templates, then copy the following HTML code:
  4. <div id="tabs6"> <li> <a href = "http://buptizuha.blogspot.com/"Title =" Home "> <span> Home </ span> </ a> </ li> <a href="#" title="About"> <span> About </ span> </ a > </ li> <a href="#" title="Contact"> <span> Contact </ span> </ a> </ li> <a href = "#" title = "Longer Link Text"> <span>Longer Link Text</ Span> </ a> </ li>
    <li> <a href = "#" title = "Link 5"> <span>Link 5</ Span> </ a> </ li>
    <li> <a href = "#" title = "Link 6"> <span>Link 6 </ span> </ a> </ li>
    <li> <a href = "#" title = "Link 7"> <span>Link 7</ Span> </ a> </ li>
    </ Ul> </ div>
    Note:
      => Replace the url: http://buptizuha.blogspot.com/ with the url of your blog homepage, and sign # in the url address you want
      => Replace the text: Longer Link Text, Link 5, Link 6, Link 7 with the title of the link that you input;
      
  5.  Save the following code: <div id='content-wrapper'> or above code: <div id='main-wrapper'>
  6.  Next copy the CSS code again the following:  
  7. / *- Menu Tabs 6 --------------------------- * /
    # Tabs6 {
    font: bold 11px/1.5em Verdana;
    float: left;
    width: 100%;
    background: change-background;
    line-height: normal;
          }
    # Tabs6 ul {
    margin: 0;
    padding: 10px 10px 0 50px;
    list-style: none;
          }
    # Tabs6 li {
    display: inline;
    margin: 0;
    padding: 0;
          }
    # Tabs6 a {
    float: left;
    background: url ("images/tableft6.gif") no-repeat top left;
    margin: 0;
    padding: 0 0 0 4px;
    text-decoration: none;
          }
    # Tabs6 a span {
    float: left;
    display: block;
    background: url ("images/tabright6.gif") no-repeat top right;
    padding: 5px 15px 4px 6px;
    color: # FFF;
          }
    / * Commented backslash hack hides rule from IE5-Mac \ * /
    # Tabs6 a span {float: none;}
    / * End IE5-Mac hack * /
    # Tabs6 a: hover span {
    color: # FFF;
          }
    # Tabs6 a: hover {
    background-position: 0%-42px;
          }
    # Tabs6 a: hover span {
    background-position: 100%-42px;
          }
     
  8. Save the above code: ]]></ B: skin>, Save the template and see the results.
  9. HTML and CSS code shown above Code is the result of CSS Menu Generator from CSSPortal, you can also create a horizontal menu tab by taking the CSS and HTML code provided by CSSPortal in http://cssportal.com/. There are many layout options that you can choose as you wish.
READ MORE»

Phone Suite for All Types of HP China


  • Broadly speaking, Phone Suite is most useful for making HP china into the Internet modem. Another use could be to transfer files, transfer contacts, and SMS edit / send.
  • Now many are confused, "Phone Suite for HP I really do not exist huh? Ask dong dikirimin to email please ... "
  • Actually all the Phone Suite can be used to all kinds of HP China, which is important DRIVER for USB cable is already there. And most HP china, its usb cable driver komptibel for all types and brands.
  • So go ahead and wants to find his phone suite for nokia, though not on my blog link pc suite, direct download aja deh Phone this suite:
    READ MORE»