ΠΩΣ ΒΑΖΩ ΣΤΑΤΙΚΑ BUTTONS ΜΕ LINKS
Με τους παρακάτω κώδικες μπορείτε να βάλετε στατικά buttons με links που να ανοίγουν στο ίδιο παράθυρο ή σε νέα καρτέλα ή ακόμα και σε νέο pop up window, όπως αυτά που έχω βάλει εγώ στο πάνω αριστερό μέρος του demo blog μου. Υπάρχει ανεκμετάλευτος χώρος στην navbar του blogger πρίν και μετά το κουμπί +1 του google+. Εκεί είναι η κατάλληλη θέση να τοποθετηθούν μερικά στατικά buttons με links. Το ύψος τους πρέπει να είναι 30px για να καλύπτει τη navbar του blogger. Το πλάτος τους μπορεί να είναι όσο θέλετε αρκεί να υπολογίσετε ότι εκεί που θα τελειώνει το πρώτο εικονίδιο π.χ. με πλάτος 50px το επόμενο πρέπει να αρχίζει στη θέση 51.
Με τους παρακάτω κώδικες μπορείτε να βάλετε στατικά buttons με links που να ανοίγουν στο ίδιο παράθυρο ή σε νέα καρτέλα ή ακόμα και σε νέο pop up window, όπως αυτά που έχω βάλει εγώ στο πάνω αριστερό μέρος του demo blog μου. Υπάρχει ανεκμετάλευτος χώρος στην navbar του blogger πρίν και μετά το κουμπί +1 του google+. Εκεί είναι η κατάλληλη θέση να τοποθετηθούν μερικά στατικά buttons με links. Το ύψος τους πρέπει να είναι 30px για να καλύπτει τη navbar του blogger. Το πλάτος τους μπορεί να είναι όσο θέλετε αρκεί να υπολογίσετε ότι εκεί που θα τελειώνει το πρώτο εικονίδιο π.χ. με πλάτος 50px το επόμενο πρέπει να αρχίζει στη θέση 51.
Αυτό θα το ρυθμίσετε αλλάζοντας το left:0px; Το ύψος και το πλάτος του
νέου pop up window αλλάζει αντικαθιστώντας τα
γαλάζια νούμερα του width=1000
& height=750. Το ύψος και
το πλάτος του εικονιδίου αλλάξει και αυτό αντικαθιστώντας τα γαλάζια νούμερα του width=30px & height=30px.
Αντικαταστήστε
το link με τα πράσινα γράμματα με το δικό σας link
που θέλετε να ανοίγει πατώντας το στατικό button. Σας δίνω 3 παραλλαγες του
κώδικα ο 1ος είναι για άνοιγμα στο
ίδιο παράθυρο, ο 2ος για άνοιγμα
σε νέα καρτέλα και ο 3ος για
άνοιγμα σε νέο pop up window.
ΣΤΑΤΙΚΑ BUTTONS ΜΕ LINKS. Κώδικας 1ος
άνοιγμα στο ίδιο παράθυρο.
<div
id="static-button" style="top:0px;left:0px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com/"><button
style="width:62px; height:25px; background:#FF6600;
color:#FFFFFF; font: 13px Arial;">HOME</button></a></div>
<div
id="static-button" style="top:0px;left:63px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com/"><button
style="width:90px; height:25px; background:#115595;
color:#FFFFFF; font: 13px Arial;">MY POSTS</button></a>
<div
id="static-button" style="top:0px;left:153px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com/"><button
style="width:83px; height:25px; background:#207907;
color:#FFFFFF; font: 13px Arial;">MY
LINKS</button></a>
<div
id="static-button" style="top:0px;left:236px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com/"><button
style="width:96px; height:25px; background:#FF1111;
color:#FFFFFF; font: 13px Arial;">MY
PHOTOS</button></a>
<div
id="static-button" style="top:0px;left:333px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com/"><button
style="width:90px; height:25px; background:#333333;
color:#FFFFFF; font: 13px Arial;">MY
VIDEOS</button></a></div>
<div
id="static-button" style="top:0px;left:334px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com/"><button
style="width:82px; height:25px; background:#FFFF00;
color:#000000;
font: 13px Arial;">MY MUSIC</button></a></div>
<div
id="static-button" style="top:0px;left:416px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com/"><button
style="width:80px; height:25px; background:#33FFFF;
color:#000000;
font: 13px Arial;">MY FILES</button></a></div>
ΣΤΑΤΙΚΑ BUTTONS ΜΕ LINKS. Κώδικας 2ος άνοιγμα σε νέα καρτέλα.
<div
id="static-button" style="top:0px;left:0px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com/"
target="_blank"><button style="width:62px; height:25px;
background:#FF6600; color:#FFFFFF; font: 13px
Arial;">HOME</button></a></div>
<div
id="static-button" style="top:0px;left:63px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com"
target="_blank"><button style="width:90px; height:25px;
background:#115595; color:#FFFFFF; font: 13px Arial;">MY
POSTS</button></a>
<div
id="static-button" style="top:0px;left:153px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com/"
target="_blank"><button style="width:83px; height:25px;
background:#207907; color:#FFFFFF; font: 13px
Arial;">MY LINKS</button></a>
<div
id="static-button"
style="top:0px;left:236px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com/"
target="_blank"><button style="width:96px; height:25px;
background:#FF1111; color:#FFFFFF; font: 13px
Arial;">MY PHOTOS</button></a>
<div
id="static-button" style="top:0px;left:333px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com/"
target="_blank"><button style="width:90px; height:25px;
background:#333333; color:#FFFFFF; font: 13px
Arial;">MY VIDEOS</button></a></div>
<div
id="static-button" style="top:0px;left:334px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com/"
target="_blank"><button style="width:82px; height:25px;
background:#FFFF00; color:#000000; font:
13px Arial;">MY
MUSIC</button></a></div>
<div
id="static-button" style="top:0px;left:416px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com/"
target="_blank"><button style="width:80px; height:25px;
background:#33FFFF; color:#000000; font:
13px Arial;">MY
FILES</button></a></div>
ΣΤΑΤΙΚΑ BUTTONS ΜΕ LINKS. Κώδικας 3ος
άνοιγμα σε νέο pop up window.
<div
id="static-button" style="top:0px;left:0px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com/"
target="_blank" onclick="window.open(this.href, 'popupwindow', 'width=1000,
height=750, resizable=no, scrollbars=yes,
menubar=no, toolbar=no, status=no'); return false;"><button
style="width:62px; height:25px; background:#FF6600;
color:#FFFFFF; font: 13px Arial;">HOME</button></a></div>
<div
id="static-button" style="top:0px;left:63px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com"
target="_blank" onclick="window.open(this.href, 'popupwindow', 'width=1000,
height=750, resizable=no, scrollbars=yes,
menubar=no, toolbar=no, status=no'); return false;"><button
style="width:90px; height:25px; background:#115595;
color:#FFFFFF; font: 13px Arial;">MY POSTS</button></a>
<div
id="static-button" style="top:0px;left:153px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com" target="_blank" onclick="window.open(this.href, 'popupwindow', 'width=1000,
height=750, resizable=no, scrollbars=yes,
menubar=no, toolbar=no, status=no'); return false;"><button
style="width:83px; height:25px; background:#207907;
color:#FFFFFF; font: 13px Arial;">MY
LINKS</button></a>
<div
id="static-button" style="top:0px;left:236px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com"
target="_blank" onclick="window.open(this.href, 'popupwindow', 'width=1000,
height=750, resizable=no, scrollbars=yes,
menubar=no, toolbar=no, status=no'); return false;"><button
style="width:96px; height:25px; background:#FF1111;
color:#FFFFFF; font: 13px Arial;">MY
PHOTOS</button></a>
<div
id="static-button" style="top:0px;left:333px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com"
target="_blank" onclick="window.open(this.href, 'popupwindow', 'width=1000,
height=750, resizable=no, scrollbars=yes,
menubar=no, toolbar=no, status=no'); return false;"><button
style="width:90px; height:25px; background:#333333;
color:#FFFFFF; font: 13px Arial;">MY
VIDEOS</button></a></div>
<div
id="static-button" style="top:0px;left:334px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com/"
target="_blank" onclick="window.open(this.href, 'popupwindow', 'width=1000,
height=750, resizable=no, scrollbars=yes,
menubar=no, toolbar=no, status=no'); return false;"><button
style="width:82px; height:25px; background:#FFFF00;
color:#000000;
font: 13px Arial;">MY MUSIC</button></a></div>
<div
id="static-button" style="top:0px;left:416px;position:fixed;z-index:999;">
<a
href="https://my-posts-1.blogspot.com/"
target="_blank" onclick="window.open(this.href, 'popupwindow', 'width=1000,
height=750, resizable=no, scrollbars=yes,
menubar=no, toolbar=no, status=no'); return false;"><button
style="width:80px; height:25px; background:#33FFFF;
color:#000000;
font: 13px Arial;">MY FILES</button></a> </div>
Δεν υπάρχουν σχόλια:
Δημοσίευση σχολίου
► Γράψτε το σχόλιό σας στο λευκό κουτί και αν θέλετε να ειδοποιηθήτε για την απάντηση τσεκάρετε το κουτάκι "Να λαμβάνω ειδοποιήσεις".
Σημείωση: Μόνο ένα μέλος αυτού του ιστολογίου μπορεί να αναρτήσει σχόλιο.