>

Create Menu Horizontal

There are a sensitive and create horizontal menu, but I know how?
I know how great, but whoa, apasih the horizontal menu? Menu is the horizontal menu prepared by horizontally (sideways). Well, all this too:






blackleft.gifblackright.gif
greenleft.gifgreenright.gif
redleft.gifredright.gif
unguleft.gifunguright.gif
yellowleft.gifyellowright.gif
blueleft.gifblueright.gif
whiteleft.gifwhiteright.gif

Ok, the ingredients are there, let's start making it:
1. Login to bloggers continue to select Layout -> Edit HTML, "but check the box" Expand Widget Templates. " do not forget the template in the first backup.
2.
Find the script like this ]]></b:skin>, I was a copy of the script below, and put over

/*credits : http://trik-tips.blogspot.com */
#tabshori {
float:left;
width:100%;
font-size:13px;
border-bottom:1px solid #2763A5; /* Bottom line*/
line-height:normal;
}
#tabshori ul {
margin:0;
padding:10px 10px 0 50px; /*Menu Position*/
list-style:none;
}
#tabshori li {
display:inline;
margin:0;
padding:0;
}
#tabshori a {
float:left;
background: url("http://kendhin.890m.com/menu/blackleft.gif") no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
}
#tabshori a span {
float:left;
display:block;
background: url("http://kendhin.890m.com/menu/blackright.gif") no-repeat right top;
padding:5px 14px 4px 4px;
color:#fff;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabshori a span {float:none;}
/* End IE5-Mac hack */
#tabshori a:hover {
background-position:0% -42px;
}
#tabshori a:hover span {
background-position:100% -42px;
}

Writing a bold you can change the image (text under the picture) over the election. For example, if you select the color red into the scriptnya like this;

background: url("http://kendhin.890m.com/menu/redleft.gif") no-repeat left top;

background: url("http://kendhin.890m.com/menu/redright.gif") no-repeat right top;

I finished let's proceed, to does the number was? I figure until the third.
3. Copy the following script

<div id="tabshori">
<ul>
<li><a href="http://trik-tips.blogspot.com"><span>Home</span></a></li>
<li><a href="http://trik-tips.blogspot.com"><span>Trik-Tips</span></a></li>
<li><a href="http://trik-tips.blogspot.com"><span>Free Template </span></a></li>
<li><a href="http://trik-tips.blogspot.com"><span>Kamus</span></a></li>
<li><a href="http://trik-tips.blogspot.com"><span>Profile</span></a></li>
</ul>
</div >

4. Change http://trik-tips.blogspot.com with links that lead you. The link can be the address of another blog posting or a link km. To get the link posting how right-click on the title I've select "copy link location" (for mozilla firefox).
Then the text printed in bold can you change the text that you like. Text is the text that appears on the button / menu.
5. How to install some kind of depends on the template used, one example of removing the case
find the following code:

<div id="content-wrapper">

how ru easy matter, a copy of the script over and press Ctrl-f and then paste in the box and find, Nha directly for you. As usual a copy of the script, which was over

6. Save the results of editing.
7. See the results.
8. the result was not good / desultory attempt to place the script was moved, for example, a move that is above code </div>. It is also suitable for his place again tried the above or underneath, so hold up the place.
9. I still have not been successful also try this:
- Find the following code::

<b:section class='header' id='header'
maxwidgets='1' showaddelement='no'>
<b:widget id='Header1' locked='true'
title='your blog title (Header)' type='Header'/>
</b:section>

continue to change the text of the green to become like this:

<b:section class='header' id='header'
maxwidgets='2' showaddelement='yes'>
<b:widget id='Header1' locked='false'
title='your blog title (Header)' type='Header'/>
</b:section>

Save on hold

Click the Page Elements tab, then click on a header in the region Add a page element and select the HTML / JavaScript script paste the link was in the box content continues to save, Nha place above it, try to drag down small, Nha so, continue to store and see the results.

the results will vary in each template.
I mean you feeling successful, it means you failed less feeling: I try to be examined more steps and be understood is, not only in plototin. BOZ OK, Good luck .....




Comments :

0 comments to “Create Menu Horizontal”

Post a Comment