Wednesday 29 October 2014

Login Form

How To Add Login Form in Blogger

  • Open Your Blog
  • Click On Design



  • Click On DropDown Arrow
  • Click On Layout



  • Click On Add A Gadget


  • On HTML/JavaScript
  • Click on + Sign


  • Copy The Below Code 

<br/><br/><form action="https://www.google.com/accounts/ServiceLoginBoxAuth" method="post" onsubmit="onlogin()"><input value="http://www.blogger.com/loginz?d=%2Fhome&p=http%3A%2F%2Fwww.blogger.com%2F" name="continue" type="hidden"/><input value="blogger" name="service" type="hidden"/><input value="8" name="nui" type="hidden"/><input value="8" name="naui" type="hidden"/><input value="2" name="fpui" type="hidden"/><input value="3" name="uilel" type="hidden"/><input value="true" name="skipvpage" type="hidden"/><input value="false" name="rm" type="hidden"/><input value="true" name="alwf" type="hidden"/><input value="http://www.blogger.com/login.g" name="roeu" type="hidden"/><input value="0" name="alinsu" type="hidden"/><input value="WbQ8QiJfUvA" name="GA3T" type="hidden"/><div><label for="Email"> Username: <br/><input id="Email" tabindex="1" value="" name="Email" size="20" type="text"/></label></div><div><label for="Passwd"> Password: (<a href="https://www.blogger.com/forgot.g" target="_top" title="Forgot your password?">?</a>) <br/></label><input id="Passwd" tabindex="2" autocomplete="off" name="Passwd" size="20" type="password"/></div><br/><input id="signin-btn-ns" tabindex="0" value="Sign in" class="ubtn ubtn-block" name="submit" type="submit"/></form>


  • And Paste Here
  • and
  • Click On Save and Refresh Your WebSite


  • Here's Done



Monday 27 October 2014

Adding Image Slider In Blogger

    Adding Image Slider In Blogger   


   Adding Image Slider In Blogger    

Adding Image Slider In Blogger



  • Open Your Blog
  • Click On Design


Adding Image Slider In Blogger


  • Click On DropDown Arrow
  • Click On Layout


Adding Image Slider In Blogger


  • Click On Add A Gadget


Adding Image Slider In Blogger

  • On HTML/JavaScript
  • Click on + Sign

Adding Image Slider In Blogger


  • Copy The Below Code 



<!-- SLIDER CSS -->

<style type="text/css">

/*

 * jQuery FlexSlider v2.2.0

 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 */


/* Browser Resets
*********************************/
.flex-container a:active,
.flexslider a:active,
.flex-container a:focus,
.flexslider a:focus  {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;}


/* FlexSlider Necessary Styles
*********************************/
.flexslider li {
border: 0 none !important;
padding: 0 !important;
text-indent: 0 !important;
margin-bottom: 0 !important;
}
.flexslider {margin: 0; padding: 0;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {width: 25%; display: block;}
.flexslider .slides, .flexslider .slides img, .flex-direction-nav { margin: 0 !important; padding: 0 !important; }
.flex-pauseplay span {text-transform: capitalize;}

/* Clearfix for the .slides element */
.slides:after {content: "\0020"; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
html[xmlns] .slides {display: block;}
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}

/* FlexSlider Default Theme
*********************************/
.flexslider { margin: 0 0 60px; background: #fff; border: 4px solid #fff; position: relative; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: 0 1px 4px rgba(0,0,0,.2); -moz-box-shadow: 0 1px 4px rgba(0,0,0,.2); -o-box-shadow: 0 1px 4px rgba(0,0,0,.2); box-shadow: 0 1px 4px rgba(0,0,0,.2); zoom: 1; }
.flex-viewport { max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; transition: all 1s ease; }
.loading .flex-viewport { max-height: 25px; }
.flexslider .slides { zoom: 1; }
.carousel li { margin-right: 5px; }

/* Direction Nav */
.flex-direction-nav {*height: 0;}
.flex-direction-nav a  { text-decoration:none; display: block; width: 40px; height: 45px; margin: -20px 0 0; position: absolute; top: 50%; z-index: 10; overflow: hidden; opacity: 0; cursor: pointer; color: rgba(0,0,0,0.8); text-shadow: 1px 1px 0 rgba(255,255,255,0.3); -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease; }
.flex-direction-nav .flex-prev { background: url("http://project.dimpost.com/flexslider-basic/img/arrows1.png") no-repeat scroll -15px -92px transparent; left: -50px; }
.flex-direction-nav .flex-next { background: url("http://project.dimpost.com/flexslider-basic/img/arrows1.png") no-repeat scroll -15px -15px transparent; right: -50px; text-align: right; }
.flexslider:hover .flex-prev { opacity: 0.5; left: 10px; }
.flexslider:hover .flex-next { opacity: 0.5; right: 10px; }
.flexslider:hover .flex-next:hover, .flexslider:hover .flex-prev:hover { opacity: 0.9; }


/* Pause/Play */
.flex-pauseplay a { display: block; width: 20px; height: 20px; position: absolute; bottom: 5px; left: 10px; opacity: 0.8; z-index: 10; overflow: hidden; cursor: pointer; color: #000; }
.flex-pauseplay a:before  { font-family: "flexslider-icon"; font-size: 20px; display: inline-block; content: '\f004'; }
.flex-pauseplay a:hover  { opacity: 1; }
.flex-pauseplay a.flex-play:before { content: '\f003'; }

/* Control Nav */
.flex-control-nav {width: 50%; position: absolute; bottom: -40px; text-align: center;}
.flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: rgba(0,0,0,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -moz-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); -o-box-shadow: inset 0 0 3px rgba(0,0,0,0.3); box-shadow: inset 0 0 3px rgba(0,0,0,0.3); }
.flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); }
.flex-control-paging li a.flex-active { background: #000; background: rgba(0,0,0,0.9); cursor: default; }

.flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;}
.flex-control-thumbs li {width: 25%; float: left; margin: 0;}
.flex-control-thumbs img {width: 50%; display: block; opacity: .7; cursor: pointer;}
.flex-control-thumbs img:hover {opacity: 1;}
.flex-control-thumbs .flex-active {opacity: 1; cursor: default;}

@media screen and (max-width: 50px) {
  .flex-direction-nav .flex-prev { opacity: 1; left: 10px;}
  .flex-direction-nav .flex-next { opacity: 1; right: 10px;}
}
</style>
    
<!-- SLIDER HTML -->
      <div id="flex-isfb">
        <!-- Preloader -->
        <div id="preloader"></div>
        <style>
        /* Preloader */
        #preloader {
            position: absolute;
            top:0;
            left:0;
            right:0;
            bottom:0;
            background-color:#fff; /* change if the mask should have another color then white */
            z-index:999999999999; /* makes sure it stays on top */
        }
        
        </style>
        <div class="flexslider">
          <ul class="slides">


<li>
<a href="http://www.facebook.com/shadowspower007/"target="_blank">
<img alt=""  src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg55UKFCOXt2MqDdTJ9WFfFuCLkiznl7BN7ojIMgIiUCVnBcafyQhcr8GD3ndIxdvaNJ9XZn0TjwaOVk1j68KU_z1Uexef2HpmR1Q1FFPKPy2liTOirE_kCpR97unjSZmtKzws5uRDHaiRm/s60/facebook.png
style="width: 88px; height: 88px;" /></a>
</li>
<li>
<a href="http://www.reddit.com/user/shadowspower007/"target="_blank">
<img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7sSIy6xOKDMzcZIYzjc56iYu0y1xpYHS6ScRXZ_127pUNCtVq5vfohknsaguzWjBVRcLmnr3iREkTEDjmvctEkd8bTAWxWIGwCXix7rqe30gMs7Rqk07xXxFEoNIP1UB8PyOCpNITGctD/s48/reddit.png
style="width: 88px; height: 88px;" /></a>
</li>
<li>
<a href="https://www.youtube.com/shadowspower007/"target="_blank">
<img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjarLkUjfNWSO_sGNs-K0Ej0_fXDwBIb82-yEp4zgDg_NDsmXy4tDeetwOhY28K2EfbJOKuIsiyQCvK_luTPikVJ5cbCDCDZhh3AFv6saV1dkL0yTz-rjnS4N0qHGGulEfJ_uYfodNwO2AP/s48/youtube.png
style="width: 88px; height: 88px;" /></a>
</li>
<li>
<a href="https://www.tumblr.com/blog/shadowspower007/"target="_blank">
<img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyQLRbW6dTD6HmacEEKDKo55IRFXrFag1hM0Yx0d_qPv6EG-XgCjfJx6KVuxbFFetuGKpgyIkjbowPFyUt33YgJ4W-LWtUHYAc-tbBaHWIGfrIolgAk9JdGEYID6yVt2_EGMA8eJent9U/s64/Tumblr.png
style="width: 88px; height: 88px;" /></a>
</li>
<li>
<a href="https://plus.google.com/101509198010515002965/posts/"target="_blank">
<img alt="" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrABkvqSd_fcdYmJ9Ui9HHj8DFmgXaaqf1Y8zXyKqx-mKSYeD0cBhb_4RGk8XgA67QhKvKCOUq372MjEnkUDu6s_CGWNMsPlwNaVxKbETqU9YyuxxYHoeztQ85QCApSL_ywqtWm3-UCBk/s225/g%252B.jpg
style="width: 88px; height: 88px;" /></a>
</li>

           
          </ul>
        </div>
      </div>

<!-- SLIDER JS -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://project.dimpost.com/flexslider-basic/js/jquery.flexslider-min.js"></script>
  <script type="text/javascript">
    $(window).load(function(){
      $('.flexslider').flexslider({
  animation: "slide",
  controlNav: true, 
  directionNav: true,
  easing: "swing",
  slideshowSpeed: 3000,        
     animationSpeed: 600, 
      });
    });
    //<![CDATA[
        $(window).load(function() { 
            $('#preloader').delay(350).fadeOut('slow'); 
        })
    //]]>
</script>

  • And Paste Here
  • and
  • Click On Save
Adding Image Slider In Blogger




    •                               Our Work Is Done




     For Changing Your Links  
     and 
     Images 


    • For Link: Replace Blue highlighted link with
    • your Desire Link


    • and


    • For Images: Red Link With 
    • your 
    • Image Desire Link










      Thursday 23 October 2014

      SEO Tips

      If you are still learning about search engine optimization (SEO), you are probably a bit confused about the difference between on-site and off-site SEO strategies. On-site tactics are more straight-forward for the beginner and are probably written about the most. I thought I would write an article and cover what I've learned. This pool of SEO knowledge comes from working with about 10 clients and another 10 personal web sites over an 18 month period.
      To anyone with an SEO background, there are certain basic on-site SEO tasks that any web master, business owner, or Internet Marketer needs to be aware of. These include the following major components:
      1) Title Tags - The title tag in your HTML meta code is the tag that tell the browser what to display in the title of the window at the very top of the screen. Because this text is so visible to the user, Google likes to rely heavily on this text as a clue as to what your page is about. As a result, it is a really important SEO strategy that your title tag be filled with keywords that are appropriate to the content of the web page. Furthermore, you really don't want the same title tag on every page. This is not good for SEO. Instead, you want to have different keyword phrases in your title tags that properly identify the theme of that particular page. Remember, you are trying to help the search engines easily digest your content. That's basically what SEO is. You want to aid them in their understanding of what this page is really about.
      2) The first H1 tag - Similar to the title tag, Google will look at the first H1 text to appear on your page as a strong signal as to what the page is about. Use it wisely. Again, you want to place keyword phrases here that are thematically related to what the information on the page is conveying to the end-user.
      3) The name of the page itself - As you name your pages in your web site, use plain English as much as possible for SEO. You will notice that WordPress uses this extensively in their blog software. This is no accident and WordPress is considered the best blog for SEO. Why? Because there is descriptive text in the longer version of the page name that helps the search engine know what the page is about. Many people have written about issues around "dirty links" and SEO (links including system variable data such as AID=22 in the example above). I think it is better if you can design your system without any variable data at all. It just takes this SEO issue away. And it's just easier for the search engines. It's also easier for the end-user. However, there is no problem promoting pages via SEO with variable data in the links. I've been able to make both fly using the same SEO tactics with no problems. The search engines are smart enough by now to manage through that variable data. Just make sure your plain English is in there.
      4) Keyword meta tag - This tag used to get a ton of play for SEO, but is now largely ignored by the search engines. I believe it fell out of favor due to manipulation and misuse. It is a tag that is not seen by the end-user, so unscrupulous web masters abused it and it became less-and-less important for SEO. Real SEO tactics don't abuse or deceive. I still populate my keyword tags because I believe they are still looked at, but I don't believe they are very critical. If nothing else, it's another instance of your keywords. They all help SEO.
      5) Description meta tag - This tag is still useful, but probably more for Yahoo and MSN. Since you will be in this part of your web site anyway to get the Title right, you might as well make this variable-driven as well and make the description appropriate to the page. Again, it can't hurt SEO.
      6) Keyword Density - This is very important for SEO. Keep in mind that the search engines are just large computer programs digesting your site and trying to figure out what it is about. One of the simplest things they do is to count up all the words and look for repeats. They then calculate percentages, or densities, of specific 1-word, 2-word and 3-word phrases that are found in your text. By looking at the most popular keyword phrases, their programs understand the important themes of your page. If you observe your own writing on a specific subject, you will see the patterns as well. I don't recommend that you write solely with keyword density in mind as it will result in lower quality content. However, I also don't recommend that you completely ignore keyword density in your content creation. My preferred approach is to write content straight-up for the first draft. Then, as you edit for grammar, consistency, and clarity, also edit for density. Run your content through a density checker and see what phrases are used the most. Make adjustments accordingly so that your top themes / keyword phrases are showing up between 2-4% of the time. But don't do this to the extent that anything reads as unnatural. You need to always keep your audience in mind.
      7) Outbound links - What your page links to matters, in terms of both the quality and quantity of links. As you build links out of your page, be specific about where they go. Don't link to low-quality or bad-neighborhood sites. Also watch your number of links. Generally, the less the better. However, having no outbound links is not always good. I believe Google uses your outbound links as a way to position your site in the vast weave that is the Internet. Often times, Google can get a good feeling about what your site is about just by looking at who you link to. So again, select these links wisely understanding they will actually impact your SEO.
      8) High-quality, original, content - I probably should have put this first because it can't be stressed enough for SEO. Your site needs to provide high-quality and original content. You will read this maybe a hundred times as you research SEO. Content is king. And I firmly believe this to be true. If you are under the impression that the internet is so big that search engines can't identify content as really unique, guess again. One afternoon spent playing with CopyScape will convince you that there is technology available today that is able to tell you if any given sentence has been repeated anywhere on the Internet. It's staggering, actually, when you really think about that. The volumes of data are just outrageous. But if CopyScape can do it, I'm betting that Google can do it also. And I firmly believe that your site receives a positive bump when Google determines that the content is original. Many people have asked me if using content that is repeated on other sites will penalize the site. I believe the answer is no, you will not be penalized by Google (copyright infringement is a completely different and very serious legal topic that I won't go into today). But I also believe that you won't get where you want to be by using content that already has high mileage. The other hot debate related to how sites using duplicate content can actually rank higher than the site where the content originated from. Yes - This has been demonstrated empirically a bunch of times. But you don't need to be too concerned with that for reasons we will get into later. Just keep your eye on the ball. Put in the time, energy and creativity it takes to create unique content and you will be rewarded. Plain and simple.
      9) Appropriate amounts of content - Somewhat different from #8 is the issue of how much content to put on your site for good SEO. I don't believe there is a single magic answer as each site has a different objective. But as far as SEO goes, I generally believe the more the better (assuming you are following #8). Give those hungry spiders as much food for thought as you possibly can. But let me also qualify that statement. You need ensure that your content doesn't stray too far from the core message of your site. If it does, this can create confusion around what your site is really about. Tightly focused sites perform much better than more generically focused sites. For example, a site selling used Honda Civics that uses appropriate SEO strategies will probably get ranked higher and faster than a more generalized site selling all types of used cars. This is a generic statement, and there are many exceptions, but it's a reasonable place to start your thinking about niches and themes.

      Computer Repair -Important Tips

      Do you use a computer or laptop in your home or office? Is your computer or laptop infected with the virus? Does it run very slowly? You must repair your computer as soon as possible to do your regular task uninterruptedly. We all know how valuable the good health of our computer is to us. This is why we are giving you some important computer repair tips that can come in handy in troubleshooting your computer.
      The sad fact of the matter is that most people do not know how to properly take care of their computer. Of course, taking care of the computer is all about maintenance, and is not something that you should be looking to learn after your computer is already experiencing problems. However, if your computer already has problems, and you were not aware of how you were going to be fixing them, there are a few things that need to be taken into account in order to ensure that you do not make the problems worse.
      There are also a few steps that you can take that usually fix most of the, problems that people have with their computers, so long as you are able to identify that the problem that you are having is not a hardware problem. If you are experiencing a slow computer due to spyware, issues with the operating system, or other common issues with the computer, try the following to fix the problem and see if it is.
      First, many computers have way too many things running when they first start. Take a look at your start up folder and see if you have ten million programs running when you start your PC. Remove the ones that you never use.
      You can free up space by deleting your temporary internet files and other browsing history or, even better, just finding things that you don't need any more. You can use the control panel's add and remove programs panel to find and remove programs that you no longer use (it even shows how much space they take up!)
      You should defragment your desktop in a regular interval which will help windows to find things in a faster way. If your computer has a highly fragmented drive, it may slow down severely as it will have to search all over the place to find data.
      One of the biggest causes for computer slowdowns is ad-ware. You should install an anti-ad-ware program to keep your machine running smoothly.
      Computer freezes can be resolved by cleaning your computer from unnecessary files. You can do this in several ways. You can start with the system tools that come with your windows operating system such as the disk clean-up. You can also optimize your browser by clearing every day's browsing history, temporary files, and all cookies.
      Computer errors can be caused by a corrupted registry in which case you need to download a registry cleaner that will fix the errors. Usually when you run the registry cleaner and have errors fox, other issues are resolved as well.
      Your computer can be slow down when any viruses, spyware, and malware programs attack the registry and your computer. You can resolve this by downloading an online virus removal as well as anti-spyware programs that are readily available in the internet
      These are tips that will help you resolve common issues confronting your computer. For issues that are not resolved with these tips, you can always get your computer repair services online that will fix all issues remotely while you sit back and relax.

      Wednesday 22 October 2014

      DropDown Menu Color Change

      Changing DropDown Menu's Color and Style

      GoTo Your Blogger.com Account

      Click On Design

      Changing DropDown Menu's Color and Style

      Click On Layout

      Changing DropDown Menu's Color and Style


      On HTML/JavaScript
      Click On Edit

      Changing DropDown Menu's Color and Style

      This Window Will Appear

      Changing DropDown Menu's Color and Style

      Now Add This Code Between   
      <a      and       href='#'>Enter Main Tab1</a> 

      To Change BackGround and Text Color   
      style="background-color: red; color :yellow"   
      Red  for BackGround  and Yellow for Text Color
        
      To Change Style type
           <b><h3><i>       before    >Enter Main Tab1
            and        
       </b></h3></i>     after      >Enter Main Tab1

      where
      <b> for Bold
      <h3> for Heading
      <i> for Italic
              
      Changing DropDown Menu's Color and Style


      Here are the Codes for Below Picture

                <a style="background-color:red;color:yellow"  href='#'><h3><b>Enter Main Tab1</b></h3></a> 
             
                <a style="background-color:green;color:gold" href='#'><h3>Enter Main Tab2</h3></a> 
           
                <a style="background-color:hotpink;color:indigo" href='#'><b><h3><i>Enter Main Tab3</b></h3></i></a> 


      Changing DropDown Menu's Color and Style


      Use Codes like this for All Your DropDown Menus and SubMenus

      Monday 20 October 2014

      How to Add DropDown Menus In Blogger


      Goto Blogger.com


      1. Enter your email and password




      How to Add DropDown Menus In Blogger

      2. Click On Design



      How to Add DropDown Menus In Blogger

           3. Click on Dropdown Errow 

      4. Click On Layout


      How to Add DropDown Menus In Blogger



      5. Click On   Add a Gadget

      How to Add DropDown Menus In Blogger

       6. On HTML/JavaScript
      Click on + Sign


      How to Add DropDown Menus In Blogger



      7. Copy the Below Code

      <div id='mbtnavbar'> 

            <ul id='mbtnav'> 
              <li> 
                <a href='#'>Enter Main Tab1</a> 
              </li> 
              <li> 
                <a href='#'>Enter Main Tab2</a> 
             </li> 
              <li> 
                <a href='#'>Enter Main Tab3</a> 
              </li> 
        <li> 
                 <a href='#'>Enter Main Tab</a>
                 
                    <ul> 
                      <li><a href='Enter page link'>Enter Dropmenu name</a></li> 
                      <li><a href='Enter page link'>Enter Dropmenu name</a></li> 
                      <li><a href='Enter page link'>Enter Dropmenu name</a></li>
                    </ul> 
              </li>
            </ul> 

          </div>




      and Paste Here

      8.  Click On Save Button


      How to Add DropDown Menus In Blogger




      How to Add DropDown Menus In Blogger

      9.  Click On Template


      How to Add DropDown Menus In Blogger

      10. Click On Edit HTML



      How to Add DropDown Menus In Blogger
      11. Copy The Code 


      /*----- MBT Drop Down Menu ----*/



      #mbtnavbar { 

          background: #060505; 
          width: 960px; 
          color: #FFF; 
              margin: 0px; 
              padding: 0; 
              position: relative; 
              border-top:0px solid #960100; 
              height:35px;
      }


      #mbtnav { 

          margin: 0; 
          padding: 0; 
      #mbtnav ul { 
          float: left; 
          list-style: none; 
          margin: 0; 
          padding: 0; 
      #mbtnav li { 
          list-style: none; 
          margin: 0; 
          padding: 0; 
              border-left:1px solid #333; 
              border-right:1px solid #333; 
              height:35px; 
      #mbtnav li a, #mbtnav li a:link, #mbtnav li a:visited { 
          color: #FFF
          display: block; 
         font:normal 12px Helvetica, sans-serif;    margin: 0; 
          padding: 9px 12px 10px 12px; 
              text-decoration: none; 
              
      #mbtnav li a:hover, #mbtnav li a:active { 
          background: #BF0100; 
          color: #FFF
          display: block; 
          text-decoration: none; 
              margin: 0; 
          padding: 9px 12px 10px 12px; 
              
          
              
      }
      #mbtnav li { 
          float: left; 
          padding: 0; 
      #mbtnav li ul { 
          z-index: 9999; 
          position: absolute; 
          left: -999em; 
          height: auto; 
          width: 160px; 
          margin: 0; 
          padding: 0; 
      #mbtnav li ul a { 
          width: 140px; 
      #mbtnav li ul ul { 
          margin: -25px 0 0 161px; 
      #mbtnav li:hover ul ul, #mbtnav li:hover ul ul ul, #mbtnav li.sfhover ul ul, #mbtnav li.sfhover ul ul ul { 
          left: -999em; 
      #mbtnav li:hover ul, #mbtnav li li:hover ul, #mbtnav li li li:hover ul, #mbtnav li.sfhover ul, #mbtnav li li.sfhover ul, #mbtnav li li li.sfhover ul { 
          left: auto; 
      #mbtnav li:hover, #mbtnav li.sfhover { 
          position: static; 
      }
      #mbtnav li li a, #mbtnav li li a:link, #mbtnav li li a:visited { 
          background: #BF0100; 
          width: 120px; 
          color: #FFF
          display: block; 
          font:normal 12px Helvetica, sans-serif
          margin: 0; 
          padding: 9px 12px 10px 12px; 
              text-decoration: none; 
      z-index:9999; 
      border-bottom:1px dotted #333;
          
      #mbtnav li li a:hover, #mbtnavli li a:active { 
          background: #060505; 
          color: #FFF
          display: block;     margin: 0; 
          padding: 9px 12px 10px 12px; 
              text-decoration: none; 

      }

      Click in the Window
      and Press Ctrl+F  keys
      Search Bar will appear
      Type ]]></b:skin>


      Paste the Code Above the      ]]></b:skin>



      How to Add DropDown Menus In Blogger

      12. Click On Save template

      How to Add DropDown Menus In Blogger
      Change #060505 to change background color of the Main menu


      Change  the Lime highlighted text to change font color, size and family



      Change #BF0100 to change the background of a tab on mouse hover

      Change #BF0100 to change the background color of the drop down menu

      Change #060505 to change the background color of drop down menu on mouse hover

       



      How to Add DropDown Menus In Blogger

      Color Codes

      How to Add DropDown Menus In Blogger