ΟΡΙΖΟΝΤΙΟ ΜΕΝΟΥ ΜΕ ΥΠΟΜΕΝΟΥ & SOSIAL ICONS ΣΑΝ GADGET No 1B

ΟΡΙΖΟΝΤΙΟ ΜΕΝΟΥ ΜΕ ΥΠΟΜΕΝΟΥ & SOSIAL ICONS ΑΠΛΟ ΣΑΝ GADGET No 1B
MENU WITH ICONS
Αυτό είναι ένα απλό οριζόντιο μενού με υπομενού το οποίο τοποθετήται σαν gadgetκάτω ακριβώς από τον τίτλο του blog σας και είναι αυτό που βλέπετε σε αυτό το blog. Δεν θα χρειαστεί δηλαδή να προσθέσεται κάτι στο πρότυπο του blog σας, αλλά θα χρειαστεί να αφαιρέσετε την ενότητα TABS που βρίσκεται περίπου στις γραμμές 325-373 πέντε γραμμές πάνω ή πέντε γραμμές κάτω θα τον βρήτε ανοίγωντας το πρώτο βελάκι που θα συναντήσετε μέσα στο πρότυπο σας για να φανεί το κρυμένο μέρος του κώδικα της σελίδας σας.

Ο κώδικας TABS αρχίζει έτσι /* Tabs ----------------------------------------------- */και έχει μήκος περίπου 50 γραμμές. Πρέπει να τον διαγράψετε αν θέλετε να λειτουργήσει το gadget του οριζοντίου μενού με υπομενού που σας δίνω παρακάτω. Αφου το διαγράψετε σώστε το πρότυπό σας και πηγαίνετε στη διάταξη / προσθήκη gadget  / HTML/Javascript  και κάντε επικόλληση τον παρακάτω κώδικα. Μην ξεχάσετε να αλλάξετε τα links μουμε τα δικά σας links.
ΠΑΤΗΣΤΕ ΕΔΩ ΓΙΑ ΝΑ ΤΟ ΔΕΙΤΕ ΣΕ ΛΕΙΤΟΥΡΓΙΑ ΣΕ ΜΙΑ DEMO ΣΕΛΙΔΑ

<style>
#mbtnavbar {
background: #255720;
width: 100%;
color: #FFFFFF;
margin: 0;
padding: 0;
position: relative;
border:1px solid #FBBB22;
height:32px;}
#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;}
#mbtnav li a, #mbtnav li a:link, #mbtnav li a:visited {
color: #FFFFFF;
display: block;
font:normal 14px Arial;
margin: 0;
padding: 8px 8px 8px 8px;
text-decoration: none;
border-right:1px solid #FBBB22;}
#mbtnav li a:hover, #mbtnav li a:active {
background: #740777;
color: #FFFFFF;
display: block;
text-decoration: none;
margin: 0;
padding: 8px 8px 8px 8px;}
#mbtnav li {
float: left;
padding: 0;}
#mbtnav li ul {
z-index: 9999;
position: absolute;
left: -999em;
height: auto;
width: 242px;
margin: 0;
padding: 0;}
#mbtnav li ul a {width: 242px;}
#mbtnav li ul ul {margin: 1px 1px 1px 1px;}
#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: #173374;
width: 242px;
color: #FFFFFF;
display: block;
font:normal 14px Arial;
margin:0px;
padding: 8px 8px 8px 8px;
text-decoration: none;
border-bottom:1px solid #FBBB22;
z-index:9999;}
#mbtnav li li a:hover, #mbtnav li li a:active {
background: #FFFF00;
color: #000000;
display: block;}
#mbtnav li li li a, #mbtnav li li li a:link, #mbtnav li li li a:visited {
background: #207907;
width: 242px;
color: #FFFFFF;
display: block;
font:normal 14px Arial;
padding: 4px 8px 4px 8px;
text-decoration: none;
z-index:9999;}
#mbtnav li li li a:hover, #mbtnav li li li a:active {
background: #207907;
color: #FFFFFF;
display: block;}
</style>
<div id='mbtnavbar'>
<ul id='mbtnav'>
<li><a href='http://the-best-widgets.blogspot.gr'>HOME</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/p/my-posts.html'>MY POSTS ▼</a><ul>
<li><a href='http://the-best-widgets.blogspot.gr/p/my-posts.html'> Όλα τα άρθα (μόνο τίτλοι)</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/p/my-posts_19.html'>Όλα τα άρθα (τίτλοι και εικόνες)</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/search/label/ΟΡΙΖΟΝΤΙΑ ΚΑΙ ΚΑΘΕΤΑ ΜΕΝΟΥ'>Οριζόντια και κάθετα μενού</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/search/label/ΚΥΛΙΟΜΕΝΑ LINKS TEXT IMAGES'>Kυλιομενα links text images</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/search/label/SOSIAL NETWORKS BUTTONS'>Sosial networks buttons</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/search/label/SLIDESHOWS'>Slideshows & galleries</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/search/label/FACEBOOK WIDGETS'>Facebook widgets</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/search/label/WIDGETS ΓΙΑ BLOGS'>Άλλα widgets για blogs</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/search/label/ΜΟΡΦΟΠΟΙΗΣΗ BLOG'>Μορφοποίηση blog</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/search/label/ΕΝΣΩΜΑΤΩΣΗ ΑΡΧΕΙΩΝ'>Ενσωματώσεις</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/search/label/ΑΣΦΑΛΕΙΑ BLOG'>Ασφάλεια blog</a></li></ul></li>
<li><a href='http://the-best-widgets.blogspot.gr/p/blog-page_3.html'>MY ARTICLES</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/p/blog-page_11.html'>MY LINKS ▼</a><ul>
<li><a href='http://the-best-widgets.blogspot.gr/p/blog-page_11.html'>My links</a></li>
<li><a href='http://widgets.freeforums.net'>My Forum</a></li>
<li><a href='http://gadgetsforblogs1.blogspot.gr'>My demo blog-1</a></li>
<li><a href='http://gadgetsforblogs2.blogspot.gr'>My demo blog-2</a></li>
<li><a href='http://gadgetsforblogs3.blogspot.gr'>My demo blog-3</a></li>
<li><a href='http://gadgetsforblogs4.blogspot.gr'>My demo blog-4</a></li>
<li><a href='http://gadgetsforblogs5.blogspot.gr'>My demo blog-5</a></li>
</ul></li>
<li><a href='http://the-best-widgets.blogspot.gr/p/wigdets.html'>MY VIDEOS </a><ul>
<li><a href='https://www.youtube.com/user/WIDGETSFORBLOGS'>Widgets for blogs videos</a></ul>
<li><a href='#'>MY PHOTOS ▼</a><ul>
<li><a href='http://the-best-widgets.blogspot.gr/p/imgur-slideshow.html'>Imgur slideshow</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/p/flickr-slideshow.html'>Flickr slideshow</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/p/picasa-slideshow.html'>Picasa slideshow</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/p/panoramio-slideshow.html'>Panoramio slideshow</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/p/widgets_859.html'>Pinterest photo gallery</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/p/photobucket-slideshow.html'>Photobucket slideshow</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/p/photo-gallery-1.html'>My photo gallery-1</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/p/photo-gallery-2.html'>My photo gallery-2</a></ul></li>
<li><a href='http://the-best-widgets.blogspot.gr/p/widgets_26.html'>MY FILES ▼</a><ul>
<li><a href='https://drive.google.com/folderview?id=0B8GeBeRdN9NsX0RKYzZOemtwOWM&usp=sharing'>Annimated Gifs</a></li>
<li><a href='https://drive.google.com/folderview?id=0B8GeBeRdN9NsT3VPRkpOYmUwSVU&usp=sharing'>Blogger backrounds</a></li>
<li><a href='https://app.box.com/s/chdfmak9du0v6hlg0h5b'>Ringtones</a></li>
<li><a href='https://app.box.com/s/if98ihmj6bs15f69bro2'>Free programs</a></ul></li>
<li><a href='http://the-best-widgets.blogspot.gr/p/blog-page.html'>MY MUSIC</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/p/my-forum.html'>FORUM+CHAT</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/p/widgets_9083.html'>RADIO+TV</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/p/wigdets_31.html'>NEWS</a></li>
<li><a href='http://the-best-widgets.blogspot.gr/p/widgets_3619.html'>RSS</a></li>
<left>
<a href="https://www.facebook.com/widgetsforblogs" target="_blank">
<img border="0" alt="Facebook" style="width: 32px; height: 32px;" src="https://lh5.googleusercontent.com/-2MBwof2uxV4/VRQN0nW6JDI/AAAAAAAAQUY/JOwLKi_llyA/s40-no/facebook-40.jpg"/></a>
<a href="https://plus.google.com/113381416528370124258/posts" target="_blank">
<img border="0" alt="Google plus" style="width: 32px; height: 32px;" src="https://lh4.googleusercontent.com/-IgW-E6gh6co/VRQN0u4sKZI/AAAAAAAAQUM/O0WMlEhgDlk/s40-no/Google%2B40.jpg"/></a>
<a href="https://www.youtube.com/user/WIDGETSFORBLOGS" target="_blank">
<img border="0" alt="YouTube" style="width: 32px; height: 32px;" src="https://lh5.googleusercontent.com/-5yqWFAAr9W4/VRQN6lH0AWI/AAAAAAAAQU0/0aiBGC97W_E/s40-no/youtube-40.jpg"/></a>
<a href="http://www.pinterest.com/photos1000" target="_blank">
<img border="0" alt="Pinterest" style="width: 32px; height: 32px;" src="https://lh5.googleusercontent.com/-_uS5seiyCu4/VRQN0qs40YI/AAAAAAAAQUQ/d5ItE7IzCzE/s40-no/pinterest-40.jpg"/></a>
<a href="https://delicious.com/dikefalos" target="_blank">
<img border="0" alt="Delicius" style="width: 32px; height: 32px;" src="https://lh3.googleusercontent.com/-iqUxl3Gubn8/U6FVYT5KMAI/AAAAAAAALvg/f9vmkBw5Q8s/s48-no/delicious-42.png"/></a>
<a href="https://www.diigo.com/profile/dikefalos" target="_blank">
<img border="0" alt="DIIGO" style="width: 32px; height: 32px;" src="https://lh6.googleusercontent.com/-P6gzA9pj4Ek/VO2_tk-M9jI/AAAAAAAAPGs/YrbFnD0Sxbg/s48-no/diigo-48.ico"/></a>
<a href="http://www.netvibes.com/dikefalos-aetos" target="_blank">
<img border="0" alt="NETVIBES" style="width: 32px; height: 32px;" src="https://lh3.googleusercontent.com/-1odY6l9729s/U9O5wh1vuBI/AAAAAAAAMb4/sKvrA5FbdlI/s48-no/Netvibes-48.png"/></a>
<a href="http://public.bookmax.net/dikefalos" target="_blank">
<img border="0" alt="Bookmax" style="width: 32px; height: 32px;" src="https://lh5.googleusercontent.com/-3kGW4W7Xz3Y/VO3Pgj0PJNI/AAAAAAAAPIM/aMRxDkbh0PA/s48-no/bookmax-48.JPG"/></a>
<a href="http://feeds.feedburner.com/widgetsforblogs" target="_blank">

<img border="0" alt="feedburner" style="width: 32px; height: 32px;" src="https://lh5.googleusercontent.com/-efMeywtgsHg/VRQN6OC6OFI/AAAAAAAAQUw/8Nf4MvDk0rg/s40-no/rss-40.jpg"/></a></left></li></li></ul></div>

Δεν υπάρχουν σχόλια:

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

Σημείωση: Μόνο ένα μέλος αυτού του ιστολογίου μπορεί να αναρτήσει σχόλιο.