Καλησπερα παιδια, σημερα θα δουμε πως μπορουμε να σφησουμε το "Εγγραφή σε: Αναρτήσεις (Atom)" που υπαρχει στο τελος της σιλιδας μας. Ακομα θα δουμε και πως να σφησουμε μαζι με το παραπανω και το "Εγγραφή σε: Σχόλια ανάρτησης (Atom)" που υπαρχει στο τελος τις καθε αναρτησεις μας. Περα απο αυτο βεβαια δεν ειναι αρκετο απλα να σφησουμε κατι αλλα και να ξαναφτιαξουμε επειδη ειναι καλο να υπαρχει αλλα να ειναι σε πιο ωραια μορφη. Για παμε να δουμε.
1) Πρώτα από όλα, συνδεθείτε στο λογαριασμό σας Blogger.
2) Κάντε κλικ στο Σχεδίαση. και επιλέξτε Επεξεργασία HTML.
Προσοχή:
- Πρέπει να είστε προσεκτικοί κατά την αλλαγή του προτύπου σας.
4) Πατηστε Επέκταση προτύπων γραφικών στοιχείων.
5) Παμε τωρα να σφησουμε το "Εγγραφή σε: Αναρτήσεις (Atom)" ψαξτε λοιπον τον παρακατω κωδικα(Ctl+F):
<b:includable id='feedLinks'>
6) Λιγο πιο κατω θα βρειτε τον παρακατω κωδικα:
<b:include data='feedLinks' name='feedLinksBody'/>
- μολις τον βρειτε απλα σφηστε τον.
7) Στην συνεχεια παμε να σφησουμε και το "Εγγραφή σε: Σχόλια ανάρτησης (Atom)" ψαξτε για τον παρακατω κωδικα ή απλα πηγαιντελιγοπιο κατω απο κει που εισασταν πριν (Ctl+F):
8) Και παλι λιγο πιο κατω θα βρειτε τον παρακατω κωδικα οπου και θα τον σφησετε:
<b:include data='post.feedLinks' name='feedLinksBody'/>
- Και απλα πατηστε αποθηκευση προτυπου.
9) Παμε τωρα στο να δημιουργησουμε ενα σημειο οπου θα μπει αυτοπου μολις σφησαμε δηλαδη το "Εγραφη σε Feedburner".
- Αφου εχουμε κανει εγραφη στο Newsletter του Feedburner παμε δουμε πως να το φτιαξουμε.
10) Παμε λοιπον αφου ειστε ηδη στο Επεξεργασια Html ψαξτε για τον παρακατω κωδικα (Ctl+F):
- Και επικοληστε ακριβως απο πανω τον παρακατω κωδικα:
<style type='text/css'>
img { behavior: url(iepngfix.htc) }
#pageflip {
position: relative;
right: 0; top: 0;
float: right;
}
#pageflip img {
width: 50px; height: 52px;
z-index: 99;
position: absolute;
right: 0; top: 0;
-ms-interpolation-mode: bicubic;
}
#pageflip .msg_block {
width: 50px; height: 50px;
overflow: hidden;
position: absolute;
right: 0; top: 0;
background: url(http://img688.imageshack.us/img688/4919/10722345.png) no-repeat right top;
}
</style>
<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
//Page Flip on hover
$("#pageflip").hover(function() {
$("#pageflip img , .msg_block").stop()
.animate({
width: '307px',
height: '319px'
}, 500);
} , function() {
$("#pageflip img").stop()
.animate({
width: '50px',
height: '52px'
}, 220);
$(".msg_block").stop()
.animate({
width: '50px',
height: '50px'
}, 200);
});
});
</script>
img { behavior: url(iepngfix.htc) }
#pageflip {
position: relative;
right: 0; top: 0;
float: right;
}
#pageflip img {
width: 50px; height: 52px;
z-index: 99;
position: absolute;
right: 0; top: 0;
-ms-interpolation-mode: bicubic;
}
#pageflip .msg_block {
width: 50px; height: 50px;
overflow: hidden;
position: absolute;
right: 0; top: 0;
background: url(http://img688.imageshack.us/img688/4919/10722345.png) no-repeat right top;
}
</style>
<script src='http://code.jquery.com/jquery-latest.js' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function(){
//Page Flip on hover
$("#pageflip").hover(function() {
$("#pageflip img , .msg_block").stop()
.animate({
width: '307px',
height: '319px'
}, 500);
} , function() {
$("#pageflip img").stop()
.animate({
width: '50px',
height: '52px'
}, 220);
$(".msg_block").stop()
.animate({
width: '50px',
height: '50px'
}, 200);
});
});
</script>
- Τα κοκκινα γραμματα ειναι το url της εικονας οπου μπορειτε φυσικα να αλλαξετε.
11) Παμε τωρα να ψαξουμε να βρουμε το (Ctl+F) :
- Οπου απο κατω του επικολουμε τον παρακατω κωδικα:
<div id='pageflip'>
<a href='http://feeds.feedburner.com/BlogyTricks'><img alt='' src='http://img688.imageshack.us/img688/4919/10722345.png'/></a>
<div class='msg_block'></div>
</div>
<a href='http://feeds.feedburner.com/BlogyTricks'><img alt='' src='http://img688.imageshack.us/img688/4919/10722345.png'/></a>
<div class='msg_block'></div>
</div>
- Αλλαζετε φυσικα τα κοκινα γραμματα με τα δικα σας στοιχεια και την δικια σας εικονα.
12) Και αυτο ειναι ετοιμο και πολλη ωραιο!
- Demo ειναι το ιδιο μας το Blog, και το παρακατω Βιντεο:
- Για ότι πρόβλημα υπάρξει μην διστάσετε να επικοινωνήστε μαζί μας μεσώ του
κουμπιού "Επικοινωνία" που θα βρείτε πάνω πάνω.
- Αμα σας αρεσε παρακαλω προωθηστε το Blog μας ή πατηστε παρακολουθηση.
- Αμα σας αρεσε παρακαλω προωθηστε το Blog μας ή πατηστε παρακολουθηση.
Ευχαριστω.
Kανετε πολυ καλη δουλεια
ΑπάντησηΔιαγραφήΚαλη συνεχεια
Ευχαριστούμε!
ΑπάντησηΔιαγραφήκαλησπερα
ΑπάντησηΔιαγραφήεχω καποιο προβλημα σχετικα με το αρθρο αυτο
ΑπάντησηΔιαγραφή