Blogger Tips – Tricks – Gadgets – Templates – Hacks

Οριζοντιο menu-μπαρα με links



Print Friendly and PDFPrintPrint Friendly and PDFPDF


Πρόκειται για μια μπάρα-menu με links-συνδέσμους που τοποθετείται συνήθως κάτω από την επικεφαλίδα της σελίδας σας.



Εγκαθιστάται σαν απλό gadget.

 Ο κώδικας html του είναι:


<style type=”text/css”>
body {
margin:0;
padding:0;
font: bold 14px Verdana;
}
h2 {
font: bold 14px Verdana, Arial, Helvetica, sans-serif;
color: #ffffff;
margin: 0px;
padding: 0px 0px 0px 15px;
}
/*- Menu Tabs H————————— */
#tabsH {
float:left;
width:100%;
font-size:95%;
line-height:normal;
}
#tabsH ul {
margin:0;
padding:0px 5px 0 0px;
list-style:none;
}
#tabsH li {
display:inline;
margin:0;
padding:0;
}
#tabsH a {
float:left;
background:url([get_bloginfo]url[/get_bloginfo]/wp-content/themes/ctooem437d87yvdblwpns116496/files/2013/07/tablefth.gif) no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
}
#tabsH a span {
float:left;
display:block;
background:url(https://lh5.googleusercontent.com/-muwyDaV_THM/T8mHdxUM2DI/AAAAAAAAU04/BCkIxTvkWHo/h86/tabrightH.gif) no-repeat right top;
padding:5px 5px 6px 6px;
color:#FFF;
}
/* Commented Backslash Hack hides rule from IE5-Mac */
#tabsH a span {float:none;}
/* End IE5-Mac hack */
#tabsH a:hover span {
color:#FFF;
}
#tabsH a:hover {
background-position:0% -42px;
}
#tabsH a:hover span {
background-position:100% -42px;
}
</style>
<div id=”tabsH”>
<ul>
<li><a href=”http://www.bloggertips.gr/” ><span>category 1</span></a></li>
<li><a href=”http://www.bloggertips.gr/” ><span>category 2</span></a></li>
<li><a href=”http://www.bloggertips.gr/” ><span>category 3</span></a></li>
<li><a href=”http://www.bloggertips.gr/” ><span>category 4</span></a></li>
<li><a href=”http://www.bloggertips.gr/” ><span>category 5</span></a></li>
<li><a href=”http://www.bloggertips.gr/” ><span>category 6</span></a></li>
<li><a href=”http://www.bloggertips.gr/” ><span>category 7</span></a></li>
<li><a href=”http://www.bloggertips.gr/” ><span>category 8</span></a></li>
</ul>
</div>



όπου βλέπετε http://www.bloggertips.gr/ βάζετε το δικό σας link

και όπου λέει category βάζετε το όνομα που θέλετε να εμφανίζεται.



καταλαβαίνετε πως μπορείτε να προσθέσετε ή να αφαιρέσετε κατηγορίες



αν σας άρεσε κάντε ένα like στη σελίδα μας στο facebook



 Copyrights: http://www.bloggertips.gr/



7
comments:


Ανώνυμος
είπε…

Καλησπερα παιδια, συγγνωμη αλλα τετοια αναρτηση δεν εχει ξαναανεβει; Και νομιζω παραπανω απο μια φορες!
Ειναι που ειναι ξεπερασμενες οι συγκεκριμενες μπαρες, τουλαχιστον βαλτε τες ολες μαζι σε ενα ποστ για να τις βρισκουμε ολες μαζι ευκολοτερα! 😉
Φιλικα, Μπαουλο.

Maaste Blogerrmen
είπε…

thank you so much….the information was so helpful to me to improve myself a lot in my field….. Readers would be more happy if it the explanations are very clear to understand… Make Money , Blogging Tips

Kiron
είπε…

Thanks for sharing your valuable experience. Its too much effective specially for me. Waiting for another one. keep it up. Textile Flowchart

Dolon
είπε…

Nice post.

George Papas
είπε…

Καλησπέρα, έχω βρει ένα καταπληκτικό template. Το εγκατέστησα, δουλεύει μια χαρά, άλλαξα και το main menu με τα θέματα που με βολεύουν ΑΛΛΑ δεν μπορώ να βάλω τις αναρτήσεις στις κατηγορίες του μενού μου, ώστε να πατάω το κουμπί κάθε κατηγορίας κ να εμφανίζονται οι αντίστοιχες αναρτήσεις.

Ευχαριστώ εκ των προτέρων

το blog μου ειναι: http://papasgeorge.blogspot.gr/
κ το mail μου ειναι papas1069@gmail.com

192.168 ll
είπε…

σε ευχαριστώ που μοιράστηκες. πολύ χρήσιμο

Lily Oliver
είπε…

I enjoyed over read your blog post. Your blog have nice information, I got good ideas from this amazing blog. I am always searching like this type blog post. I hope I will see again.
madalin stunt cars
slope
super mario world

Δημοσίευση σχολίου

Παρακαλούμε τους φίλους αναγνώστες:

ΟΧΙ SPAM,
ΟΧΙ GREEKLISH,
ΟΧΙ ΠΡΟΣΒΛΗΤΙΚΑ ΣΧΟΛΙΑ

Παρακαλώ το σχόλιό σας να είναι σχετικό με την παραπάνω ανάρτηση.
Γενικές απορίες μόνο στη σελίδα μας στο facebook.