Η τρέχουσα ημερομηνία/ώρα είναι Παρ Απρ 26, 2024 5:17 pm
Η αναζήτηση βρήκε 1 εγγραφή
| Προσθέστε μπάρα για το πεδίο Φήμης | |
Με αυτό τον οδηγό θα μάθετε πως να κάνετε το πεδίο Φήμης σε μια μπάρα με αυξανόμενες εικόνες κουτιών ή αστεριών ανάλογα με τον αριθμό φήμης που έχουν τα μέλη στο φόρουμ σας.
Η μπάρα φήμης θα δουλέψει για όλες τις μορφές φόρουμ φτάνει το πρότυπο viewtopic_body να μην είναι αλλαγμένο σε μεγάλο βαθμό.
Ενεργοποίηση πεδίου Φήμης
Για να δουλέψει ο οδηγός αυτός πρέπει πρώτα να ενεργοποιήσετε το σύστημα. Πάτε: Πίνακας Διαχείρισης > Λειτουργικές Μονάδες > Πόντοι και φήμη > Φήμη και ενεργοποιείτε το σύστημα και το αποθηκεύετε:
Μορφοποίηση CSS
Πάτε: Πίνακας Διαχείρισης > Εμφάνιση > Εικόνες και χρώματα > Χρώματα > CSS Stylesheet. Άρα, οι εικόνες αυτές (τα κουτιά και τα αστέρια) έχουν ένα συγκεκριμένο στυλ. Προσθέστε τον εξής κώδικα στο CSS σας:
- Κώδικας:
#repu { margin:2px 0; } .repuBlock { height:8px; width:8px; background:#0A0; border:1px solid #080; -webkit-border-radius:2px; -moz-border-radius:2px; border-radius:2px; -webkit-box-shadow:0 3px 3px #0C0 inset; -moz-box-shadow:0 3px 3px #0C0 inset; box-shadow:0 3px 3px #0C0 inset; display:inline-block; margin:0 0.5px; }
Εξηγήσεις: height:8px; / width:8px; Το μέγεθος των εικόνων σε ύψος και πλάτος αντίστοιχα. background:#0A0; Δίνει στα κουτιά το πράσινο χρώμα. border:1px solid #080; Δίνει στα κουτιά το έντονο πράσινο χρώμα στο περίγραμμα 1 pixel. border-radius:2px; Κάνει τις γωνίες των κουτιών ελαφρώς κυκλικές. box-shadow:0 3px 3px #0C0 inset; Δίνει στα κουτιά μια ελαφριά πράσινη σκιά για να φαίνονται πιο λαμπερά. display:inline-block; Ορίζει τις εικόνες να είναι σε μια σειρά. margin:0 0.5px; Ορίζει ένα 0.5 pixel κενό μεταξύ των εικόνων.
Javascript
Πάμε: Πίνακας Διαχείρισης > Λειτουργικές Μονάδες > HTML & JAVASCRIPT > Διαχείριση κωδικών Javascript και συμπληρώνουμε τα πεδία αναλόγως με βάση τα παρακάτω:
Title : Reputation Bars Placement : In the topics Javascript Code : αντιγραφή / επικόλληση του παρακάτω κώδικα
- Κώδικας:
$(document).ready(function() { var version = 'phpbb3'; var settings = { repName : 'Φήμη', repStyle : 'block', repImage : 'http://i57.servimg.com/u/f57/18/21/41/30/star12.png' }; var repLv = { lv1 : 1, lv2 : 2, lv3 : 3, lv4 : 4, lv5 : 5, lv6 : 6, lv7 : 7, lv8 : 8 }; if (settings.repStyle.toLowerCase() == 'block') { var repBlock = '<span id="rLv" class="repuBlock">' } else if (settings.repStyle.toLowerCase() == 'image') { var repBlock = '<img id="rLv" src="'+settings.repImage+'"/>' } else { var repBlock = '<span id="rLv" class="repuBlock">' } var ver = { phpbb2 : version.toLowerCase() == 'phpbb2', phpbb3 : version.toLowerCase() == 'phpbb3', punbb : version.toLowerCase() == 'punbb', invision : version.toLowerCase() == 'invision' }; var reg = new RegExp('.*'+settings.repName+':\\s+(\\d+).*'); if (ver.phpbb3 || ver.punbb || ver.invision) { if (ver.phpbb3 || ver.invision) { var profSel = '.postprofile'; var addRepu = $(this).find('dt').append('<div id="repu">'); } else if (ver.punbb) { var profSel = '.user'; var addRepu = $(this).find('.user-ident').prepend('<div id="repu">'); } $(profSel).each(function() { var rep = Number($(this).text().replace(reg,'$1')); addRepu; if (rep >= repLv.lv1) { $(this).find('#repu').append(repBlock); var next = rep + '/' + repLv.lv2 } if (rep >= repLv.lv2) { $(this).find('#repu').append(repBlock); var next = rep + '/' + repLv.lv3 } if (rep >= repLv.lv3) { $(this).find('#repu').append(repBlock); var next = rep + '/' + repLv.lv4 } if (rep >= repLv.lv4) { $(this).find('#repu').append(repBlock); var next = rep + '/' + repLv.lv5 } if (rep >= repLv.lv5) { $(this).find('#repu').append(repBlock); var next = rep + '/' + repLv.lv6 } if (rep >= repLv.lv6) { $(this).find('#repu').append(repBlock); var next = rep + '/' + repLv.lv7 } if (rep >= repLv.lv7) { $(this).find('#repu').append(repBlock); var next = rep + '/' + repLv.lv8 } if (rep >= repLv.lv8) { $(this).find('#repu').append(repBlock); var next = 'MAX' } $(this).find('#repu').attr('title','Reputation level ' + $(this).find('#rLv').length + '\nNext : (' + next + ')'); }); } else if (ver.phpbb2) { $('td .postdetails.poster-profile').each(function() { var rep = Number($(this).text().replace(reg,'$1')); $(this).parent().find('.name').next().after('<div id="repu">'); if (rep >= repLv.lv1) { $(this).parent().find('#repu').append(repBlock); var next = rep + '/' + repLv.lv2 } if (rep >= repLv.lv2) { $(this).parent().find('#repu').append(repBlock); var next = rep + '/' + repLv.lv3 } if (rep >= repLv.lv3) { $(this).parent().find('#repu').append(repBlock); var next = rep + '/' + repLv.lv4 } if (rep >= repLv.lv4) { $(this).parent().find('#repu').append(repBlock); var next = rep + '/' + repLv.lv5 } if (rep >= repLv.lv5) { $(this).parent().find('#repu').append(repBlock); var next = rep + '/' + repLv.lv6 } if (rep >= repLv.lv6) { $(this).parent().find('#repu').append(repBlock); var next = rep + '/' + repLv.lv7 } if (rep >= repLv.lv7) { $(this).parent().find('#repu').append(repBlock); var next = rep + '/' + repLv.lv8 } if (rep >= repLv.lv8) { $(this).parent().find('#repu').append(repBlock); var next = 'MAX' } $(this).parent().find('#repu').attr('title','Reputation level ' + $(this).parent().find('#rLv').length + '\nNext : (' + next + ')'); }); } });
Αλλαγές που πρέπει να γίνουν στο Javascript: Για να δουλέψει το Javascript αυτό πρέπει πρώτα να κάνετε κάποιες αλλαγές προσεκτικά.
var version = 'phpbb3' : Πρέπει να αλλάξετε το phpbb3 με την μορφή του φόρουμ σας. Οι μορφές είναι: phpbb2, phpbb3, punbb ή invision. repName : 'Φήμη' : Αλλάξετε το Φήμη με την λέξη που θέλετε να έχει το πεδίο φήμης σας. repStyle : 'block' : Σε αυτό το κομμάτι αλλάξετε το block ανάλογα με το είδος της εικόνας που θέλετε να έχετε. Αν θέλετε κουτάκια θα βάλετε: block (παρουσίαση) Αν θέλετε αστεράκια θα βάλετε: image (παρουσίαση) repImage : 'https://i.servimg.com/u/f57/18/21/41/30/star12.png' : Αυτή είναι η εικόνα για τα αστεράκια αν θέσετε στο πεδίο repStyle : 'image'. Αντικαθιστάτε τον ενεργό σύνδεσμο link της εικόνας https://i.servimg.com/u/f57/18/21/41/30/star12.png με έναν άλλο ενεργό σύνδεσμο link μιας εικόνας που θέλετε να έχετε. lv1 : 1, lv2 : 2, lv3 : 3.. : Αυτά είναι τα επίπεδα και τα ποσοστά φήμης για το κάθε επίπεδο. Εσείς πρέπει να ορίσετε πόση φήμη απαιτεί το κάθε επίπεδο για να λάβετε το επόμενο κουτί / αστέρι. Για παράδειγμα αν θέλετε για το επίπεδο 2 να έχει το μέλος 10 πόντους φήμης για να πάρει το δεύτερο κουτάκι / αστεράκι πρέπει να αλλάξετε στο lv2 : 2 το 2 με 10. Δηλαδή θα έχετε: lv1 : 1, lv2 : 10, ...
Σημείωση: Αυτός ο οδηγός μπορεί να γίνει και για το πεδίο των μηνυμάτων, των πόντων κλπ αλλά σχεδιάστηκε κυρίως για το πεδίο Φήμης.
Κάνοντας τις απαραίτητες αλλαγές και αποθηκεύοντάς τα είστε έτοιμοι!
|
Ο οδηγός γράφτηκε από Ange Tuteur του Αγγλικού Φόρουμ Υποστήριξης και μεταφράστηκε στα Ελληνικά για τις ανάγκες του ForumGreek. | |
|
- από Luffy
- Την / Το Τετ Δεκ 24, 2014 1:22 pm
-
- Αναζήτηση σε...: Οδηγοί & Συμβουλές
- Θεματική Ενότητα: Προσθέστε μπάρα για το πεδίο Φήμης
- Απαντήσεις: 0
- Αναγνώσεις: 1042