• SANTORINI

    SANTORINI

  • SANTORINI

    SANTORINI

  • ZAKYNTHOS

    ZAKYNTHOS

  • LEYKADA

    LEYKADA

  • KEFALLONIA

    KEFALLONIA

  • KERKYRA

    KERKYRA

  • RODOS

    RODOS

GADGETS FOR BLOGS

YouTube GITHUB glitch.com JSBIN Start.me JSFIDDLE CODEPLY PASTEBIN.COM Repl.it CODEPEN CODEPEN

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

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

ΠΑΤΗΣΤΕ ΕΔΩ ΓΙΑ ΝΑ ΤΟ ΔΕΙΤΕ ΣΕ ΛΕΙΤΟΥΡΓΙΑ ΣΕ ΕΝΑ DEMO BLOG ►

<style>
#mbtnavbar {background: #173173;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://the-best-widgets.blogspot.gr'>My Forum</a></li>
<li><a href=''http://the-best-widgets.blogspot.gr'>My demo blog-1</a></li>
<li><a href=''http://the-best-widgets.blogspot.gr'>My demo blog-2</a></li>
<li><a href=''http://the-best-widgets.blogspot.gr'>My demo blog-3</a></li>
<li><a href=''http://the-best-widgets.blogspot.gr'>My demo blog-4</a></li>
<li><a href=''http://the-best-widgets.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'>Annimated Gifs</a></li>
<li><a href='https://drive.google.com'>Blogger backrounds</a></li>
<li><a href='https://app.box.com'>Ringtones</a></li>
<li><a href='https://app.box.com'>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" target="_blank">
<img border="0" alt="Facebook" style="width: 32px; height: 32px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7A-aXKFBlY08MDNyfHIiHDxVV5NdXH8ZVZKtYRSWkyOJdl1CmFCuq4BxeD331yiJTAUIJ8GCrGDhT9CSUpIggSrjPBbj6e20gnNInXMRKHOhzNvogpCwr9bK5Nnrv3r5exBYYwpIO19dG/s40-no/facebook-40.jpg"/></a>
<a href="https://plus.google.com" target="_blank">
<img border="0" alt="Google plus" style="width: 32px; height: 32px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh06j8VktvUjtXkZFAVL72j0K_tHIyqRQZiBG2She5sFyI2kYefuurpj2ZnmBZrtHfOaUbMc1DeAcZJHeQgj1rq8IGyutS2a7LHKV0USzN8i-C3usX6x3HrNi7q2Q6_84V8h2Rhh4_oS8Yd/s40-no/Google+40.jpg"/></a>
<a href="https://www.youtube.com" target="_blank">
<img border="0" alt="YouTube" style="width: 32px; height: 32px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguZhdAz7fHSvqWjy3Za2h7JMENFQxnHzt15gYF54V2tbOXwv_xq5Ir4WEn_cbNWB-Zg_rL1gGRYkpdfjEIBbEfKOIC7Z-JslTQFB7E0jrH9Ihtw4UbfX8q-e2D5ptjlUS-s-kw7sJ3V2Ah/s40-no/youtube-40.jpg"/></a>
<a href="http://www.pinterest.com" target="_blank">
<img border="0" alt="Pinterest" style="width: 32px; height: 32px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhbvIYUW366uhPj1kcjsVvrvG8tS_ryegzI5N0t3XLv4m3bze8tF1qNpRoZV6-DJPsl2EQdyKbffKzsHyFA8BB5h0kSJNRtll9M4cz3N4cDSc6HtCGaPCG8DZW8HmO25Mqtw6x5OP7XebUS/s40-no/pinterest-40.jpg"/></a>
<a href="https://delicious.com" target="_blank">
<img border="0" alt="Delicius" style="width: 32px; height: 32px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnWgsgkB34dlZJ6kkMq42SqYb70q9ChaNbRuFn4vyp8htr3z7xfyDwMTWxVjMeSOKL5B0wHKbuUloZvEFkuZkLf8elvu8cUd5_S9z_pht5tpe5E2MXKKHbcUUz0lhNZiWBvWQiusb6wnY/s48-no/delicious-42.png"/></a>
<a href="https://www.diigo.com" target="_blank">
<img border="0" alt="DIIGO" style="width: 32px; height: 32px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgoZG_lgjBQXMeHldcTWqKmcvbJwjcazrHMuaefxWWnopfeJJ4RnjpzDPbFRaYOFXz8bweF4jNf_f_lXYsTJ-MRLbZwqF3A6TK2LF0Ze7KjvxYJyfUVUq52OoxYrGhjMZCqKVQLahVl1so/s48-no/diigo-48.ico"/></a>
<a href="http://www.netvibes.com" target="_blank">
<img border="0" alt="NETVIBES" style="width: 32px; height: 32px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjE4umbSi7c6WwLYUL9MZRiKnJ8XoZS8WKBfhxlTzWDnO3b2eqDlMGb-9jGx3zd4bIuym5jSB3HlT1Y8uWN0wkydxjPPJg0u9zGpfVb5BiTeLKNskE3TIP4aOBDBaZ5o4YhsLclV7m3aIo/s48-no/Netvibes-48.png"/></a>
<a href="http://public.bookmax.net" target="_blank">
<img border="0" alt="Bookmax" style="width: 32px; height: 32px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRYgWscjLkA2UUF40dXCxGVbwtgg3Ia9Lfpa8vD_shyfC3RoLfJ8S62WfOQLgoKqOZGb06y8I1K3wK-62VAVWNdo2SUAwa_ZcQbDVUIQyL7NQ0LjyriCl3SCZ4AScTaanDOV1ejUpOay8/s48-no/bookmax-48.JPG"/></a>
<a href="http://feeds.feedburner.com" target="_blank">
<img border="0" alt="feedburner" style="width: 32px; height: 32px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiwHSPcZU3bAbe89vlpTDtj6Qsas4VE1-dy0cyYYzNLL7yjuNr9KbLVuZl_IiZMCTtMR4CXAGRZpsWhzqb4ZmbSWkH0NQj3Ow8QxnW2F8TG3ziKcDN9L0izs5g2G8hCABIL0VqMMIFnEV9Z/s40-no/rss-40.jpg"/></a></left></li></li></ul></div>

6 σχόλια:

  1. Ανώνυμος29/2/16 19:41

    Καλησπέρα, γιατί δεν μου κάνει αυτόματα τις ενημερώσεις, όταν κάνω ανάρτηση στην ήδη υπάρχουσα ετικέτα στο μενού?

    ΑπάντησηΔιαγραφή
    Απαντήσεις
    1. Αυτό εδώ το μενού δεν είναι αυτόματο. Ποιο μενού έχεις βάλει? Πρέεπει να το δώ στο blog σου ενώ το έχεις τοποθετήσει για να σου πώ, αλλιώς πως να ξέρω...

      Διαγραφή
    2. Ανώνυμος5/3/16 18:07

      Καλησπέρα, ευχαριστώ για την απάντηση.To blog είναι αυτό : http://evia-travel.blogspot.gr/
      Δεν είχα καταλάβει ότι δεν είναι αυτόματο. Γιαυτό δεν ανανεώνει αυτόματα... Τι θα μπορούσα να κάνω έτσι ώστε να μη χαλάσω τη διάταξη? αν υπάρχει κάποιος τρόπος. Περιμένω νέα σας. Ευχαριστώ.

      Διαγραφή
    3. Δεν γίνεται να ανανεώνει αυτόματα μεμονομένες αναρτήσεις που έχουν διαφορετικές ετικέτες. Μπορεί να εμφανίζει τις νέες αναρτήσεις που έχουν την ίδια γενική ετικέτα μόνο. Βλέπω πολλά λάθη στην εκμετάλευση χώρου του blog σου, και το μενού θέλει να απλωθεί και άλλο. Αν δεν ξέρεις να σου πώ αλλα δεν μπορώ να τα γράφω όλα αυτά, να μου στείλεις με μήνυμα στη σελίδα μου στο facebook ένα link απο το mozzilla hello να μηλίσουμε να σου πώ τι θα κάνεις να το φτιάξεις ευρύχωρο,εμφανίσιμο και λειτουργικό...

      Διαγραφή
    4. Ανώνυμος7/3/16 11:05

      Καλημέρα, σου έστειλα πμ στη σελίδα σου στο ΦΒ. Ευχαριστώ πάρα πολύ για όλα!

      Διαγραφή
  2. Ανώνυμος11/3/16 17:56

    Ο φίλος της σελίδας best widgets κάνει καταπληκτική δουλειά και απέδειξε ότι το blog είναι Τέχνη!! Ευχαριστούμε πολύ!!

    ΑπάντησηΔιαγραφή

► Γράψτε το σχόλιό σας στο λευκό κουτί και αν θέλετε να ειδοποιηθήτε για την απάντηση τσεκάρετε το κουτάκι "Να λαμβάνω ειδοποιήσεις".

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