Για να περάσουμε ένα μονό ή διπλό dropdown menu με εικονίδια και mouseover στο blog μας θα πρέπει να κάνουμε τα παρακάτω βήματα:
BHMA 1
Κάνετε σύνδεση στον λογαριασμό σας από το http://blogger.comΠηγαίνετε: Διάταξη => Edit html και ψάξτε (με ctrl + f) για τον κώδικα
<head>
Κάνετε ακριβώς από κάτω του επικόλληση τον παρακάτω κωδικό και πατήστε αποθήκευση....
<link rel="stylesheet" type="text/css" href="http://ia601004.us.archive.org/22/items/Dhtmlcombo/dhtmlcombo.css" />
<script type="text/javascript" src="https://ia601900.us.archive.org/27/items/Dhtmlcombo_201309/dhtmlcombo.js"></script>
<script type="text/javascript" src="https://ia601900.us.archive.org/27/items/Dhtmlcombo_201309/dhtmlcombo.js"></script>
BHMA 2
Πηγαίνετε: Διάταξη => Στοιχεία σελίδας => Προσθήκη gadget => HTML/JavascriptΕπικολλήστε εκεί μέσα τον παρακάτω κώδικα:
<form> <b>
<!-- 1st example -->
<select id="webmaster" title="Τηλεοπτικοί Σταθμοί">
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 1ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 2ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 3ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 4ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 5ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 6ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 7ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
</select>
<script type="text/javascript">
//dhtmlselect("id_of_select_menu", "optional_width_of_select_box_px", "optional_width_of_drop_down_menu_px")
dhtmlselect("webmaster")</script>
<br>
<!-- 2nd example -->
<select id="network" title="Ραδιοφωνικοί Σταθμοί ">
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 1ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 2ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 3ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 4ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 5ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 6ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 7ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
</select>
<script type="text/javascript">
//dhtmlselect("id_of_select_menu", "optional_width_of_select_box_px", "optional_width_of_drop_down_menu_px")
dhtmlselect("network", "133px", "133px")
</script></b>
</form>
Κάνετε τις απαραίτητες αλλαγές περνώντας τα δικά σας λινκ και τις ονομασίες τους, αποθηκεύστε και είστε έτοιμοι.... ;)
ΒΟΗΘΗΜΑΤΑ
1, Αν δεν θέλετε διπλό το menu άλλα μονό απλά στο ΒΗΜΑ 2 βάλτε μόνο αυτόν τον κωδικό:
<form> <b>
<!-- 1st example -->
<select id="webmaster" title="Τηλεοπτικοί Σταθμοί ">
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 1ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 2ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 3ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 4ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 5ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 6ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 7ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
</select>
<script type="text/javascript">
//dhtmlselect("id_of_select_menu", "optional_width_of_select_box_px", "optional_width_of_drop_down_menu_px")
dhtmlselect("webmaster")</script>
</b>
</form>
<!-- 1st example -->
<select id="webmaster" title="Τηλεοπτικοί Σταθμοί ">
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 1ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 2ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 3ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 4ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 5ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 6ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 7ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
</select>
<script type="text/javascript">
//dhtmlselect("id_of_select_menu", "optional_width_of_select_box_px", "optional_width_of_drop_down_menu_px")
dhtmlselect("webmaster")</script>
</b>
</form>
2. Αν θέλετε τα 2 menu να μην έχουν κενό αναμεταξύ τους απλά αφαιρέστε τον κωδικό
<br>
από το 2ο βήμα...3. Το tip αυτό χρησιμοποιεί 2 αρχεία τα οποία έχω ανεβασμένα σε δικό μου hosting account ο οποίος υπάρχει περίπτωση να μην αντέξει την ζήτηση αν είναι μεγάλη....
Αν θέλετε μπορείτε να δημιουργήσετε δωρεάν ένα account στο Code.google.com να ανεβάσετε εκεί τα 2 αρχεία που θα σας δώσω παρακάτω και να αντικαταστήσετε τα λινκ του κώδικα 1ου βήματος με τα δικά σας για να μην υπάρξουν στο μέλλον προβλήματα bandwidth...Το πως θα το κάνετε μπορείτε να το δείτε πατώντας ΕΔΩ .
Επεξεργάζοντας τα 2 αυτά αρχεία μπορείτε να διαμορφώσετε τις διαστάσεις ή χρωματισμό του menu που σας εξυπηρετεί...

dhtmlcombo.css
dhtmlcombo.js
4. Μπορείτε να προσθέσετε ή να αφαιρέσετε λινκς από το menu προσθέτοντας ή αφαιρώντας όσες φορές θέλετε τον κώδικα:
<option value="ΕΔΩ ΒΑΖΕΤΕ ΤΟ 1ο LINK ΣΑΣ" />ΕΔΩ ΒΑΖΕΤΕ ΤΗΝ ΟΝΟΜΑΣΙΑ ΤΟΥ LINK
ΜΠΟΡΕΙΤΕ ΝΑ ΔΕΙΤΕ ΣΕ ΠΛΗΡΗ ΛΕΙΤΟΥΡΓΙΑ ΤΟ SCRIPT ΑΝ ΕΠΙΣΚΕΦΤΕΙΤΕ ΤΟ BLOG ΚΑΙ ΠΕΡΑΣΕΤΕ ΤΟ ΠΟΝΤΙΚΙ ΣΑΣ ΠΑΝΩ ΑΠΟ ΤΑ ΠΕΡΙΕΧΟΜΕΝΑ ΤΩΝ MULTIMEDIA
Ίσως να σου αρέσουν και αυτά:
0 Σχόλια...Αφήστε το δικό σας.:
Δημοσίευση σχολίου
Αφήστε ανώνυμα ή επώνυμα το σχόλιό σας (θετικό-αρνητικό) για αυτό το post ή απλά εκφράστε σχετικές απορίες σας...
HTML tags που μπορείτε να χρησιμοποιήσετε:@Από 19/09/2011 σχόλια που θα γράφονται με Greeklish θα διαγράφονται...
Έντονη γραφή
Πλάγια γραφή
Εικόνα
Κυλιόμενο κείμενο
Σύνδεσμος
Χρωματισμός Κειμένου (Αντικαταστήστε το red με # και τον κωδικό χρώματος που θέλετε)