-->

σελίδες

 

Για επικοινωνία κάντε σχόλιο!
Και μην ξεχνάτε να διαβάζετε τα σχόλια.Υπάρχουν λύσεις και εκεί.

Πτυσσόμενο κείμενο για τις μεγάλες αναρτήσεις σας.

Ένα πτυσσόμενο κείμενο είναι πολύ χρήσιμο για τις αναρτήσεις ,ειδικά όταν είναι πολύ μεγάλες,για να μην τις φορτώνετε πολύ.
Πηγαίνουμε λοιπόν όπως πάντα στην επεξεργασία προτύπου και:

Πάνω από το /head
<style>.posthidden {display:none}
.postshown {display:inline}</style>

Πάνω από το /body
<script type="text/Javascript">
function expandcollapse (postid) {
whichpost = document.getElementById(postid);
if (whichpost.className=="postshown") { whichpost.className="posthidden"; } else { whichpost.className="postshown"; } }
</script>


Τέλος,μέσα στην ανάρτηση,κάθε φορά που θέλουμε να βάλουμε κάποιο πτυσσόμενο κείμενο βάζουμε τον εξής κώδικα:
<a href="javascript:expandcollapse('subtopicID')">
Κάντε κλικ να εμφανιστεί το κρυμμένο κείμενο</a>
<span class="posthidden" id="subtopicID">
Τώρα με βλέπεις,τώρα όχι</span>

Αλλάζουμε το Τώρα με βλέπεις,τώρα όχι με το κείμενο ή το βίντεο ή την εικόνα ή οτιδήποτε άλλο θέλουμε.

@Πνευματικά δικαιώματα ανάρτησης symvl.blogspot.com Επιτρέπεται η αντίγραφη με υποχρεωτικό ενεργό backlink πίσω στην πηγή με ένα κλικ.
Read more ...

Rotating images for your popular posts!


Today I will show you a short code that makes the image next to the description in your popular posts rotate on mouseover!

The installation is quite simple.After installing the gadget Popular posts save and go to edit template.Using cntrl + F look for / b: skin. Once you've found it click on dots between the SKIN tags and paste the following code.You can the effect live on my Popular posts down the page.


 <style type='text/css'> .PopularPosts ul li {background: none repeat scroll 0 0 transparent;float: left;list-style: none outside none;margin: 5px !important;padding: 0 !important;} .PopularPosts ul li img {padding:0;-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease;border: 2px solid #CCC;height: 80px;width: 80px;} .PopularPosts ul li img:hover {border:2px solid #BBB;-moz-transform: scale(1.2) rotate(-1090deg) ;-webkit-transform: scale(1.2) rotate(-1090deg) ;-o-transform: scale(1.2) rotate(-1090deg) ;-ms-transform: scale(1.2) rotate(-1090deg) ;transform: scale(1.2) rotate(-1090deg) ;} </style>


@Πνευματικά δικαιώματα ανάρτησης symvl.blogspot.com Επιτρέπεται η αντίγραφη με υποχρεωτικό ενεργό backlink πίσω στην πηγή με ένα κλικ.
Read more ...

Αυτόματο 'διαβάστε περισσότερα' στις αναρτήσεις σας.





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

Πολλά τέμπλειτς ειδικά αν είναι καινούρια ή αγορασμένα τον έχουν τον κώδικα έτοιμο.Στις τέμπλειτς που προσφέρει δωρεάν το μπλόγκερ όμως ο κώδικας αυτός δεν υπάρχει και πρέπει να προστεθεί.

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

1.Στην επεξεργασία προτύπου με cntr+F ψάχνουμε για /head

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



<script type='text/javascript'>
var thumbnail_mode = "no-float" ;
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 120;
img_thumb_width = 120;
</script>
<script type='text/javascript' src='http://widgets.way2blogging.org/blogger-widgets/w2b-auto-readmore-blogger.js' ></script>

2.Ψάχνουμε με cntr+F για
<data:post.body/>

και το αντικαθιστούμε με τον παρακάτω κώδικα.

<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/><b:else/><b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/><b:else/><div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div><script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script><div style='clear: both;'/><span class='rmlink' style='font-weight:bold;padding:5px;float:right;text-align:right;'><a expr:href='data:post.url' >Read more ... </a></span></b:if></b:if>

Προβλήματα που τυχόν θα αντιμετωπίσετε.
Στο τέμπλειτ σας μπορεί να υπάρχει ήδη ο κώδικας σκρίπτ με το summary, και μάλιστα πολλές φορές,  και αυτό το γεγονός να εμποδίζει τη σωστή λειτουργια του κώδικα.Οπότε ψάξτε στο τέμπλειτ με Cntl+F για summary και αφαιρέστε όλον τον κώδικα script που περιέχει μέσα το summary.

Επίσης αν υπάρχουν πάνω από ένα data:post.body αφήστε μόνο το τελευταίο.


@Πνευματικά δικαιώματα ανάρτησης symvl.blogspot.com Επιτρέπεται η αντίγραφη με υποχρεωτικό ενεργό backlink πίσω στην πηγή με ένα κλικ.
Read more ...

Εφέ για τις δημοφιλείς αναρτήσεις σας.


Σήμερα θα σας παρουσιάσω έναν σύντομο κώδικα που ΄φτιάχνει' λίγο τις δημοφιλείς αναρτήσεις σας,κάνοντας τις εικονίτσες που τις συνοδεύουν περιστρεφόμενες!

Η εγκατάστασή της είναι αρκετά απλή.Αφού κάνετε εγκατάσταση του γκάτζετ Δημοφιλείς αναρτήσεις αποθηκεύετε και πηγαίνετε στην επεξεργασία προτύπου.Με cntrl+F ψάχνετε για /b:skin .Αφού το βρείτε κάνετε κλικ στις τελείες ανάμεσα στα σκιν και κατόπιν επικολλείστε τον παρακάτω κώδικα.

 <style type='text/css'> .PopularPosts ul li {background: none repeat scroll 0 0 transparent;float: left;list-style: none outside none;margin: 5px !important;padding: 0 !important;} .PopularPosts ul li img {padding:0;-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px;-webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;transition: all 0.3s ease;border: 2px solid #CCC;height: 80px;width: 80px;} .PopularPosts ul li img:hover {border:2px solid #BBB;-moz-transform: scale(1.2) rotate(-1090deg) ;-webkit-transform: scale(1.2) rotate(-1090deg) ;-o-transform: scale(1.2) rotate(-1090deg) ;-ms-transform: scale(1.2) rotate(-1090deg) ;transform: scale(1.2) rotate(-1090deg) ;} </style>

@Πνευματικά δικαιώματα ανάρτησης symvl.blogspot.com Επιτρέπεται η αντίγραφη με υποχρεωτικό ενεργό backlink πίσω στην πηγή με ένα κλικ.
Read more ...

Αλλάξτε το βελάκι στο μπλογκ σας.


Σήμερα θα ασχοληθούμε λίγο με τον καλλωπισμό του μπλογκ μας και μετά από πολλά αιτήματα αναγνωστών μας σας δίνω έναν μικρό κώδικα για να αλλάξετε το βελάκι (κέρσορας) στο μπλογκ σας.Δείτε το μπλε κέρσορα στο δικό μου.Παρακάτω ακουλουθούν και διάφορα άλλα για να διαλέξετε.

Η εγκατάσταση είναι εύκολη .Στην επεξεργασία προτύπου με cntr+F ψάχνουμε για <body και ακριβώς ΚΑΤΩ από αυτό προσθέτουμε τον παρακάτω σύντομο κώδικα.

 <style type="text/css">body, a:hover {cursor: url(http://safir85.ucoz.com/24work-blogspot/mouse-cursor/COOL_BLUE_OUTER_GLOW_POINTER-www.24work.blogspot.c.cur), progress;}</style><a href="http://24work.blogspot.com" target="_blank" title="μικρές συμβουλές μπλόγκερ"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="μικρές συμβουλές μπλόγκερ" style="position:absolute; top: 0px; right: 0px;" /></a>


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



mouse pointer , cursor cursors , mouse cursor , tumblr cursors  , cursors for windows 7 , mouse icon , cursor pointer , free cursor , cursor download<style type="text/css">body, a:hover {cursor: url(http://safir85.ucoz.com/24work-blogspot/mouse-cursor/ANGRY_BIRDS-LINK_SELECT-www.24work.blogspot.com-.cur), progress;}</style><a href="http://24work.blogspot.com" target="_blank" title="μικρές συμβουλές μπλόγκερ"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a>




mouse pointer , cursor cursors , mouse cursor , tumblr cursors  , cursors for windows 7 , mouse icon , cursor pointer , free cursor , cursor download<style type="text/css">body, a:hover {cursor: url(http://safir85.ucoz.com/24work-blogspot/mouse-cursor/ANGRY_BIRDS-www.24work.blogspot.com-.cur), progress;}</style><a href="http://24work.blogspot.com" target="_blank" title="μικρές συμβουλές μπλόγκερ"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a>





mouse pointer , cursor cursors , mouse cursor , tumblr cursors , cursors for windows 7 , mouse icon , cursor pointer , free cursor , cursor download <style type="text/css">body, a:hover {cursor: url(http://safir85.ucoz.com/24work-blogspot/mouse-cursor/JAPANESE_RED_UMBRELLA-www.24work.blogspot.com-.cur), progress;}</style><a href="http://24work.blogspot.com" target="_blank" title="μικρές συμβουλές μπλόγκερ"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a>




mouse pointer , cursor cursors , mouse cursor , tumblr cursors  , cursors for windows 7 , mouse icon , cursor pointer , free cursor , cursor download<style type="text/css">body, a:hover {cursor: url(http://safir85.ucoz.com/24work-blogspot/mouse-cursor/BUFF-www.24work.blogspot.com-.cur), progress;}</style><a href="http://24work.blogspot.com" target="_blank" title="μικρές συμβουλές μπλόγκερ"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a>



mouse pointer , cursor cursors , mouse cursor , tumblr cursors  , cursors for windows 7 , mouse icon , cursor pointer , free cursor , cursor download<style type="text/css">body, a:hover {cursor: url(http://safir85.ucoz.com/24work-blogspot/mouse-cursor/COOL_BLUE_OUTER_GLOW_POINTER-www.24work.blogspot.c.cur), progress;}</style><a href="http://24work.blogspot.com" target="_blank" title="μικρές συμβουλές μπλόγκερ"><img src="http://safir85.ucoz.com/24work-blogspot/cursor-24work-10.png" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a>







Read more ...