How to add drop down menu in blogger

How To add drop down menu in blogger

Follow the following steps to create a drop down menu in Blogger:

1. In the Blogger dashboard, go to Layout

2. Click on Add a Gadget

3. Select HTML/JavaScript

4. Under Content, paste the following code

<li>

<a href='#'>MenuItem</a>

</li>

<li>

<a href='#'>MenuItem</a>

</li>

<li>

<a href='#'>MenuItem</a>

</li>

<li>

<a href='#'>MenuItem</a>

<ul>

<li><a href='#'>SubMenuItem</a></li>

</ul>

</li>

</ul>

</div>

5. Replace MenuItem with the appropriate menu label

6. Replace SubMenuItem with the appropriate sub-menu label

7. Replace # with the appropriate URL

8. Click Save

9. Move the HTML/Javascript object to where you want the menu to appear

10. Click Save arrangement

11. Click on Template

12. Click Edit HTML

14. Search for the following line:

]]></b:skin>

15. Paste the following code directly above that line

/*-------- Begin Drop Down Menu -------*/

#menubar {
background: #FF0000;
width: 1000px;
color: #A4F2E9;
margin: 0px;
padding: 0;
position: relative;
border-top:1px solid #FF8A33;
height:35px;
}

#menus {
margin: 0;
padding: 0;
}

#menus ul {
float: left;
list-style: none;
margin: 0;
padding: 0;
}

#menus li {
list-style: none;
margin: 0;
padding: 0;
border-left:1px solid #FF7733;
border-right:1px solid #FF7733;
height:35px;
}
#menus li a, #menus li a:link, #menus li a:visited {
color: #25BD04;
display: block;
font:normal 12px Arial, Tahoma, Helvetica, FreeSans, sans-serif; margin: 0;
padding: 9px 12px 10px 12px;
text-decoration: none;
}

#menus li a:hover, #menus li a:active {
background: #FFFD99; /* Menu hover */
color: #BED50D;
display: block;
text-decoration: none;
margin: 0;
padding: 9px 12px 10px 12px;
}

#menus li {
float: left;
padding: 0;
}

#menus li ul {
z-index: 9999;
position: absolute;
left: -999em;
height: auto;
width: 160px;
margin: 0;
padding: 0;
}

#menus li ul a {
width: 140px;
}

#menus li ul ul {
margin: -25px 0 0 160px;
}

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

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

#menus li:hover, #menus li.sfhover {
position: static;
}

#menus li li a, #menus li li a:link, #menus li li a:visited {
background: #28E8DC; /* drop down background color */
width: 120px;
color: #F4240A;
display: block;
font:normal 12px Arial, Tahoma, Helvetica, FreeSans, sans-serif;
margin: 0;
padding: 9px 12px 10px 12px;
text-decoration: none;
z-index:9999;
border-bottom:1px solid #1A6680;
}

#menus li li a:hover, #menusli li a:active {
background: #130000; /* Drop down hover */
color: #B2F7CC;
display: block; margin: 0;
padding: 9px 12px 10px 12px;
text-decoration: none;
}

/*-------- End Drop Down Menu -------*/

I hope this will help you become a greater publisher!!!

Enjoy your high school with - High School Pedia : www.highschoolpedia.com

Comments

High School Pedia

It is an initiative by some students to spread the light of knowledge to everyone and everywhere. It was started in the year 2015 and has grown rapidly in the past few months. By the means of this website, we try to provide information on every topic that we can reach up to. You can find different articles on this website. All these articles are written in simple language so that everyone can understand it and learn from it. We at High School Pedia believe in creative learning and this is the reason why we add our own edited graphical representations in every article. Once a very learned man said, “Knowledge increases by not keeping it to yourself but by sharing it with others”. And we follow the same motto “Share to Learn”. The team of High School Pedia tries its best to provide you with the best and original content. Unlike many other websites, High School Pedia is famous for its original and inspiring content.

Animal and Plant Cells

Cells Cells are the basic functional, biological and structural unit of life. The word cell is a Latin word meaning ‘small room’. Cells are also known as building blocks of life. The branch of science that deals with the form, structure, and composition of a cell is known as Cytology. All organisms around us are made up of cells. Bacteria, ameba, paramecium, algae, fungi, plants and animals are made up of cells. Cells together form tissues. And tissue together makes an organ. History Of Cell The cell was discovered by Robert Hooke in 1665. He assembled a simple microscope and observed a very thin slice of cork under his primitive microscope. The cork was obtained from the outer covering of a tree called bark. Robert Hooke observed many little-partitioned boxes or compartments in the cork slice. These boxes appeared like a honey-comb. He termed these boxes as the cell. He also noticed that one box was separated from another by a wa...

Important Mathematical Constants!

Important Mathematical Constants Mathematical constants are those numbers that are special and interesting because they come up in the various fields of mathematics like geometry, calculus etc. These mathematical constants are usually named after the person who discovered it and they are represented by a symbol that is usually picked up from the Greek alphabet. Mathematical constants are by definition very important. In this article we will take a look at certain mathematical constants that are more commonplace than others. 1. π (pi) or Archimedes constant (~3.14159): π is defined as the ratio of the circumference of a circle to its diameter. This is probably the most popular mathematical constant. So π is the circumference of the circle whose diameter is 1 unit. You might have seen it popping up when calculating the area of a circle (πr 2 ) or the circumference of a circle (2πr). It has many uses throughout mathematics from calcula...

The Inverse & Reciprocal TRIGONOMETRIC Functions

So, this is my second post on trigonometry. In this post we're gonna cover the reciprocal and the inverse Trigonometric functions. If you haven't seen my first post you should definitely view it as it covers the basics of Trigonometry The Reciprocal Trigonometric Functions The reciprocal Trigonometric function of Sine is Cosecant, of Cosine is Secant & for Tangent it is Cotangent. Cosecant (Csc θ = 1/Sin θ) or (Hypotenuse/Opposite) Secant (Sec θ = 1/Cos θ) or (Hypotenuse/Adjacent) Cotangent (Cot θ = 1/Tan θ) or (Adjacent/Opposite) We can also represent Tan θ in another way. As Tan θ = opposite/adjacent & Sin θ = opposite/hypotenuse & Cos θ = adjacent/hypotenuse ∴ Tan θ = Sin θ/Cos θ (The hypotenuses cancel out) As Cot θ = 1/Tan θ So, we can also represent Cot θ as Cos θ/Sin θ.

Catalysts

Catalysts When we hear the word catalyst, the first thing that comes to mind is the game “Mirror’s Edge Catalyst”. But actually, catalysts are chemical substances that speed up the process of a chemical reaction but do not used up in the process of speeding up. The process of using catalysts to speed up chemical processes is called catalysis. Some examples are: Ø Hydrogen peroxide decomposes to form water and oxygen. 2H2O2 à 2H2O + O2 But in the presence of manganese dioxide (MnO2) the process is sped up and happens a lot faster. Ø Cars use a catalytic converter to convert carbon monoxide to carbon dioxide. These contain Platinum to speed up the process and keep the car’s system getting backed up. Ø Ammonia synthesis also uses Iron as a catalyst Catalysts work by reacting with a reactant. This is called a catalytic action. The product of the catalytic action is a chemical intermediate, which can react with the other reactant at a faster pace and give...

Important Mathematical Constants!

2-D & 3-D GEOMETRY

2-D & 3-D GEOMETRY We all have some amount of geometry. We know that any line can be represented on the Cartesian plane. Any figure can be drawn on it. But can we represent a 3-d object on it. Yes we can. A Cartesian plane has 2 axis. While representing in 3-D we need to add a third axis. This axis does not come in between the axis or in the same plane. It appears to be coming out of the paper as we cannot represent a 3-d object on a 2-d surface. This new z-axis represents a line coming out of the screen. Before understanding 3-d geometry you need to imagine this axis coming out of the screen. REMEMBER : all the three axis are perpendicular .i.e there an angle 0f 90 between them and they meet at the origin If you are unable to imagine you can take a thick book as an example. Any corner becomes it origin and the three edges as the three axis REPRESENTING 3-D GEOMETRY Like in 2-d geometry we represent the value of the different axis as (x,y) we use the sa...

High School Pedia

Search This Blog