Μετάβαση στο κύριο περιεχόμενο

Πώς βάζουμε οριζόντιο css μενού στο blog μας

Καλησπέρα σε όλους τους blogger σήμερα θα δούμε πως μπορούμε να ενσωματώσουμε οριζόντιο μενού στο blog μας με ρυθμίσεις css.
οριζόντιο css μενού στο blog

Μετά το βίντεο που θα δείτε θα ξέρετε:
  • Πώς θα ενσωματώσετε το κώδικα για το css μενού
  • Πώς θα διαμορφώσετε κατάλληλα το μενού σας
  • Πώς θα βάλετε ετικέτες σε συγκεκριμένη κατηγορία του μενού
Τον πιο κάτω κώδικα το βάζετε πάνω από το </head> όπως το κάνω και εγώ στο βίντεο που θα δείτε στο τέλος του άρθρου
<style type='text/css'> #catmenucontainer{ height:29px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2HPYakc-g92xHH3X_r3UeihkqFD6EHIRfQ4q6zs3L9qOhMOWHskvDkN88cgGAWzmEw_rrW-hGbm7deZ5bu_mR33AC5vxrxlSNymmtfV2Xz05OzcXleRacLnyRAX77V79wKa3GEUMeuWs/h120/catmenu.jpg) repeat-x; display:block; padding:0px 0 0px 0px; font: 14px "Century gothic",verdana, Arial, sans-serif; font-weight:normal; border-top:1px solid #686D6F; } #catmenu ,#catmenu ul { margin: 0px 5px; padding: 0px; list-style: none; height:29px; } #catmenu a { color: #999; display: block; font-weight: normal; padding: 4px 10px 6px 10px; } #catmenu a:hover { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJdcI1SKcFo5DenuotxcrZgLzc8ecjG4sH3IEI7qJB-9ME25HhYQlzPZXeWr-TrB9nCDnKPjzqSkiq1uRXQ4D1_RC9rW2sMPY97G_onPS8upPCnDLyXs2IlXdlXND6nob0ujFQnObv1i8/h120/catmenuhov2.jpg) repeat-x; color: #fff; display: block; text-decoration: none; } #catmenu li { float: left; margin: 0px; padding: 0px; } #catmenu li li { float: left; margin: 0px 0px 0px 0px; padding: 0px; width: 130px; } #catmenu li li a, #catmenu li li a:link, #catmenu li li a:visited { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2HPYakc-g92xHH3X_r3UeihkqFD6EHIRfQ4q6zs3L9qOhMOWHskvDkN88cgGAWzmEw_rrW-hGbm7deZ5bu_mR33AC5vxrxlSNymmtfV2Xz05OzcXleRacLnyRAX77V79wKa3GEUMeuWs/h120/catmenu.jpg) repeat-x; width: 150px; float: none; margin: 0px; padding: 4px 10px 5px 10px; color:#E8EBEE; border-bottom:1px solid #2C3133; } #catmenu li li a:hover, #catmenu li li a:active { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJdcI1SKcFo5DenuotxcrZgLzc8ecjG4sH3IEI7qJB-9ME25HhYQlzPZXeWr-TrB9nCDnKPjzqSkiq1uRXQ4D1_RC9rW2sMPY97G_onPS8upPCnDLyXs2IlXdlXND6nob0ujFQnObv1i8/h120/catmenuhov2.jpg) repeat-x; width: 150px; float: none; margin: 0px; padding: 4px 10px 5px 10px; color:#fff; border-bottom:1px solid #2C3133; } #catmenu li ul { position: absolute; width: 10em; left: -999em; z-index:1; } #catmenu li:hover ul { left: auto; display: block; } #catmenu li:hover ul, #catmenu li.sfhover ul { left: auto; } </style>


Τον επόμενο κώδικα το βάζετε σαν gadget 

<div id='catmenucontainer'> <div id='catmenu'> <ul> <li><a href='#' title='#'>Home</a></li> <li><a href='#' title='#'>link1</a></li> <li><a href='#' title='#'>link2</a></li> <li><a href='#' title='#'>link3</a></li> <li><a href='#' title='#'>link4</a></li> <li><a href='#' title='#'>link5</a></li> <li><a href='#' title='#'>link6</a></li> <li><a href='#' title='#'>link7</a></li> <li><a href='#' title='#'>link8</a></li> </ul> </div> </div>


Παρακολουθήστε το βίντεο για να καταλάβετε και εσείς πώς να ενσωματώσετε και να διαχειριστείτε το οριζόντιο μενού στο blog σας


Ετικέτες

Ετικέτες

Σχόλια

  1. Kathimerinidimiourgikotita.blogspot.com9 Απριλίου 2013 στις 8:36 μ.μ.

    thank you

    ΑπάντησηΔιαγραφή
  2. panakour9 Απριλίου 2013 στις 10:37 μ.μ.

    Δεν κάνει τίποτα Μαίρη να είσαι καλά!

    ΑπάντησηΔιαγραφή
  3. ANNA-SWEET25 Μαΐου 2013 στις 2:08 π.μ.

    παναγιοτι ποσ να αλαξο τα χροματα τον κινενον στο μενου και το φοντο τον κιμενον εφχαριστο

    ΑπάντησηΔιαγραφή
  4. panakour25 Μαΐου 2013 στις 2:24 π.μ.

    πιο χρώμα θέλεις στα γράμματα και πιο στο φόντο;

    ΑπάντησηΔιαγραφή
  5. ANNA-SWEET25 Μαΐου 2013 στις 3:02 μ.μ.

    τα χροματα τον κιμενον δλδ τα link1 link2 και τα φοντα οταν πασ το ποντικι να αλαζει το φοντο αντι για μαβρο ποθ εχει να το κανοθμε με διαφορετικο χρομα

    ΑπάντησηΔιαγραφή
  6. panakour25 Μαΐου 2013 στις 3:52 μ.μ.

    Εκεί που λέει background:url και έχει μέσα αυτό το url"https://lh3.googleusercontent.com/-8SU-uNf4yOM/UWF6HuynFjI/AAAAAAAADM4/Ann0I2O1FKY/h120/catmenuhov2.jpg" πρέπει να το αλλάξεις και να βάλεις ένα της επιλογής σου!

    ΑπάντησηΔιαγραφή
  7. Bizourouxa Pragmatakia2 Ιουνίου 2013 στις 1:57 μ.μ.

    pos ginete ba balo kai deyteri stili

    ΑπάντησηΔιαγραφή
  8. Κρίσταν Λαγουδάκης5 Αυγούστου 2013 στις 12:24 π.μ.

    ΓΕΙΑ ΣΟΥ ΦΙΛΕ ΠΑΝΑΓΙΩΤΗ. ΕΧΕΙΣ ΚΑΝΕΙ ΠΟΛΥ ΚΑΛΗ ΔΟΥΛΕΙΑ, ΜΠΡΑΒΟ! ΘΕΛΩ ΝΑ ΣΕ ΡΩΤΗΣΩ ΠΩΣ ΜΠΟΡΩ ΝΑ ΚΑΝΩ ΕΝΑ MENU ΜΕ ΣΕΛΙΔΕΣ ΟΙ ΟΠΟΙΕΣ ΝΑ ΜΗΝ ΕΙΝΑΙ STATIC ΩΣΤΕ ΝΑ ΜΠΟΡΩ ΝΑ ΚΑΝΩ ΠΕΡΙΣΣΟΤΕΡΕΣ ΑΠΟ ΜΙΑ ΑΝΑΡΤΗΣΕΙΣ ΣΕ ΚΑΘΕ ΣΕΛΙΔΑ...

    ΑπάντησηΔιαγραφή
  9. panakour5 Αυγούστου 2013 στις 10:11 π.μ.

    Γεια σου φίλε Κριστιαν, ευχαριστώ για τα καλά σου λόγια. Με το μενού που βλέπεις στον παρών άρθρο μπορεί να κάνει αυτό που ζητάς! Αν δεις στο βίντεο δείχνω πως να συνδέσουμε τις αναρτήσεις μας στο μενού!

    ΑπάντησηΔιαγραφή
  10. kstskollias27 Αυγούστου 2013 στις 3:38 μ.μ.

    Σε Ευχαριστώ πολύ για τις οδηγίες που έχεις δώσει και τα έχω κάνει καλά, αλλά θα μπορούσες να μου πεις πώς να βάλω δεύτερη σειρά ετικετών, γιατί μετά τη 12η δεν εμφανίζονται σωστά ή εγώ κάνω κάτι λάθος?
    Ευχαριστώ και πάλι!

    ΑπάντησηΔιαγραφή
  11. panakour31 Αυγούστου 2013 στις 10:21 π.μ.

    πως εμφανίζονται; μήπως δεν τις χωράει;

    ΑπάντησηΔιαγραφή
  12. Unknown5 Σεπτεμβρίου 2013 στις 5:04 μ.μ.

    Γεια σας θέλω βοήθεια για το θέμα του μενού. Θέλω να έχω 2 στήλες που να κάνω αναρτήσεις. Στην πρώτη κανονικά έχω όλες τις αναρτήσεις μου, αλλά στην δεύτερη στήλη έχω ένα κείμενο μόνο. Όταν θέλω να βάλω δεύτερο πρεπει να σβήσω το πρώτο;

    ΑπάντησηΔιαγραφή
  13. panakour8 Σεπτεμβρίου 2013 στις 8:31 μ.μ.

    Γιατί να σβήσεις το πρώτο; Δεν το χρειάζεσαι;

    ΑπάντησηΔιαγραφή
  14. Unknown7 Οκτωβρίου 2013 στις 8:02 μ.μ.

    Καλησπερα να ρωτησω κατι? Στις αναρτησεις μου βαζω ετικετα ωστε να μπαινει η καθε αναρτηση στη κατηγορια που θελω. Τα εχω κανει μια χαρα μεχρι εδω. Ομως τωρα που εκανα αναρτηση και εβαλα ετικετα δεν μου το εβΑλε στην κατηγορια που ηθελα παρα στην αρχικη σελιδα.. Μια βοηθεια παρακαλω

    ΑπάντησηΔιαγραφή
  15. panakour7 Οκτωβρίου 2013 στις 8:46 μ.μ.

    Αυτό που λες δεν μπορεί να γίνει, σίγουρα κάνεις κάτι λάθος, αν δεν δω δεν μπορώ να καταλάβω τι κάνεις λάθος

    ΑπάντησηΔιαγραφή
  16. panakour14 Ιανουαρίου 2014 στις 6:06 μ.μ.

    τι πρόβλημα έχεις αδερφέ;

    ΑπάντησηΔιαγραφή
  17. Ανώνυμος2 Φεβρουαρίου 2014 στις 11:46 μ.μ.

    ολα καλα δουλευουν μονο στο μενου οταν παταω ΗΟΜΕ δεν με βγαζει στην αρχικη σελιδα (την αρχικη σελιδα την δειχνει κατω κατω στις αναρτησεις μου) ,ενω οι αλλες κατηγοριες μενου δουλευουν και μπαινουν κανονικα τα βιντεο (στο μενου βιντεο) η μουσικη (στο μενου μουσικη) και αλλα. τι κανω λαθος? και αν μπορεις παρακαλω να κανεις ενα βιντεο για το πως να βαλουμε υπομενου μεσα στα μενου μας. αυτα. ευχαριστω.

    ΑπάντησηΔιαγραφή
    Απαντήσεις
    1. panakour13 Φεβρουαρίου 2014 στις 5:24 μ.μ.

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

      Διαγραφή
  18. Harris3213 Μαρτίου 2014 στις 1:51 π.μ.

    Aderfe m kalhspera, exw ena sovaro provlima, dimiourgo ena blog, afou exw sundesei ta link selidwn me ths sugekrimenes tou menu, otan paw na arxisw thn sunthesi kai afou telewso kanontas apothikeush dhmosieush, dixnei san na mhn exw grapsei tipota!!! Ti mporei na sumvainei? Elpizw na katalaves

    ΑπάντησηΔιαγραφή
    Απαντήσεις
    1. panakour13 Μαρτίου 2014 στις 10:12 π.μ.

      Καλημέρα αδερφέ, πλέον όλες οι απορίες θα λύνονται στο φόρουμ μας εδώ blogger forum

      Ευχαριστώ!

      Διαγραφή
  19. STELLA SIGOURTSIDOU13 Σεπτεμβρίου 2014 στις 10:37 π.μ.

    Γεια σου, Ευχαριστώ για τη βοήθειά σου . κάνω όλα τα βήματα όλα εντάξει όταν ομως προσθέτω το λινκ για τη ετικέτα που θέλω να παραπέμψω μου βγάζει αυτό Ο τρέχων λογαριασμός σας () δεν έχει δικαίωμα πρόσβασης για προβολή αυτής της σελίδας γιατί; . χρειάζεται καποια ρύθμιση; ευχαριστώ!

    ΑπάντησηΔιαγραφή
  20. info4foods.blogspot.com12 Οκτωβρίου 2014 στις 3:08 π.μ.

    Thelo na allakso to xroma sto menou,alla den ksero pos na epilekso to kainourgio.Mporeis na boithiseis?

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

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

Όλες οι απορίες πλέον θα λύνονται μόνο μέσα στο φόρουμ το οποίο μπορείτε να βρείτε εδώ http://forum.click4money.gr/
Ο λόγος είναι για να μαζεύεται όλο το υλικό εκεί και να μην απαντάμε συνέχεια στα ίδια ερωτήματα

Δημοφιλείς αναρτήσεις από αυτό το ιστολόγιο

Σπάσιμο κωδικών facebook

Πώς μπορεί κάποιος να σας κλέψει τον κωδικό του Facebook (hack facebook). Παρακάτω σας έφτιαξα ένα βίντεο που μου ζητήσατε για το πως σπάμε κωδικούς στο facebook εύκολα. Με ένα απλό τρόπο μπορεί να σας κλέψουν το κωδικό του facebook . Το βίντεο είναι καθαρά για εκπαιδευτικούς σκοπούς.   Τον οδηγό αυτό κυρίως τον έφτιαξα για αρχάριους, να μπορούν να δουν ένα από τους πολλούς τρόπους που μπορεί κάποιος έμπειρος hacker να κλέψει τον κωδικό του ς. Μετά από το βίντεο θα έχετε μια άλφα γνώση και θα μπορείτε να προστατευτείτε. Τα εργαλεία που θα χρειαστείτε για να το κάνετε και εσείς :   http://lefta4klik.blogspot.gr/2012/12/spasimo-kodikon-crack-wep.html Όποιος έχει απορίες για το πως να σπάσω κωδικό facebook ας αφήσει σχόλιο να το βοηθήσουμε. Σημείωση : Η τεχνική αυτή δουλεύει όταν οι υπολογιστές βρίσκονται στο ίδιο δίκτυο.  Πώς σπάμε κωδικούς του φβ - Δείτε τον οδηγό βίντεο ...
212 σχόλια
Διαβάστε περισσότερα

Σπάσιμο κωδικών email και τρόποι προστασίας αυτών

Καλησπέρα φίλοι και αναγνώστες του  blog μου, σήμερα θα σας δείξω ένα οδηγό βίντεο με τον οποίο μπορεί κάποιος να μας κλέψει τον κωδικό του email μας όπως επίσης και τρόπους με τους οποίους μπορούμε να προστατευτούμε. Με αυτό το τρόπο μπορούμε να ανιχνεύσουμε  κωδικούς hotmail, windows live και gmail . Στον οδηγό βίντεο σας δείχνω για hotmail που με τον ίδιο τρόπο γίνετε και για τα windows live.  Για gmail στην επιλογή "Single target" που σας δείχνω στο βίντεο αντί για "pop3.live.com" βάζουμε "smtp.gmail.com", στην "Port" βάζουμε 465, και στο "Protocol" βάζουμε "smtp", επίσης βάζουμε τικ και στην επιλογή "Be verbose", τα άλλα τα κάνουμε όπως και στο βίντεο. Θα χρειαστούμε  Backtrack ( το backtrack το κατεβάζετε εδώ ή  εδώ για torrent ). Το προγραμμάτακι "Hydra-gdk" το οποίο είναι ενσωματωμένο στο backtrack, θα το βρείτε στο μενού => Application-Backtrack-Privilege Escalation- Passwo...
111 σχόλια
Διαβάστε περισσότερα

Κουμπιά κοινωνικής δικτύωσης στο blog

Σήμερα θα σας δώσω πολύ ωραία gadget με κουμπιά για like,tweet,+1 όπως αυτά που βλέπετε παρακάτω. Μπορείτε να το προσθέσετε εύκολα στο blog σας με την γνωστή διαδικασία που αναφέρω ξανά πιο κάτω. Σύνδεση στο λογαριασμό μας στο blogger.com Διάταξη  Προσθήκη gadget HTML/JavaScript Αντιγραφή επικόλληση και αποθήκευση του κώδικα που έχει το χρώμα που θέλουμε (γράφω πάνω από κάθε κώδικα τι χρώμα έχει το gadget) Σημείωση : Για να εμφανιστεί και το κουμπί της google με το "+1" πρέπει να προσθέσετε το κώδικα που σας δίνω παρακάτω, εκτός και αν το προσθέσατε πιο παλιά. Για να το βάλουμε επιλέγουμε από το μενού "πρότυπο" ακολούθως "Επεξεργασία HTML" πατάμε "ctrl + f" για να ψάξουμε το "<head>", μόλις το βρούμε το προσθέτουμε μέσα στο head τμήμα κώδικα. Κώδικας για το κουμπί  +1 <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> Άσπρο <style>#floati...
5 σχόλια
Διαβάστε περισσότερα