Κρυφό Share Menu
ένα μενού που βρίσκεται στη δεξιά πλευρά του blog σας, στατικό, κρυφό, και ανοίγει όταν περνάει από πάνω το ποντίκι σας...
Γιατί το Blogs σας αργεί να Ανοίξει.Πρέπει να το Διαβάσουν Ολοι οι Bloggers
Μάθετε, τι είναι αυτό που αργεί το άνοιγμα του blog σας, και αν είναι δυνατόν, διορθώστε το ...
Floating menu - Αναπτυσσόμενο μενου
Eνα πολύ όμορφο, πρακτικό και εύκολο μενου, πιάνει λίγο χώρο, γιατί αναπτύσσεται μόλις περάσει από πάνω του το ποντίκι...
Gadget για Facebook Pop up Like Μιας Χρήσεως
Και ο τίτλος σημαίνει οτι αυτό το gadget θα εμφανιστεί ΜΟΝΟ ΜΙΑ ΦΟΡΑ, σε κάθε επισκέπτη σας, ...
Μειώστε Το Κενό Πανω+Κάτω Απο το Header / Reduce the space above+after header
...μειώσετε το κενό, ανάμεσα στη κορυφή του blog, και της κεφαλίδας του τίτλου......
Μειώστε το κενό ανάμεσα στις αναρτήσεις του blog
Μειώσετε τα κενά ανάμεσα στις αναρτήσεις σας (εφ' όσον ανεβάζετε μια ανάρτηση κάθε ημέρα η περισσότερο)...
Αφαιρέστε το: Εγγραφή σε Αναρτήσεις (Atom)
Πολλοί από εσάς θέλετε να σβήσετε από το blog σας τη φράση "Εγγραφή σε Αναρτήσεις (Atom)"....
Πρόσφατες Αναρτήσεις από το dr-blogger

Μια ανάρτηση με 2 αναρτήσεις


Εδω βλέπουμε μία ανάρτηση στην αριστερή πλευρά της ανάρτησης του blog μας με background, και border που μεγαλώνει και γίνεται όσο το κείμενο


World's Clock / Διεθνές Ρολόι (script)


Νέοι bloggers γεια σας
Ενα πανέμορφο script σας δείχνει πολύ εύκολα και κατατοπιστικά τι ώρα είναι σε κάθε χώρα του πλανήτη... Εσείς απλά βάζετε τον κέρσορα, πάνω από τη χώρα που θέλετε (στον χάρτη) να μάθετε τι ώρα είναι, και σας παρουσιάζει την ώρα της χώρας  αυτής...


 Κάντε copy-paste (αντιγραφή-επικόλληση) τον παρακάτω κώδικα σαν gadget / javaScript πατήστε αποθήκευση, και μετά μετακινείστε το gadget σε όποιο σημείο του blog σας ταιριάζει :


<script src="http://www.clocklink.com/embed.js"></script><script type="text/javascript" language="JavaScript">obj=new Object;obj.clockfile="world001-green.swf";obj.TimeZone="GMT0530";obj.width=480;obj.height=250;obj.wmode="transparent";showClock(obj);</script>


***Η κόκκινη φράση είναι το χρώμα...αλλάξτε το με blue , κλπ...ανάλογα με τα χρώματα του blog σας
***Οι μπλε αριθμοί είναι το μέγεθος του χάρτη...
Αυτό ήταν όλο !!! ΚΑΛΗ ΕΠΙΤΥΧΙΑ...
ΠΗΓΗ :  javascriptfreecode.com/


Εδω βλέπουμε μία ανάρτηση στην δεξιά πλευρά της ανάρτησης του blog μας με background, και border που μεγαλώνει και γίνεται όσο το κείμενο


Dancing Links / Κινούμενα Λινκ


Νέοι bloggers γεια σας !!!Υπάρχει τρόπος να κάνουμε τα links και τις εικόνες στο blog μας να κινούνται όταν περνάμε από πάνω τους το ποντίκι μας...Σήμερα θα σας δώσω τον κώδικα για να κάνετε τα links στο ιστολόγιο σας να κινούνται όταν περνάτε το ποντίκι σας από πάνω τους !!!Δείτε την εικόνα, και το παράδειγμα εδώ....
Demo link No 1
Demo link No 2


Βρείτε τη φράση  </head>  (με ctrl F) όπως δείχνει στην εικόνα:



και ΠΑΝΩ από αυτή, βάλτε τον κώδικα:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js' type='text/javascript'>
</script>
<script type='text/javascript'>
    var dur = 400; // Duration Of Animation in Milli Seconds
    $(document).ready(function() {
        $('a.linknudge').hover(function() {
            $(this).animate({
                paddingLeft: '25px'
            }, dur);
        }, function() {
            $(this).animate({
                paddingLeft: 0
            }, dur);
        });
    }); // end of Jquery Script
</script>
Πατήστε SAVE / ΑΠΟΘΗΚΕΥΣΗ.....
Τώρα όποτε βάζετε ένα link, θα προσθέτετε τη φράση  class='linknudge' για να λειτουργήσει η κίνηση...(αν δεν τη βάλετε δεν θα κινείται)...δηλαδή, ......παράδειγμα:
<a class='linknudge' href='http://www.blogger.com/'>Dr-Blogger</a>

***η κόκκινη φράση είναι που θα κινεί το link
***τη μπλε φράση, αλλάξτε τη με το δικό σας link.....
ΚΑΛΗ ΕΠΙΤΥΧΙΑ !!!!

Δυο αναρτήσεις


Φίλοι bloggers, έχουμε πρόβλημα με τα script .js που βάζουμε στους κώδικες του blog μας....όλο και πιο συχνά βλέπω κάποια demo μου να μη λειτουργούν ...Να σας πω, ότι προσπαθώ να αντικαταστήσω όλα τα script μου που δεν λειτουργούν, αλλά εν τω μεταξύ, αν δείτε ότι κάποιο slider η widget η caroυsel, κλπ δεν λειτουργεί, μάλλον φταίει το js του κώδικα....Τι θα κάνετε ; Θα σας πω παρακάτω....

Μπείτε στον κώδικα του widget που δεν λειτουργεί....τσεκάρετε, οτι το script δεν λειτουργεί....πως; θα ανοίξετε τη διεύθυνση του .js για να δείτε αν σας δείχνει το κώδικα....αν τον δείχνει, είναι εντάξει....εάν όμως σας παρουσιάσει ενα παραθυράκι και ζητάει password, όπως στην εικόνα πιο πάνω, τότε δεν λειτουργεί.....Ανοίξτε το google, και ψάξτε να βρείτε ένα παρόμοιο script, ανεβασμένο από κάποιον άλλο προγραμματιστή η ιδιοκτήτη blog, που παρουσιάζει το κώδικα, γράφοντας το τελείωμα της διεύθυνσης του .js...
παράδειγμα:

αν η διεύθυνση είναι :  http://catur-at-abu-farhan.googlecode.com/svn/trunk/bookflip.min.js  ,

εσείς βάλετε μόνο το :   bookflip.min.js

...καποιος θα το εχει ανεβασει σε δική του σελίδα και δεν θα έχει password....
Τώρα, αν γνωρίζετε πως να το ανεβάσετε σε μια δική σας σελίδα φιλοξενίας, κάντε το, για να έχετε το κεφάλι σας ήσυχο...
Να σας πω ότι προσπαθώ να εντοπίσω και στις δικές μου αναρτήσεις ποια .js δεν λειτουργούν, και να τα διορθώσω...
Υπομονή !!!

Φίλοι bloggers, εάν οι γωνίες γύρω από την ανάρτησή σας και γύρω από τα gadgets σας  δεν είναι στρογγυλεμένες ιδού ένας εύκολος τρόπος με 2 κώδικες που θα εφαρμόσετε στο blog σας, και θα φαίνονται πιο όμορφα... (Καλό θα είναι να έχετε ενεργοποιήσει και το frame με κάποιο χρώμα)...Ο ένας κώδικας είναι για τα gadgets σας στις πλαϊνές στήλες, και ο δεύτερος είναι για τις αναρτήσεις σας !!!


1ος κώδικας για τα gadgets:



.....Μπείτε στο ΠΡΟΤΥΠΟ => ΠΡΟΣΑΡΜΟΓΗ =>ΠΡΟΗΓΜΕΝΗ =>Προσθήκη CSS  και επικολλήστε τον παρακάτω κώδικα (ΦΩΤΟ):

.widget, .blog-pager{
-moz-border-radius: 13px !important;
-webkit-border-radius: 13px !important;
-goog-ms-border-radius: 13px !important;
border-radius: 13px !important;
}

*Το 13px είναι ενδεικτικό...αν μεγαλώσετε το νούμερο θα γίνουν πιο στρογγυλές οι γωνίες...

2ος κώδικας για τις αναρτήσεις:
Βρείτε στο HTML πρότυπό σας τη παρακάτω φράση
* Posts ----------------------------------------------- */
...και αντιγράψτε-επικολλήστε  τον παρακάτω κώδικα ΑΠΟ ΚΑΤΩ ακριβώς:

.date-outer, .post-outer {
-moz-border-radius: 13px !important;
-webkit-border-radius: 13px !important;
-goog-ms-border-radius: 13px !important;
border-radius: 13px !important;
}


*Το 13px είναι ενδεικτικό...αν μεγαλώσετε το νούμερο θα γίνουν πιο στρογγυλές οι γωνίες...
*Μπορείτε να βάλετε το κώδικα και στο css του blog σας και με τον πιο πάνω τρόπο όπως στη εικόνα.
ΚΑΛΗ ΕΠΙΤΥΧΙΑ !!!

Διάφορα Cartoons που πετάνε (twitter gadget)

Νέοι bloggers γεια σας !!! Πριν από μήνες, σας είχα δώσει το κώδικα για το πουλί του twitter, που μάλιστα υπήρχε και σε πολλά χρώματα...Οσοι βαρεθήκατε το πουλί, και θέλετε κάτι πιο καινούργιο και περίεργο, σας έχω μια μεγάλη ποικιλία από ιπτάμενα cartoon, να βάλετε σε όλα τα blogs σας...

Το κώδικα που θα σας δώσω θα τον βάλετε σαν gadget (δείτε εικόνα)

Φτιάξτε το Banner σας (HTML code)

Νέοι bloggers, σίγουρα οι περισσότεροι έχετε ένα banner...υπάρχουν όμως και κάποιοι bloggers πιο φρέσκοι που δεν ξέρουν πως φτιάχνεται και τι είναι το banner...γι αυτούς λοιπόν είναι αυτή η ανάρτηση....
Το banner είναι μια διαφήμιση του blog μας.Το μοιράζουμε σε διάφορα φιλικά μας blogs, για να μας διαφημίσουν και να αποκτήσουμε μεγαλύτερη  επισκεψιμότητα ...

Meta tags (SEO): Σημαντική βοήθεια για να αποκτήσετε μεγάλη επισκεψιμότητα

Nέοι bloggers αυτή η ανάρτηση είναι για σας ! Ειδικά οι "πολύ νέοι" bloggers, πρέπει να διαβάσουν και να εφαρμόσουν το κώδικα που θα τους ανεβάσει την επισκεψιμότητα (SEO)...οι πιο παλιοί το γνωρίζουν ήδη...

Tag Cloud Generator

Νέοι bloggers, οι πιο πολλοί από εμάς ψάχνουμε ένα τρόπο να παρουσιάσουμε τις ετικέτες των αναρτήσεων μας...Εύκολο, αφού και ο blogger μας δίνει ένα αξιόλογο , αλλά κακομούτσουνο gadget...Βρήκα ένα Tag Cloud Generator, δηλαδή μια σελίδα (online) που δημιουργείτε ένα "σύννεφο ετικετών" εμφανίσιμο και εύκολο, όσο και πρακτικό.Μπορείτε να το χρησιμοποιήσετε, είτε με κώδικα HTML, είτε με flash swf !!!

(Να πω οτι έψαξα σε αντίστοιχα ξένα blogs να βρω κάποιο κώδικα που να προσθέσω στο πηγαίο κώδικα του blog μου, και να ξεμπερδέψω εύκολα, αλλά δυστυχώς, όποια ανάρτηση κι αν βρήκα, δεν μπόρεσα να το εισάγω στο HTML του blog μου)...έτσι, έφτασα στο http://www.tagcloud-generator.com/
Εύκολο...λειτουργεί με 2 τρόπους...αυτόματο, και χειροκίνητο...στο αυτόματο, απλά βάζετε τη διεύθυνση URL του blog σας, και αυτό δημιουργεί μόνο του τις ετικέτες...(αλλά μπορεί να σας βγάλει και περισσότερες από αυτές που έχετε...οπότε πρέπει να αφαιρέσετε μερικές)

...στο χειροκίνητο, βάζετε μόνοι σας τις ονομασίες και τις διευθύνσεις των ετικετών (tags) του blog σας, και προσθέτετε η αφαιρείτε, κουτάκια, αν δεν σας φτάνουν αυτά που σας δείχνει (εάν έχετε πολλές ετικέτες)....
Μετά μπορείτε να κάνετε το δικό σας σχεδιασμό, (πως θα φαίνεται, σε χρώματα, μέγεθος και μέγεθος γραμματοσειράς, καθώς επίσης και εμφάνιση απλή η 3D....
...και αφού τα ετοιμάσετε όλα αυτά, μπορείτε να πατήσετε το "generate preview" και να δείτε τι φτιάξατε, να πάρετε τον κώδικα HTML, (τον οποίο θα βάλετε σαν gadget => HTML/javascript), η να κατεβάσετε σε ένα φάκελο όλο το υλικό σε swf (που φυσικά πρέπει να ανεβάσετε σε μια δική σας host σελίδα, και να πάρετε τη διεύθυνση, για να τη βάλετε στο κώδικα html που θα βάλετε σαν gadget)...
...η απλή εμφάνιση του gadget είναι αυτή που βλέπετε στην αρχή της ανάρτησης...η 3D εμφάνιση είναι αυτή στη φωτογραφία από κάτω (3D και φυσικά κινούμενη, σαν σύννεφο)
(δεν ξέρετε πως είναι η εμφάνιση ενός 3D tag cloud?...δείτε εδώ ένα παρόμοιο: http://blog.philippklaus.de/3d-tag-cloud-flash/
ΚΑΛΗ ΕΠΙΤΥΧΙΑ !!!!
{Αν σας άρεσε αυτή η ανάρτηση, ξοδέψτε 5'' από το χρόνο σας να τη μοιράσετε με τα πλήκτρα από κάτω}

Gadget για Facebook Pop up Like Μιας Χρήσεως

...Και ο τίτλος σημαίνει οτι αυτό το gadget θα εμφανιστεί ΜΟΝΟ ΜΙΑ ΦΟΡΑ, σε κάθε επισκέπτη σας, (εκτός αν σβήσει από τον υπολογιστή του τα cookies που καταγράφουν τις διευθύνσεις που έχει επισκεφθεί στο διαδίκτυο)... Αρα και σεις θα το δείτε μόνο μια φορά στο blog σας...Είναι ένα gadget που εμφανίζεται σε pop up παράθυρο, και δείχνει στον επισκέπτη σας να κάνει "like" στη facebook σελίδα σας.
Τον παρακάτω κώδικα, βάλτε τον σαν gadget => HTML/javascript, (ΔΕΊΤΕ τη φωτογραφία)


Ο ΚΩΔΙΚΑΣ:
_________________________________________________
<style>
/*
ColorBox Core Style:
The following CSS is consistent between example themes and should not be altered.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
/*

User Style:
Change the following styles to modify the appearance of ColorBox. They are
ordered & tabbed in a way that represents the nesting of the generated HTML.
*/
#cboxOverlay{background:#000;opacity:0.5 !important;}
#colorbox{
box-shadow:0 0 15px rgba(0,0,0,0.4);
-moz-box-shadow:0 0 15px rgba(0,0,0,0.4);
-webkit-box-shadow:0 0 15px rgba(0,0,0,0.4);
}
#cboxTopLeft{width:14px; height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaTjs6aUqPVlZ1O0Cny1en_e1RWOrY1z_J-w7MdCNypnVf8Yv7A33vW77oAtt4YqFJ6ZwKV8P7bv0dTCx42lchUHvI5cRcQznjyJpgCQZy38mCqWJ6TLg2genf6suj_lAQZKmZtQvKNS8l/s1600/controls.png) no-repeat 0 0;}
#cboxTopCenter{height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimll6AWdJUht-FnEWZ9_fzZaNVKnv2a3PASTCMuY9AC34dvchZA87szABAGpZg7gBs2DegRATZa1cG3EVNGJlKh6lwyNxCN6Qz-cxh978y2tzaUwNcEf_LFkb6Z4x8oo-ankGzWQIKH4Kx/s1600/border.png) repeat-x top left;}
#cboxTopRight{width:14px; height:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaTjs6aUqPVlZ1O0Cny1en_e1RWOrY1z_J-w7MdCNypnVf8Yv7A33vW77oAtt4YqFJ6ZwKV8P7bv0dTCx42lchUHvI5cRcQznjyJpgCQZy38mCqWJ6TLg2genf6suj_lAQZKmZtQvKNS8l/s1600/controls.png) no-repeat -36px 0;}
#cboxBottomLeft{width:14px; height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaTjs6aUqPVlZ1O0Cny1en_e1RWOrY1z_J-w7MdCNypnVf8Yv7A33vW77oAtt4YqFJ6ZwKV8P7bv0dTCx42lchUHvI5cRcQznjyJpgCQZy38mCqWJ6TLg2genf6suj_lAQZKmZtQvKNS8l/s1600/controls.png) no-repeat 0 -32px;}
#cboxBottomCenter{height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimll6AWdJUht-FnEWZ9_fzZaNVKnv2a3PASTCMuY9AC34dvchZA87szABAGpZg7gBs2DegRATZa1cG3EVNGJlKh6lwyNxCN6Qz-cxh978y2tzaUwNcEf_LFkb6Z4x8oo-ankGzWQIKH4Kx/s1600/border.png) repeat-x bottom left;}
#cboxBottomRight{width:14px; height:43px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaTjs6aUqPVlZ1O0Cny1en_e1RWOrY1z_J-w7MdCNypnVf8Yv7A33vW77oAtt4YqFJ6ZwKV8P7bv0dTCx42lchUHvI5cRcQznjyJpgCQZy38mCqWJ6TLg2genf6suj_lAQZKmZtQvKNS8l/s1600/controls.png) no-repeat -36px -32px;}
#cboxMiddleLeft{width:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaTjs6aUqPVlZ1O0Cny1en_e1RWOrY1z_J-w7MdCNypnVf8Yv7A33vW77oAtt4YqFJ6ZwKV8P7bv0dTCx42lchUHvI5cRcQznjyJpgCQZy38mCqWJ6TLg2genf6suj_lAQZKmZtQvKNS8l/s1600/controls.png) repeat-y -175px 0;}
#cboxMiddleRight{width:14px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaTjs6aUqPVlZ1O0Cny1en_e1RWOrY1z_J-w7MdCNypnVf8Yv7A33vW77oAtt4YqFJ6ZwKV8P7bv0dTCx42lchUHvI5cRcQznjyJpgCQZy38mCqWJ6TLg2genf6suj_lAQZKmZtQvKNS8l/s1600/controls.png) repeat-y -211px 0;}
#cboxContent{background:#fff; overflow:visible;}
#cboxLoadedContent{margin-bottom:5px;}
#cboxLoadingOverlay{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmny1BsuIAxLu_yKUq_lS7zDlk6hKDR3kfx0mGLFAxpC4c0qJMcXTl6xgtwhpLVZ0fgzuMcJaHUuEoLlwsP0bUVeugKHFXW8UVQs1w76WEHO6Dc-5j6064brlHs42tHUOAt4VOELKFijA9/s1600/loading-background.png) no-repeat center center;}
#cboxLoadingGraphic{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1rq4oTQsLYxBo1rvGj39mY_Ile3r9fN8IOEfgu1Jid-lDzweRaOrDoox7KrRepI45C3YCACZrZnFbA_MZEHVrhiPSMtXoKToSfa2dQWfT6TRt7_DlAF2gZ0DE6FM5mLnyy-OU3dw0OvQV/s1600/loading.gif) no-repeat center center;}
#cboxTitle{position:absolute; bottom:-25px; left:0; text-align:center; width:100%; font-weight:bold; color:#7C7C7C;}
#cboxCurrent{position:absolute; bottom:-25px; left:58px; font-weight:bold; color:#7C7C7C;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{position:absolute; bottom:-29px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiaTjs6aUqPVlZ1O0Cny1en_e1RWOrY1z_J-w7MdCNypnVf8Yv7A33vW77oAtt4YqFJ6ZwKV8P7bv0dTCx42lchUHvI5cRcQznjyJpgCQZy38mCqWJ6TLg2genf6suj_lAQZKmZtQvKNS8l/s1600/controls.png) no-repeat 0px 0px; width:23px; height:23px; text-indent:-9999px;}
#cboxPrevious{left:0px; background-position: -51px -25px;}
#cboxPrevious.hover{background-position:-51px 0px;}
#cboxNext{left:27px; background-position:-75px -25px;}
#cboxNext.hover{background-position:-75px 0px;}
#cboxClose{right:0; background-position:-100px -25px;}
#cboxClose.hover{background-position:-100px 0px;}
.cboxSlideshow_on #cboxSlideshow{background-position:-125px 0px; right:27px;}
.cboxSlideshow_on #cboxSlideshow.hover{background-position:-150px 0px;}
.cboxSlideshow_off #cboxSlideshow{background-position:-150px -25px; right:27px;}
.cboxSlideshow_off #cboxSlideshow.hover{background-position:-125px 0px;}
/*-----------------------------------------------------------------------------------*/
/* Facebook Likebox popup For Blogger
/*-----------------------------------------------------------------------------------*/
#subscribe {
font: 12px/1.2 Arial,Helvetica,san-serif; color:#666;
}
#subscribe a,
#subscribe a:hover,
#subscribe a:visited {
text-decoration:none;
}
.box-title {
color: #3B5998;
font-size: 20px !important;
font-weight: bold;
margin: 10px 0;
border:1px solid #ddd;
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
box-shadow: 5px 5px 5px #CCCCCC;
padding:10px;
line-height:25px; font-family:arial !important;
}
.box-tagline {
color: #999;
margin: 0;
text-align: center;
}
#subs-container {
padding: 35px 0 30px 0;
position: relative;
}
a:link, a:visited {
border:none;
}
.demo {
display:none;
}
</style>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js'></script>
<script src="http://yourjavascript.com/11215013191/jquery.colorbox-min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
if (document.cookie.indexOf('visited=true') == -1) {
var fifteenDays = 1000*60*60*24*30;
var expires = new Date((new Date()).valueOf() + fifteenDays);
document.cookie = "visited=true;expires=" + expires.toUTCString();
$.colorbox({width:"400px", inline:true, href:"#subscribe"});
}
});
</script>
<!-- This contains the hidden content for inline calls -->

<div style='display:none'>
<div id='subscribe' style='padding:10px; background:#fff;'>
<h3 class="box-title">Receive all updates via Facebook. Just Click the Like Button Below<center><p style="line-height:3px;" >▼</p></center></h3> 
<center>

<iframe src="//www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/pages/dr-blogger/169243333144046&amp;width=300&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;height=258" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" allowtransparency="true"></iframe>
</center>
</div>
</div>
_____________________________________________
*Προσοχή...είπαμε οτι ο κάθε επισκέπτης θα το δει μόνο στη πρώτη επίσκεψη στο blog σας...
**ΠΡΟΣΟΧΗ ...αλλάξτε τη διεύθυνση με τα κόκκινα γράμματα, και βάλετε τη δική σας (της σελίδας του facebook που έχετε φτιάξει)
ΚΑΛΗ ΕΠΙΤΥΧΙΑ !!!!

Πηγή : thanks to : mybloggertricks.com/ &  spiceupyourblog.com
{Αν σας άρεσε αυτή η ανάρτηση, ξοδέψτε 5'' από το χρόνο σας να τη μοιράσετε με τα πλήκτρα από κάτω}

Μειώστε Το Κενό Πανω+Κάτω Απο το Header / Reduce the space above+after header

Φίλοι bloggers γεια σας!!! Σήμερα θα σας δείξω έναν κώδικα που αν προσθέσετε στο css (σχεδιαστικό τμήμα του blog σας), θα μπορέσετε να μειώσετε το κενό, ανάμεσα στη κορυφή του blog, και της κεφαλίδας του τίτλου...Είναι μια μικρή φράση, που μπορείτε να προσθέσετε......
είτε
α)στο : Σχεδίαση => Σχεδιαστής Προτύπων => Προηγμένη => Προσθήκη CSS ,  είτε
β) στο :  Σχεδίαση => Επεξεργασία HTML ....ακριβώς ΠΑΝΩ από τη φράση   ]]></b:skin>
Δείτε στις φωτογραφίες το Πριν και το Μετά ....

Προσθέστε στο κώδικα CSS το παρακάτω κώδικα :

/* reduce space before and after header image */


#Header1 {
margin-top:-20px;
margin-bottom:-20px;
}


/* end of reduce space before and after header image */


*Προσέξτε....το  margin-top:-20px;  ρυθμίζει το κενό ΠΑΝΩ από τη κεφαλίδα,
                      το  margin-bottom:-20px; ρυθμίζει το κενό ΚΑΤΩ από τη κεφαλίδα,
**Βάλτε τις δικές σας τιμές-νούμερα εκεί που λέει -20px, ώστε  να πετύχετε το επιθυμητό αποτέλεσμα (παίξτε με διάφορες τιμές, και δείτε πως σας "κάθεται" καλύτερα στο μάτι....
ΚΑΛΗ ΕΠΙΤΥΧΙΑ !!!
{Αν σας άρεσε αυτή η ανάρτηση, ξοδέψτε 5'' από το χρόνο σας να τη μοιράσετε με τα πλήκτρα από κάτω}

Προστατευτείτε από τον Ramnit, τον «ιό του Facebook»

Μετά την είδηση ότι σκουλήκι σέρνεται από προφίλ σε προφίλ του Facebook και σαρώνει προσωπικά στοιχεία φίλων και συγγενών, το Facebook έδωσε τις απαραίτητες διευκρινίσεις για την παραλλαγή του Ramnit που έγινε γνωστός ως «ιός του Facebook».

Η εταιρεία Securlet υποστηρίζει ότι αυτή η παραλλαγή του Ramnit, Ramnit.C δείχνει ότι η εξάπλωση ιών και σκουληκιών από mail σε mail έχει πλέον ξεπεραστεί. Από τη στιγμή που ο Ramnit μπήκε σε ένα προφίλ, εξαπλώνεται με εκθετική πρόοδο από φίλο σε φίλο. Εντούτοις, για να μολυνθεί κανείς θα πρέπει να κάνει κλικ στο μολυσμένο λινκ (και αυτό είναι πολύ εύκολο, αν το σκεφτεί κανείς). 
Μετά την είδηση ότι σκουλήκι σέρνεται από προφίλ σε προφίλ του Facebook και σαρώνει προσωπικά στοιχεία φίλων και συγγενών, το Facebook έδωσε τις απαραίτητες διευκρινίσεις για την παραλλαγή του Ramnit που έγινε γνωστός ως ιός του Facebook. 
Πάντως, η διοίκηση του Facebook απαντά ότι τα στοιχεία που της έστειλε η Securlet δεν είναι ακριβή. Login name και password δεν ταιριάζουν. Αυτό δείχνει είτε ότι τα στοιχεία ήταν τυχαία, είτε ότι τα μέλη του Facebook αλλάζουν συχνά password.
 Από την άλλη, το Facebook δεν παραδέχεται ότι τα σάιτ κοινωνικής δικτύωσης θα γίνουν άνδρο ληστών προσωπικών στοιχείων. Το worm έχει ήδη μολύνει τον υπολογιστή του χρήστη αν και πράγματι, εκμεταλλεύεται τη δικτύωση για να εξαπλωθεί. Ο Ramnit κλέβει τα στοιχεία εισόδου στο Facebook (στοιχεία που μπορεί να κρατά και ο browser υπό μορφή cookie, για να σας απαλλάξει από την εισαγωγή των στοιχείων κάθε φορά που επισκέπτεστε το facebook.com). 
Πάντως, η Microsoft είχε νωρίτερα περιγράψει με λεπτομέρεια τον Ramnit το 2010. Μολύνει εκτελέσιμα αρχεία (.exe, .dll, .src), αρχεία του MS Office (.doc, .docx και .xls), αρχεία HTML (.htm ή .html). Ο Ramnit πολλαπλασιάζεται μεταφερόμενος σε αποσπώμενα μέσα αποθήκευσης, κλέβει ευαίσθητα προσωπικά δεδομένα που βρίσκονται και αποθηκευμένα σε cookies στον browser και μπορεί να ανοίξει μια κερκόπορτα για να... μπαινοβγαίνει ο εντολέας του όποτε θέλει.

Ένα από τα συμπτώματα που εμφανίζει το PC όταν είναι μολυσμένο είναι ότι αφήνει πίσω του ένα εκτελέσιμο αρχείο με όνομα που περιέχει το Srv.exe 


Επομένως, αυτό που πρέπει να κάνετε είναι:

  1.  να κάνετε μια πλήρη σάρωση του συστήματός σας με έγκυρο, ενημερωμένο antivirus 
  2. να μην κάνετε κλικ σε link στο προφίλ σας που φαινομενικά κοινοποιήθηκαν από φίλο/-λη 
  3. να αλλάξετε κωδικό στο λογαριασμό σας στο Facebook 
  4. να απαλλαγείτε από apps που δεν σας χρησιμεύουν σε τίποτα
  5.  Όταν μπαίνετε στο Facebook από το σπίτι φίλων, να κάνετε πάντα log out.

ΠΗΓΗ:  http://tech.in.gr/consult/article/?aid=1231145226

Μειώστε το κενό ανάμεσα στις αναρτήσεις του blog

Νέοι bloggers γεια σας !!!Κατά καιρούς σας έχω δείξει με ανάρτηση πως να μικρύνετε τα κενά ανάμεσα σε διάφορα gadgets για να εξοικονομήσετε χώρο (ΕΔΩ και ΕΔΩ)...Σήμερα θα σας δείξω πως να μειώσετε τα κενά ανάμεσα στις αναρτήσεις σας (εφ' όσον ανεβάζετε μια ανάρτηση κάθε ημέρα η περισσότερο)...βλέπετε στις εικόνες τη διαφορά πριν και μετά !!



ΠΡΙΝ

ΜΕΤΑ

Κάνετε σύνδεση στο blogger και πάτε Σχεδίαση => Επεξεργασία HTML => και με ctrl F ψάχνετε τη φράση :   .date-outer {    (θα βρείτε 2 τέτοιες)
η φράση ολόκληρη που ψάχνουμε είναι :

.date-outer {
  position: relative;
  margin: $(date.space) 0 15px;
  padding: 0 15px;


και ελαττώστε την τιμή που βλέπετε με κόκκινα γράμματα   15px;.....(κάντε την ας πούμε 2px)...
κάντε ΠΡΟΕΠΙΣΚΟΠΗΣΗ και δείτε μήπως θέλει λιγότερο η περισσότερο !!!
Αφού δείτε οτι σας "κάθεται" σωστά στο μάτι η απόσταση που μικρύνατε, πατήστε ΑΠΟΘΗΚΕΥΣΗ !
ΚΑΛΗ ΕΠΙΤΥΧΙΑ !!!
{Αν σας άρεσε αυτή η ανάρτηση, ξοδέψτε 5'' από το χρόνο σας να τη μοιράσετε με τα πλήκτρα από κάτω}

Αφαιρέστε το: Εγγραφή σε Αναρτήσεις (Atom)

Νέοι bloggers γεια σας ! Πολλοί από εσάς θέλετε να σβήσετε από το blog σας τη φράση  "Εγγραφή σε Αναρτήσεις (Atom)"...Ψάχνετε στο internet και βρίσκετε πολλές αναρτήσεις άλλων φίλων που δίνουν συμβουλές για blogs, αλλά δεν μπορείτε να βρείτε τη φράση-κλειδί, και έτσι δεν μπορείτε να σβήσετε τη φράση (ανάλογα βέβαια και το πρότυπο που χρησιμοποιείτε )...Η φράση αυτή έχει προστεθεί έτσι ώστε οι επισκέπτες στο blog να μπορούν  να εγγραφούν σε τροφοδοσίες Atom σας. Ωστόσο, πολλοί άνθρωποι χρησιμοποιούν RSS για τους feeds blog . Επιπλέον, καταλαμβάνει χώρο στο κάτω μέρος του προτύπου και δεν φαίνεται ωραίο.
Πολλοί άνθρωποι πρέπει να έχουν προσπαθήσει να το αφαιρέσουν με την επίσκεψη στην επιλογή Edit HTML, αλλά δεν θα βρείτε το "Εγγραφή σε: Αναρτήσεις (Atom)" σε κανένα μέρος του προτύπου. Αυτό συμβαίνει επειδή δεν έχει συνταχθεί σαν ετικέτα href. Και ο blogger, συνέχεια αλλάζει τον σχεδιασμό του HTML, οπότε δεν ισχύουν οι παλιές αναρτήσεις που βρίσκετε....Ωστόσο, είναι πολύ εύκολο να το αφαιρέσετε....
Πριν ξεκινήσετε, κάντε ένα αντίγραφο ασφαλείας του προτύπου σας, ως μέτρο προφύλαξης. Κάντε κλικ στο Σχεδίαση και μετά στο Επεξεργασία HTML....Τώρα επιλέξτε Επέκταση προτύπων γραφικών στοιχείων. Μετά την επιλογή αυτή, ψάξτε για τη φράση (με ctrl F)


<b:include name='feedLinks'/>
...αφαιρέστε την, και πατήστε Προεπισκόπηση....αν ανοίξει το blog σας κανονικά και δεν υπάρχει αυτή η φράση, τότε πατήστε Αποθήκευση.....
ΚΑΛΗ ΕΠΙΤΥΧΙΑ !!!
{Αν σας άρεσε αυτή η ανάρτηση, ξοδέψτε 5'' από το χρόνο σας να τη μοιράσετε με τα πλήκτρα από κάτω}

2 Navigation codes

Nέοι bloggers γεια σας...σας παρουσιάζω 2 απλά navigation codes με HTML...θα τα βάλετε σαν gadget (αν δεν ξέρετε πως βάζουμε ένα gadget δείτε ΕΔΩ)...


Ο ΚΩΔΙΚΑΣ HTML για το Νο1:

<tbody><tr>
      <td valign="MIDDLE" align="CENTER"> <font face="ARIAL" color="#EE0000">
 <img alt="pick a category and click the CLICK button" border="0" height="24" src=" https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjVBOtYISR7UwcbHQQ6Ua6cdZ5MdFKYqBz07SUOnIwXAmYWUQU4GEA7JWnD86emHvs9Sqiz6QiGyISSQpS31ULDO6QshNdCF66i9piI0xNOzSoJPYK2tc30saAwPAieQUVoIs9nF_foGXY/s174/navigation-img.gif " width="154"></font>
       </td>
 <td valign="MIDDLE" align="CENTER">
 <font color="#CCCCCC">
<form name="navform" method="POST">
  <select name="inchoice" size="1">

<option value="/index.html" selected="">ΔΙΑΛΕΞΤΕ ΚΑΙ ΠΑΤΗΣΤΕ ΤΟ ΚΟΥΜΠΙ
</option><option value="ΔΙΕΥΘΥΝΣΗ ΑΡΧΙΚΗΣ ΣΕΛΙΔΑΣ">ΑΡΧΙΚΗ ΣΕΛΙΔΑ
</option><option value="ΔΙΕΥΘΥΝΣΗ ΛΙΝΚ 1">ΤΙΤΛΟΣ ΛΙΝΚ 1
</option><option value="ΔΙΕΥΘΥΝΣΗ ΛΙΝΚ 2">ΤΙΤΛΟΣ ΛΙΝΚ 2
</option><option value="ΔΙΕΥΘΥΝΣΗ ΛΙΝΚ 3">ΤΙΤΛΟΣ ΛΙΝΚ 3
</option><option value="ΔΙΕΥΘΥΝΣΗ ΛΙΝΚ 4">ΤΙΤΛΟΣ ΛΙΝΚ 4
</option><option value="ΔΙΕΥΘΥΝΣΗ ΛΙΝΚ 5">ΤΙΤΛΟΣ ΛΙΝΚ 5
</option><option value="ΔΙΕΥΘΥΝΣΗ ΛΙΝΚ 6">ΤΙΤΛΟΣ ΛΙΝΚ 6
</option><option value="ΔΙΕΥΘΥΝΣΗ ΛΙΝΚ 7">ΤΙΤΛΟΣ ΛΙΝΚ 7
</option><option value="ΔΙΕΥΘΥΝΣΗ ΛΙΝΚ 8">ΤΙΤΛΟΣ ΛΙΝΚ 8
</option></select>
<input type="button" onclick="location = '' + document.navform.inchoice.options[ document.navform.inchoice.selectedIndex ].value;" value="CLICK HERE">
</form>
</font>
</td>
</tr>
</tbody>

Ο ΚΩΔΙΚΑΣ HTML για το Νο2: (ανοίγει τα link σε νέο παράθυρο)

<center>
<form>
<select onchange="window.open(this.options[this.selectedIndex].value,'_blank')" style="width: 240px;" name="menu" size="1">

<option>ΤΙΤΛΟΣ ΤΟΥ NAVIGATION<!-- change the links with your own -->
</option><option value="ΔΙΕΥΘΥΝΣΗ ΛΙΝΚ 1">ΤΙΤΛΟΣ ΛΙΝΚ 1
</option><option value="ΔΙΕΥΘΥΝΣΗ ΛΙΝΚ 2">ΤΙΤΛΟΣ ΛΙΝΚ 2
</option><option value="ΔΙΕΥΘΥΝΣΗ ΛΙΝΚ 3">ΤΙΤΛΟΣ ΛΙΝΚ 3
</option><option value="ΔΙΕΥΘΥΝΣΗ ΛΙΝΚ 4">ΤΙΤΛΟΣ ΛΙΝΚ 4
</option><option value="ΔΙΕΥΘΥΝΣΗ ΛΙΝΚ 5">ΤΙΤΛΟΣ ΛΙΝΚ 5
</option><option value="ΔΙΕΥΘΥΝΣΗ ΛΙΝΚ 6">ΤΙΤΛΟΣ ΛΙΝΚ 6
</option><option value="ΔΙΕΥΘΥΝΣΗ ΛΙΝΚ 7">ΤΙΤΛΟΣ ΛΙΝΚ 7
</option><option value="ΔΙΕΥΘΥΝΣΗ ΛΙΝΚ 8">ΤΙΤΛΟΣ ΛΙΝΚ 8
</option></select></form>
</center>

***για να επαναλάβετε και να αυξήσετε τα link, επαναλάβετε (και στους 2 κώδικες) τη φράση
<option value="ΔΙΕΥΘΥΝΣΗ ΛΙΝΚ ">ΛΙΝΚ </option>
***όπου  ΔΙΕΥΘΥΝΣΗ ΛΙΝΚ βάλτε το LINK της σελίδας  και όπου  ΤΙΤΛΟΣ ΛΙΝΚ   τον τίτλο της σελίδας
DEMO (2)   δείτε τη σελίδα του Βαγγέλη πόσο ωραία το χρησιμοποιεί (εκεί που λέει "πιάτσες")...
ΚΑΛΗ ΕΠΙΤΥΧΙΑ !!!
{Αν σας άρεσε αυτή η ανάρτηση, ξοδέψτε 5'' από το χρόνο σας να τη μοιράσετε με τα πλήκτρα από κάτω}

Ευχές για τις γιορτές (gadget)

Νέοι bloggers γεια σας....Η κόρη μου, έφτιαξε χθες ένα πολύ όμορφο πρωτοχρονιάτικο μήνυμα, για το blog της, και σκέφτηκα οτι θα σας άρεσε να το έχετε κι εσείς στο blog σας....Το έφτιαξε στο  http://www.voki.com/  , όπου μπορείτε κι εσείς να φτιάξετε ένα αντίστοιχο δικό σας.....Σήμερα θα σας δώσω έτοιμο το κώδικα για τον Αη-Βασίλη που εύχεται καλά Χριστούγεννα και καλή πρωτοχρονιά !!! Μιλάει και κινείται...
Ο ΚΩΔΙΚΑΣ: (μπαίνει σαν gadget)


<center>Πατήστε play να σας ευχηθώ  <center></center>
<img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://c.gigcount.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEzMjQ*MTY5NTc5MzcmcHQ9MTMyNDQxNjk3Mzc3MiZwPTk3NTA3MiZkPTAwMCUyMC*lMjBWb2tpJTIwV2lkZ2V*Jmc9/MSZvPWQ3ZDdlYjg1Y2EwMDQ*ZDRiZWUwMDgxMmUzNGFhMzBlJm9mPTA=.gif" /><object height="267" width="200" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" id="widget_name"><param name="movie" value="http://vhss-d.oddcast.com/vhss_editors/voki_player.swf?doc=http%3A%2F%2Fvhss-d.oddcast.com%2Fphp%2Fvhss_editors%2Fgetvoki%2Fchsm%3Daecd6658bc194db0eb4b65f4f637df23%26sc%3D5072070" /><param name="quality" value="high" /><param name="allowScriptAccess" value="always" /><param name="width" value="200" /><param name="height" value="267" /><param name="allowNetworking" value="all"/><param name="wmode" value="transparent" /><param name="allowFullScreen" value="true" /><embed height="267" width="200" src="http://vhss-d.oddcast.com/vhss_editors/voki_player.swf?doc=http%3A%2F%2Fvhss-d.oddcast.com%2Fphp%2Fvhss_editors%2Fgetvoki%2Fchsm%3Daecd6658bc194db0eb4b65f4f637df23%26sc%3D5072070" quality="high" allowscriptaccess="always" allownetworking="all" wmode="transparent" allowfullscreen="true" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" name="widget_name"></embed></object></center>

ΚΑΛΑ ΧΡΙΣΤΟΥΓΕΝΝΑ ΚΑΙ ΚΑΛΗ ΠΡΩΤΟΧΡΟΝΙΑ !!!
{Αν σας άρεσε αυτή η ανάρτηση, ξοδέψτε 5'' από το χρόνο σας να τη μοιράσετε με τα πλήκτρα από κάτω}

Κάθετο Μενου με Εικονίδιο / Vertical Menu with Icons

Νέοι bloggers γεια σας...βρήκα ένα κάθετο μενού με CSS, και κάνοντας μερικές μετατροπές, το έβλεπα να γίνεται χρήσιμο και αρκετά διαφορετικό από τα άλλα...έτσι σκέφτηκα οτι θα μπορούσε να έχει μια χρήσιμη εφαρμογή...στα φιλικά μας banner  !!!Κάτω από το μενού λοιπόν εμφανίζεται ένα εικονίδιο...και το ρύθμισα να βάζω τα φιλικά μου blogs ...Δείτε το
ΕΔΩ...

Ο ΚΩΔΙΚΑΣ  CSS:

<style type="text/css">
<!--
body {position: relative; background: none; margin: 0; padding: 0;}

div#FRIENDS {position: absolute; top: 10px; left: 0; width: 166px; height: 700px; font: 16px Verdana, sans-serif; z-index: 100;}
div#FRIENDS a {display: block; text-align: center; font: bold 1em sans-serif;
   padding: 5px 10px; margin: 0 0 1px; border-width: 0;
   text-decoration: none; color: #FFC; background: #000000;
   border-right: 5px solid #505050;}
div#FRIENDS a:hover {color: #8A1C1C; background: #AAA;
   border-right: 5px double white;}

div#FRIENDS a img {height: 0; width: 0; border-width: 0;}
div#FRIENDS a:hover img {position: absolute; top: 190px; left: 55px; height: 70px; width: 80px;}

div#content {position: absolute; top: 26px; left: 161px; right: 25px;
   color: #BAA; background: #22232F;
   font: 13px Verdana, sans-serif; padding: 10px;
   border: solid 5px #444;}
div#content p {margin: 0 1em 1em;}
div#content h3 {margin-bottom: 0.25em;}

h1 {margin: -9px -9px 0.5em; padding: 15px 0 5px; text-align: right; background: #333; color: #667; letter-spacing: 0.5em; text-transform: lowercase; font: bold 25px sans-serif; height: 28px; vertical-align: middle; white-space: nowrap;}
dt {font-weight: bold;}
dd {margin-bottom: 0.66em;}
div#content a:link {color: white;}
div#content a:visited {color: #BBC;}
div#content a:link:hover {color: #FF0;}
div#content a:visited:hover {color: #CC0;}
code, pre {color: #EDC; font: 110% monospace;}
-->
</style>

Ο ΚΩΔΙΚΑΣ  HTML:

<div id="FRIENDS">
<a target="_blank"  href="ΔΙΕΥΘΥΝΣΗ BLOG">ΤΙΤΛΟΣ<img src="ΔΙΕΥΘΥΝΣΗ ΕΙΚΟΝΑΣ"></a>
<a target="_blank"  href=" ΔΙΕΥΘΥΝΣΗ BLOG "> ΤΙΤΛΟΣ <img src=" ΔΙΕΥΘΥΝΣΗ ΕΙΚΟΝΑΣ "></a>
<a target="_blank"  href=" ΔΙΕΥΘΥΝΣΗ BLOG "> ΤΙΤΛΟΣ <img src=" ΔΙΕΥΘΥΝΣΗ ΕΙΚΟΝΑΣ "></a>
<a target="_blank"  href=" ΔΙΕΥΘΥΝΣΗ BLOG "> ΤΙΤΛΟΣ <img src=" ΔΙΕΥΘΥΝΣΗ ΕΙΚΟΝΑΣ "></a>
<a target="_blank"  href=" ΔΙΕΥΘΥΝΣΗ BLOG "> ΤΙΤΛΟΣ <img src=" ΔΙΕΥΘΥΝΣΗ ΕΙΚΟΝΑΣ "></a>
<a target="_blank"  href=" ΔΙΕΥΘΥΝΣΗ BLOG "> ΤΙΤΛΟΣ <img src=" ΔΙΕΥΘΥΝΣΗ ΕΙΚΟΝΑΣ "></a>
</div>

***στο DEMO που σας δείχνω, έχω βάλει και τους 2 κώδικες μαζί, σαν gadget
***να σας εξηγήσω μερικά χρήσιμα πράγματα για να το ρυθμίσετε σύμφωνα με τις απαιτήσεις σας...
*τα μεγέθη   height: 70px; width: 80px;  είναι για το μέγεθος της εικόνας...
*το  target="_blank"  το έβαλα για να ανοίγει το λινκ σε νέο παράθυρο...
*στο  background: none  μπορείτε να βάλετε ένα χρώμα background...έβαλα τίποτα, για να μη μπερδευτείτε...
*το background: #000000;  είναι το χρώμα του button ...αλλάξτε και τα άλλα χρώματα
*εάν θέλετε να προσθέσετε κι άλλα banners θα επαναλάβετε τη φράση:
<a target="_blank"  href=" ΔΙΕΥΘΥΝΣΗ BLOG "> ΤΙΤΛΟΣ <img src=" ΔΙΕΥΘΥΝΣΗ ΕΙΚΟΝΑΣ "></a>  και θα μεγαλώσετε το μέγεθος   top: 190px;   (να πάει πιο κάτω)........
ΚΑΛΗ ΕΠΙΤΥΧΙΑ !!!
Πηγή, Thanks to : meyerweb.com/
{Αν σας άρεσε αυτή η ανάρτηση, ξοδέψτε 5'' από το χρόνο σας να τη μοιράσετε με τα πλήκτρα από κάτω}

Christmas Gadgets for Blogs

Νέοι bloggers γεια σας!!!Λόγω των γιορτών έκατσα και σας έφτιαξα μερικά gadgets για το blog σας...είναι όλα στατικά, και "ντύνουν" όλες τις πλευρές του...σας δίνω έτοιμο κώδικα για τις επάνω-κάτω-δεξιά-αριστερή πλευρά του blog, και σας εξηγώ και πως να το ρυθμίσετε, για να μη σας κρύβει κουμπιά και link...
DEMO   &  DEMO και επίσης σας έχω μερικά περσινά ΕΔΩ
Μπαίνουν όλα σαν gadget στο  BLOGGER επεξεργασία διάταξης=>Σχεδίαση=>Στοιχεία Σελίδας=>GADGET=>HTML/JavaScript :

Οριζόντιο: επάνω
 <img style="display:scroll;position:fixed;top:-40px;left:-20px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdLIo474GekLDehn9EaTyZCBY4ZBtM8rBL-1_8NtzXaMz_X72Yc6rHJtFGrZFbAiDdXacsibV9CM6RPYkUl0mj1sBwLZiP46AkURhEbD0GELMx_kz-O8UNlZqUsnZmMCiFHp9wuXdYT1A/s1240/christmas%252520garl%2525203%252520horizontal.gif" />

Οριζόντιο: κάτω
<img style="display:scroll;position:fixed;bottom:-40px;left:-20px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgdLIo474GekLDehn9EaTyZCBY4ZBtM8rBL-1_8NtzXaMz_X72Yc6rHJtFGrZFbAiDdXacsibV9CM6RPYkUl0mj1sBwLZiP46AkURhEbD0GELMx_kz-O8UNlZqUsnZmMCiFHp9wuXdYT1A/s1240/christmas%252520garl%2525203%252520horizontal.gif" />

Κάθετο δεξιά :

<img style="display:scroll;position:fixed;top:-40px;right:-50px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmeU6kjZRtodVDZwu1N79dp2BIIf0TVpj0JYxbm8no5K8B_8cbaTUiM5boGG2QTB8SdzZpnv8JcHGySc46c0dpv97n15Eq4iBV_kAH1PrEcOrSfxicUMwTC5A0fuKMpw94xvsTPMtpnVk/s1500/christmas%252520garl%2525203%252520vertical.gif" />

Κάθετο αριστερά:
<img style="display:scroll;position:fixed;top:-40px;left:-50px;" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmeU6kjZRtodVDZwu1N79dp2BIIf0TVpj0JYxbm8no5K8B_8cbaTUiM5boGG2QTB8SdzZpnv8JcHGySc46c0dpv97n15Eq4iBV_kAH1PrEcOrSfxicUMwTC5A0fuKMpw94xvsTPMtpnVk/s1500/christmas%252520garl%2525203%252520vertical.gif" />

***Σας εξηγώ και κάποια σημαντικά στοιχεία του κώδικα....top:-40px; σημαίνει ότι δεν θα φαίνεται κατά 40px...δηλαδή αν θέλετε να το εμφανίσετε περισσότερο μέσα στο blog θα το μειώσετε -30, -20, -10 (δηλ, το "έκρυψα" κατά 40px για να μη σας κρύβει σημαντικά θέματα στο blog...)
***το   left:-50px;   και  right:-50px;  δηλώνουν ότι το "έκρυψα" δεξιά (right) η αριστερά (left) κατά 50px  για να μη σας κρύβει σημαντικά θέματα στο blog...
...έτσι μπορείτε να τα ρυθμίσετε ώστε να κρύβονται λιγότερο η περισσότερο !!!
Κάντε μια δοκιμή και δοκιμάστε το κώδικα στο demo blog μου http://demobloghtml.blogspot.com/
Σας δίνω και μερικές γιρλάντες ακόμα....ΕΔΩ...ΕΔΩ....ΕΔΩ...
Φυσικά, μην τα βάλετε όλα μαζί και γίνει πανηγύρι το blog σας...
***ΕΠΙΣΗΣ=> Μπορείτε να βρείτε πολλά χριστουγεννιάτικα widgets ΕΔΩ
***ΕΠΙΣΗΣ=> Πάρτε και ένα κώδικα για 2 gadgets (χιόνι και χριστ. καμπάνες)(βάλτε το σαν gadget)
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>  <script type="text/javascript"> $("body").append($("<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiS3_bvFOLdQMf60_VTU3o7WZAGGNxl3OdT70h4vslzwsSGcqjkZKyHXEehAPzItk54yQzB72059hLNQ4fmupSdfCUoQAnuhf1kzC-cHKzhHS4dA6tS6kaHLPeT5g7GhkT7ysKBmRj-Vdg/s1600/christmas-bells-icon.png' style='position:absolute; top: 0px;left:0px;border:none;'/><img id='xmasleftbell' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVzz8CG0tzgUUPeJ2gOEIprELxZLMWGsPfplwZ1JtXsMf1kXhz8ZmMJdFmCIxRbocFmK9gjMkl_K6szP9nhcRki-2iNBNP3_L8ozN_WmNrLlMcOhx43GqmOwcrYFFdQgNaNAxx7YU2gGE/s1600/christmas-bells-icon-right.png' style='position:absolute; top: 0px;right:0px;border:none;'/>")); </script> <script src='http://blogergadgets.googlecode.com/files/snowfall.min.jquery.js' type='text/javascript'></script> <script type="text/javascript"> $(document).snowfall({flakeCount:199}); </script> 

ΠΡΟΣΟΧΗ !!! να τα σημαδέψετε που τα βάζετε (βάλτε τα gadgets πολύ χαμηλά, στο τέλος της σελίδας σας), για να τα βρείτε πάλι εύκολα και μετά τις γιορτές, όταν τα βγάλετε....
{Αν σας άρεσε αυτή η ανάρτηση, ξοδέψτε 5'' από το χρόνο σας να τη μοιράσετε με τα πλήκτρα από κάτω}

Lightbox για Είσοδο στο Blog σας

Νέοι bloggers γεια σας !!!Χωρίς πολλά λόγια σας δίνω ένα κώδικα για εικόνα, η βίντεο η κείμενο (στατικό) που καλωσορίζει τον επισκέπτη στο blog σας...DEMO...την εικόνα που βλέπετε, μπορεί να είναι και βίντεο, η κείμενο, και να δείχνει η γράφει οτιδήποτε !!!Και βέβαια, αντί για καλωσόρισμα μπορείτε να βάλετε ότι μήνυμα εσείς θέλετε...Δεν μπαίνει ο επισκέπτης στο blog σας αν δεν το κλείσει....
Ο ΚΩΔΙΚΑΣ: (βάλτε τον σαν gadget-javascript)

<div class="widget-content">
<style type="text/css">
<!--#Layer1 {
    position:fixed;
    width:700px;
    height:414px;
    left:160px;
top:50px;
    z-index:1;
}
-->
</style>

<script type="text/JavaScript">
<!--
function MM_openBrWindow(theURL,winName,features) { //v2.0
  window.open(theURL,winName,features);
}
//-->
</script>

<script language="JavaScript1.2">

isMouseover = false;
isDragging = false;

function MouseDownLayer(e)
{
   isIE = document.all;

   documentTag = isIE ? "BODY" : "HTML";
   srcElement = isIE ? event.srcElement : e.target;
   layerElement = isIE ? document.all.Layer1 : document.getElementById("Layer1");

   while (srcElement.id != "Layer1TitleBar" && srcElement.tagName != documentTag)
   {
      srcElement = isIE ? srcElement.parentElement : srcElement.parentNode;
   }
   if (srcElement.id == "Layer1TitleBar")
   {
      offsetX = isIE ? event.clientX : e.clientX;
      offsetY = isIE ? event.clientY : e.clientY;
      currentX = parseInt(layerElement.style.left);
      currentY = parseInt(layerElement.style.top);
      isDragging = true;
      document.onmousemove = MouseMoveLayer;
  }
}

function MouseMoveLayer(e)
{
   if (!isDragging) return;

   // Internet Explorer ?
   if (document.all)
   {
      layerElement.style.left = currentX+event.clientX-offsetX;
      layerElement.style.top = currentY+event.clientY-offsetY;
   }
   else
   {
      layerElement.style.left = currentX+e.clientX-offsetX + "px";
      layerElement.style.top = currentY+e.clientY-offsetY + "px";
   }
   return false;
}

document.onmousedown = MouseDownLayer;
document.onmouseup = Function("isDragging=false");

</script>

<div id="Layer1"> <table border="0" bgcolor="#103C7B" width="100%" cellspacing="0" cellpadding="2">
<tbody><tr>
   <td id="Layer1TitleBar" style="cursor:move" width="100%">
      <ilayer width="100%" onselectstart="return false">
      <layer width="100%" onmouseover="isMouseover=true" onmouseout="isMouseover=false">
      <font face="Arial" color="#FFFFFF" style="font-size:13px;text-decoration:none"><b></b></font>      </layer>
      </ilayer>
   </td>
   <td style="cursor:hand" valign="top">
      <a href="#" onclick="layerElement.style.visibility='hidden';return false">
      <font color="#FFFFFF" face="Arial" style="font-size:13px;text-decoration:none"><b>Κλείσιμο</b></font>
      </a>
   </td>
</tr>
</tbody></table><a href="#" style=""><center><img  height="550" width="700"  src="http://i972.photobucket.com/albums/ae206/RuSsiA_Bboy/Welcome-to-my-page.gif" /></div></center></a></div>

***τα χρωματιστά σημεία, σας δείχνουν τα μεγέθη, τις διαστάσεις και με το μπλε φόντο, σας δείχνω που θα βάλετε τη φωτογραφία, το βιντεο η το κείμενο
***ΠΟΛΥ ΣΗΜΑΝΤΙΚΟ .....επειδή δεν πρέπει να λειτουργεί συνέχεια και σε όλες τις σελίδες του blog σας, (γιατί θα σπάσετε τα νεύρα στους επισκέπτες σας που θα πρέπει να το κλείνουν σε κάθε ανάρτηση σας που θα διαβάζουν), διαβάστε αυτην την ανάρτηση, ΚΑΝΤΕ ΤΑ WIDGETS ΟΡΑΤΑ/ΚΡΥΦΑ ΣΕ ΣΥΓΚΕΚΡΙΜΕΝΕΣ ΣΕΛΙΔΕΣ  για να βάλετε αυτό το gadget ΜΟΝΟΝ στην αρχική σελίδα....
ΚΑΛΗ ΕΠΙΤΥΧΙΑ !!!(για απορίες σας, στείλτε email η γράψτε σχόλιο)
{Αν σας άρεσε αυτή η ανάρτηση, ξοδέψτε 5'' από το χρόνο σας να τη μοιράσετε με τα πλήκτρα από κάτω}

Χριστουγεννιάτικη Ρουλέτα / Christmas Roulette

Νέοι bloggers γεια σας !!! Χριστούγεννα-Πρωτοχρονιά έρχονται, και όλοι θα παίξουμε λίγο τζόγο...γιατί να μη παίξουμε στο δικό μας blog ;Γι αυτό σας δίνω σήμερα έναν κώδικα, για να βάλετε μια ρουλέτα-(πιο πολύ τροχό της τύχης θα έλεγα) σαν gadget-javascript σε κάποια σελίδα σας....
DEMO ΕΔΩ
Ο ΚΩΔΙΚΑΣ: (Bάλτε τον σαν gadget-javascript)

<div class="demo-app"><div class="da da-center" style="width:600px;">
<!--[if IE]><script type="text/javascript" src="/sites/default/files/1010/source/excanvas.js"></script><![endif]-->
<input type="button" value="spin" onclick="spin();" style="float: left;">
<canvas id="wheelcanvas" width="500" height="500"></canvas>
<script type="application/javascript">
  var colors = ["#B8D430", "#3AB745", "#029990", "#3501CB",
               "#2E2C75", "#673A7E", "#CC0071", "#F80120",
               "#F35B20", "#FB9A00", "#FFCC00", "#FEF200"];
  var restaraunts = ["10 EURO", "20 EURO", "50 EURO", "100 EURO",
                     "200 EURO", "300 EURO", "500 EURO", "1.000 EURO",
                     "2.000 EURO", "5.000 EURO", "10.000 EURO", "20.000 EURO"];

  var startAngle = 0;
  var arc = Math.PI / 6;
  var spinTimeout = null;

  var spinArcStart = 10;
  var spinTime = 0;
  var spinTimeTotal = 0;

  var ctx;

  function draw() {
    drawRouletteWheel();
  }

  function drawRouletteWheel() {
    var canvas = document.getElementById("wheelcanvas");
    if (canvas.getContext) {
      var outsideRadius = 200;
      var textRadius = 160;
      var insideRadius = 125;
   
      ctx = canvas.getContext("2d");
      ctx.clearRect(0,0,500,500);
   
   
      ctx.strokeStyle = "black";
      ctx.lineWidth = 2;
   
      ctx.font = 'bold 12px sans-serif';
   
      for(var i = 0; i < 12; i++) {
        var angle = startAngle + i * arc;
        ctx.fillStyle = colors[i];
     
        ctx.beginPath();
        ctx.arc(250, 250, outsideRadius, angle, angle + arc, false);
        ctx.arc(250, 250, insideRadius, angle + arc, angle, true);
        ctx.stroke();
        ctx.fill();
     
        ctx.save();
        ctx.shadowOffsetX = -1;
        ctx.shadowOffsetY = -1;
        ctx.shadowBlur    = 0;
        ctx.shadowColor   = "rgb(220,220,220)";
        ctx.fillStyle = "black";
        ctx.translate(250 + Math.cos(angle + arc / 2) * textRadius, 250 + Math.sin(angle + arc / 2) * textRadius);
        ctx.rotate(angle + arc / 2 + Math.PI / 2);
        var text = restaraunts[i];
        ctx.fillText(text, -ctx.measureText(text).width / 2, 0);
        ctx.restore();
      }
   
      //Arrow
      ctx.fillStyle = "black";
      ctx.beginPath();
      ctx.moveTo(250 - 4, 250 - (outsideRadius + 5));
      ctx.lineTo(250 + 4, 250 - (outsideRadius + 5));
      ctx.lineTo(250 + 4, 250 - (outsideRadius - 5));
      ctx.lineTo(250 + 9, 250 - (outsideRadius - 5));
      ctx.lineTo(250 + 0, 250 - (outsideRadius - 13));
      ctx.lineTo(250 - 9, 250 - (outsideRadius - 5));
      ctx.lineTo(250 - 4, 250 - (outsideRadius - 5));
      ctx.lineTo(250 - 4, 250 - (outsideRadius + 5));
      ctx.fill();
    }
  }

  function spin() {
    spinAngleStart = Math.random() * 10 + 10;
    spinTime = 0;
    spinTimeTotal = Math.random() * 3 + 4 * 1000;
    rotateWheel();
  }

  function rotateWheel() {
    spinTime += 30;
    if(spinTime >= spinTimeTotal) {
      stopRotateWheel();
      return;
    }
    var spinAngle = spinAngleStart - easeOut(spinTime, 0, spinAngleStart, spinTimeTotal);
    startAngle += (spinAngle * Math.PI / 180);
    drawRouletteWheel();
    spinTimeout = setTimeout('rotateWheel()', 30);
  }

  function stopRotateWheel() {
    clearTimeout(spinTimeout);
    var degrees = startAngle * 180 / Math.PI + 90;
    var arcd = arc * 180 / Math.PI;
    var index = Math.floor((360 - degrees % 360) / arcd);
    ctx.save();
    ctx.font = 'bold 30px sans-serif';
    var text = restaraunts[index]
    ctx.fillText(text, 250 - ctx.measureText(text).width / 2, 250 + 10);
    ctx.restore();
  }

  function easeOut(t, b, c, d) {
    var ts = (t/=d)*t;
    var tc = ts*t;
    return b+c*(tc + -3*ts + 3*t);
  }

  draw();
</script></div></div>

DEMO ΕΔΩ
***Αλλάζουν τα χρώματα και τα νούμερα...
***Δεν νομίζω ότι θα λειτουργήσει με internet explorer...
ΚΑΛΗ ΕΠΙΤΥΧΙΑ και ΚΑΛΑ ΚΕΡΔΗ !!!
Πηγή : thanks to switchonthecode.com/
{Αν σας άρεσε αυτή η ανάρτηση, ξοδέψτε 5'' από το χρόνο σας να τη μοιράσετε με τα πλήκτρα από κάτω}

Χριστουγεννιάτικη Ρουλέτα / Christmas Roulette

Νέοι bloggers γεια σας !!! Χριστούγεννα-Πρωτοχρονιά έρχονται, και όλοι θα παίξουμε λίγο τζόγο...γιατί να μη παίξουμε στο δικό μας blog ;Γι αυτό σας δίνω σήμερα έναν κώδικα, για να βάλετε μια ρουλέτα-(πιο πολύ τροχό της τύχης θα έλεγα) σαν gadget-javascript σε κάποια σελίδα σας....
DEMO ΕΔΩ
Ο ΚΩΔΙΚΑΣ: (Bάλτε τον σαν gadget-javascript)

<div class="demo-app"><div class="da da-center" style="width:600px;">
<!--[if IE]><script type="text/javascript" src="/sites/default/files/1010/source/excanvas.js"></script><![endif]-->
<input type="button" value="spin" onclick="spin();" style="float: left;">
<canvas id="wheelcanvas" width="500" height="500"></canvas>
<script type="application/javascript">
  var colors = ["#B8D430", "#3AB745", "#029990", "#3501CB",
               "#2E2C75", "#673A7E", "#CC0071", "#F80120",
               "#F35B20", "#FB9A00", "#FFCC00", "#FEF200"];
  var restaraunts = ["10 EURO", "20 EURO", "50 EURO", "100 EURO",
                     "200 EURO", "300 EURO", "500 EURO", "1.000 EURO",
                     "2.000 EURO", "5.000 EURO", "10.000 EURO", "20.000 EURO"];

  var startAngle = 0;
  var arc = Math.PI / 6;
  var spinTimeout = null;

  var spinArcStart = 10;
  var spinTime = 0;
  var spinTimeTotal = 0;

  var ctx;

  function draw() {
    drawRouletteWheel();
  }

  function drawRouletteWheel() {
    var canvas = document.getElementById("wheelcanvas");
    if (canvas.getContext) {
      var outsideRadius = 200;
      var textRadius = 160;
      var insideRadius = 125;
   
      ctx = canvas.getContext("2d");
      ctx.clearRect(0,0,500,500);
   
   
      ctx.strokeStyle = "black";
      ctx.lineWidth = 2;
   
      ctx.font = 'bold 12px sans-serif';
   
      for(var i = 0; i < 12; i++) {
        var angle = startAngle + i * arc;
        ctx.fillStyle = colors[i];
     
        ctx.beginPath();
        ctx.arc(250, 250, outsideRadius, angle, angle + arc, false);
        ctx.arc(250, 250, insideRadius, angle + arc, angle, true);
        ctx.stroke();
        ctx.fill();
     
        ctx.save();
        ctx.shadowOffsetX = -1;
        ctx.shadowOffsetY = -1;
        ctx.shadowBlur    = 0;
        ctx.shadowColor   = "rgb(220,220,220)";
        ctx.fillStyle = "black";
        ctx.translate(250 + Math.cos(angle + arc / 2) * textRadius, 250 + Math.sin(angle + arc / 2) * textRadius);
        ctx.rotate(angle + arc / 2 + Math.PI / 2);
        var text = restaraunts[i];
        ctx.fillText(text, -ctx.measureText(text).width / 2, 0);
        ctx.restore();
      }
   
      //Arrow
      ctx.fillStyle = "black";
      ctx.beginPath();
      ctx.moveTo(250 - 4, 250 - (outsideRadius + 5));
      ctx.lineTo(250 + 4, 250 - (outsideRadius + 5));
      ctx.lineTo(250 + 4, 250 - (outsideRadius - 5));
      ctx.lineTo(250 + 9, 250 - (outsideRadius - 5));
      ctx.lineTo(250 + 0, 250 - (outsideRadius - 13));
      ctx.lineTo(250 - 9, 250 - (outsideRadius - 5));
      ctx.lineTo(250 - 4, 250 - (outsideRadius - 5));
      ctx.lineTo(250 - 4, 250 - (outsideRadius + 5));
      ctx.fill();
    }
  }

  function spin() {
    spinAngleStart = Math.random() * 10 + 10;
    spinTime = 0;
    spinTimeTotal = Math.random() * 3 + 4 * 1000;
    rotateWheel();
  }

  function rotateWheel() {
    spinTime += 30;
    if(spinTime >= spinTimeTotal) {
      stopRotateWheel();
      return;
    }
    var spinAngle = spinAngleStart - easeOut(spinTime, 0, spinAngleStart, spinTimeTotal);
    startAngle += (spinAngle * Math.PI / 180);
    drawRouletteWheel();
    spinTimeout = setTimeout('rotateWheel()', 30);
  }

  function stopRotateWheel() {
    clearTimeout(spinTimeout);
    var degrees = startAngle * 180 / Math.PI + 90;
    var arcd = arc * 180 / Math.PI;
    var index = Math.floor((360 - degrees % 360) / arcd);
    ctx.save();
    ctx.font = 'bold 30px sans-serif';
    var text = restaraunts[index]
    ctx.fillText(text, 250 - ctx.measureText(text).width / 2, 250 + 10);
    ctx.restore();
  }

  function easeOut(t, b, c, d) {
    var ts = (t/=d)*t;
    var tc = ts*t;
    return b+c*(tc + -3*ts + 3*t);
  }

  draw();
</script></div></div>

DEMO ΕΔΩ
***Αλλάζουν τα χρώματα και τα νούμερα...
***Δεν νομίζω ότι θα λειτουργήσει με internet explorer...
ΚΑΛΗ ΕΠΙΤΥΧΙΑ και ΚΑΛΑ ΚΕΡΔΗ !!!
Πηγή : thanks to switchonthecode.com/
{Αν σας άρεσε αυτή η ανάρτηση, ξοδέψτε 5'' από το χρόνο σας να τη μοιράσετε με τα πλήκτρα από κάτω}