Ανακοίνωση: Τα περισσότερα download links από το Mediafire & το Rapidshare πλέον δεν λειτουργούν...Μπορείτε να κατεβάζετε τις εφαρμογές από τα official links!

Προσθέστε αναδυόμενο παράθυρο συνομιλίας στο Blog σας


20.2.12 | ,

Συντάκτης άρθρου: Αυτόνομος
Στην σημερινή μας δημοσίευση θα σας δείξουμε πως θα βάλετε στο Blog σας ένα αναδυόμενο παράθυρο συνομιλίας (Floating pop up chat box) .
Η διαδικασία είναι σχετικά εύκολη και έχει ως εξής :
Καταρχάς προτού κάνετε οποιαδήποτε αλλαγή στον κώδικα του Blog σας κρατήστε ένα αντίγραφο ασφαλείας της τωρινού κώδικα του !

1. Καταρχάς εάν δεν έχετε ήδη λογαριασμό σε κάποια σελίδα η οποία παρέχει δωρεάν Chat box , κάντε έναν λογαριασμό σε μία από τις παρακάτω ιστοσελίδες:

chatango.com/ (Αρκετά καλή)
xat.com/ (Καλή !)
cbox.ws/ (Πολύ καλή)
shoutmix.com/ (Αρκετά καλή και καλόγουστη)
chatroll.com/ (Πολύ καλή επίσης)

Π.χ έχουμε διαλέξει να κάνουμε το chat box μας στην σελίδα chatroll.com, αφού έχουμε φτάσει στο Step 2 δηλαδή της εγκατάστασης του chat box στην σελίδα μας (Step 2: Install) , κανουμε κλίκ στο εικονίδιο του blogger το οποίο βρίσκεται στα δεξιά της σελίδας (στην σελίδα chatroll.com πάντα!) και μετά μας βγάζει την καρτέλα στην οποία έχει τον απαραίτητο html κώδικα τον οποίο θα χρειαστούμε .
Μας ενδιαφέρει το σημείο του πάνω μέρος της καρτέλας το οποίο λέει
Install Chatroll on Blogger:
Add Chatroll to your Blogger Sidebar
και το βήμα 3. Αντιγράφουμε τον συγκεκριμένο κώδικα και τον κρατάμε προσωρινά κάπου αποθηκευμένο.
2. Μετά αφού έχουμε δημιουργήσει το chat box και έχουμε αποθηκεύσει τον κώδικα του chat box μας , βρίσκουμε το 
</head> 
στον κώδικα του blog μας και ακριβώς πρίν απο αυτό κανουμε επικόλληση τον παρακάτω κώδικα:
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>

3. Αποθηκεύουμε τις έως τώρα αλλαγές μας και τώρα πηγαίνουμε στο
"Σχεδίαση" > "Στοιχεία σελίδας" και επιλέγουμε στο πλάι "Προσθήκη gadget" > "HTML/JavaScript
και κάνουμε επικόλληση τον παρακάτω κώδικα:


<script type="text/javascript">
//<!--
$(document).ready(function() {$(".bttslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.bttslikebox{background: url("
http://icons.iconarchive.com/icons/musett/antares/128/Chat-Folder-Black-icon.png
") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 110px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.bttslikebox div{border:none;position:relative;display:block;}
.bttslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.bttslikebox span a{color: #808080;text-decoration:none;}
.bttslikebox span a:hover{text-decoration:underline;}
</style><div class="bttslikebox" style=""><div> ΕΔΩ ΕΠΙΚΟΛΛΗΣΤΕ ΤΟΝ ΚΩΔΙΚΑ ΠΟΥ ΑΠΟΘΗΚΕΥΣΑΤΕ ΣΤΗΝ ΑΡΧΗ ΤΟΝ ΟΠΟΙΟ ΠΗΡΑΤΕ ΟΤΑΝ ΔΗΜΙΟΥΡΓΗΣΑΤΕ ΤΟ CHATBOX ΣΑΣ-(βλέπε βήμα 1.,σειρά 28-29) </div></div>

Πατάμε Αποθήκευση και αυτό ήταν !



Ελπίζουμε να σας άρεσε !



Ίσως να σου αρέσουν και αυτά:


3 Σχόλια...Αφήστε το δικό σας.:

Ανώνυμος είπε...

Καλημέρα..Να ρωτήσω...έχουμε βάλει στο blog μας chat από το:chatroll.com..Αλλά έχουμε το πρόβλημα ότι δεν μπορούν να μπούνε πάνω από 10 άτομα on line στο chat..Μήπως γνωρίζεται κάτι για το συγκεκριμένο?Να μπορούν δηλαδή να μπαίνουν περισσότεροι...

magakos είπε...

Καλησπέρα σας!
Το συγκεκριμένο chat στην δωρεάν του έκδοση τόσα άτομα δίνει...
Αν χρειάζεστε παραπάνω θα πρέπει να το αναβαθμίσετε επί πληρωμή όπως αναφέρει η ιστοσελίδα του.
Δείτε τον σχετικό πίνακα εδώ: http://chatroll.com/pricing

vaiol είπε...

Καλησπερα κ συγχαρητηρια για το μπλοκ κ την δουλεια σας.περι του τσατ θελω να ρωτησω.το:chatroll.com δινει 10 ατομα on line στην δωρεαν εκδοση αυτο το ειδα αλλα δε μπορω να βρω ποσα δινει το chatango.com???δε εχω καταλαβει απο την σελιδα τους.δινει τα ιδια?παραπανω?για την δωρεαν εκδοση μιλω.ευχαριστω πολυ!

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

Αφήστε ανώνυμα ή επώνυμα το σχόλιό σας (θετικό-αρνητικό) για αυτό το post ή απλά εκφράστε σχετικές απορίες σας...

@Από 19/09/2011 σχόλια που θα γράφονται με Greeklish θα διαγράφονται...

HTML tags που μπορείτε να χρησιμοποιήσετε:

Έντονη γραφή
Πλάγια γραφή
Εικόνα
Κυλιόμενο κείμενο
Σύνδεσμος
Χρωματισμός Κειμένου (Αντικαταστήστε το red με # και τον κωδικό χρώματος που θέλετε)

 
Ανακοίνωση: Επισκεφτείτε και κάντε εγγραφή τώρα στο Forum της σελίδας μας...Προγράμματα - Blogger tips - Τεχνολογικά νέα και πολλά άλλα σας περιμένουν.