Σάββατο 2 Απριλίου 2011

how-to:Feed Subscription Page Peel Effect Add For Blogger (στη πανω δεξια γωνια)


Από τα καλύτερα και αγαπημένα μου blogger hacks κι αυτό, που θέλω σήμερα να το μοιραστώ μαζί σας. Είναι ένα απίστευτα όμορφο blogger εφέ για το blog σας, που μπαίνει στην πάνω δεξιά γωνία του blog σας, ενώ αναδιπλώνει ανάλογα με τις κινήσεις του ποντικιού. Αυτό το add προοτρέπει τους επισκέπτες σας να εγγραφούν στο newletter σας στο feedburner.






Ακολουθήστε πιστά τα παρακάτω βήματα για να το εγκαταστήσετε στο blog σας:

1. Σύνδεση στον λογαριασμό μας από το blogger.com
2. Σχεδίαση> Επεξεργασία html
3. Με τη βοήθεια του ctrl+F βρείτε το </head> και επικολλήστε τον παρακάτω κωδικό αμέσως πάνω από το </head>

<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://www.wallheaven.com/subscribe.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

$(&quot;#pageflip&quot;).hover(function() {
$(&quot;#pageflip img , .msg_block&quot;).stop()
.animate({
width: &#39;307px&#39;,
height: &#39;319px&#39;
}, 500);
} , function() {
$(&quot;#pageflip img&quot;).stop()
.animate({
width: &#39;50px&#39;,
height: &#39;52px&#39;
}, 220);
$(&quot;.msg_block&quot;).stop()
.animate({
width: &#39;50px&#39;,
height: &#39;50px&#39;
}, 200);
});


});
</script>

To http://www.wallheaven.com/subscribe.png προτείνω να το αφήσετε όπως είναι αν δεν έχετε να βάλετε κάτι καλύτερο.

Εγω για μένα θα το άλλαζα με το http://i723.photobucket.com/albums/ww239/johnpatra/social%20networks/avoda0.png, τώρα εσείς δεν ξέρω αν έχετε κάτι τέτοιο :).


4. Τώρα βρείτε το και επικολλήστε τον παρακάτω κωδικό αμέσως μετά από το

<div id='pageflip'>
<a href='http://feeds.feedburner.com/Johnpatrablog'><img alt='' src='http://www.wallheaven.com/page_flip.png'/></a>
<div class='msg_block'></div>
</div>

Το Johnpatrablog στο http://feeds.feedburner.com/Johnpatrablog το αλλάζετε με τη διεύθυνση του δικού σας λογαριασμού στο feedburner. Πρέπει να βάλετε διεύθυνση μόνο από το feedburner αλλιώς δεν λειτουργεί! Και πρέπει να είναι της παραπάνω μορφής ΜΟΝΟ! Ουσιαστικά το μόνο που αλλάζετε είναι το Johnpatrablog.

Tο http://www.wallheaven.com/page_flip.png προτείνω να το αφήσετε όπως είναι αν δεν έχετε να βάλετε κάτι καλύτερο.

5. Αποθήκευση!
πηγη:bloggertips.gr



0 σχόλια:

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

Related Posts Plugin for WordPress, Blogger...