Ελληνική Κοινότητα Υποστήριξης ForumGreek
Καλωσήρθατε στο Ελληνικό Φόρουμ Υποστήριξης της ForumGreek!!

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

Προσθέστε μια ανακοίνωση στο πάνω μέρος του φόρουμ

Επισκόπηση προηγούμενης Θ.Ενότητας Επισκόπηση επόμενης Θ.Ενότητας Πήγαινε κάτω

Προσθέστε μια ανακοίνωση στο πάνω μέρος του φόρουμ

Δημοσίευση από Luffy Την / Το Δευ Δεκ 29, 2014 1:06 pm

Προσθέστε μια ανακοίνωση στο πάνω μέρος του φόρουμ


Με αυτό τον οδηγό μπορείτε όλοι σας να προσθέσετε μια ανακοίνωση στο πάνω μέρος του φόρουμ σας όπου σε κάθε σελίδα και σε κάθε μήνυμα πάτε, αυτή η ανακοίνωση θα μένει μόνιμα εκεί. Επίσης, η ανακοίνωση αυτή μπορεί να αλλαχτεί από τους Ιδρυτές του κάθε φόρουμ σε οτιδήποτε θελήσει αυτός και όποτε το θελήσει. Η ανακοίνωση αυτή φαίνεται σε όλους τους βαθμούς ακόμα και σε επισκέπτες.



Μορφοποίηση CSS

Αρχικά θα βάλουμε το CSS όπου μετά τον κώδικα εξηγείται η κάθε γραμμή του. Πάμε: Πίνακας Διαχείρισης > Εμφάνιση > Εικόνες και χρώματα > Χρώματα > CSS Stylesheet και βάζουμε στο CSS τον εξής κώδικα:
Κώδικας:
.GlAnnounc{
background: url(http://www.ucp-asbl.be/local/cache-vignettes/L128xH128/arton1471-383ec.png) no-repeat 14px #DFE5FF;
background-size: 40px 30px;
border: 1px solid #005479;
border-radius: 3px;
box-shadow: 2px 2px 2px #DFDFDF;
color: #FCFFC3;
font-size: 15px;
margin: 5px;
padding-bottom: 10px;
padding-left: 64px;
padding-top: 8px;
text-shadow: 1px 1px 3px #000;
}
Τι κάνει η κάθε γραμμή του κώδικα:
- .GlAnnounc : Αυτή είναι η εντολή που θα ορίσουμε στο πρότυπο για να αλλάξουμε το στυλ του κουτιού ανακοίνωσης.
- background: url(http://www.ucp-asbl.be/local/cache-vignettes/L128xH128/arton1471-383ec.png) no-repeat 14px #DFE5FF; : Αυτή η γραμμή είναι για το φόντο της ανακοίνωσης. Προσθέτει την εικόνα πριν το κείμενο και αλλάζει το χρώμα του φόντου σε ελαφρύ γαλάζιο με αυτό: #DFE5FF
- background-size: 40px 30px; : Αυτή η γραμμή αλλάζει το μέγεθος της εικόνας που αναφέραμε πιο πάνω σε 40 pixel πλάτος και 30 pixel ύψος. Αυτά μπορείτε να τα κάνετε όπως εσείς θέλετε.
- border: 1px solid #005479; : Προσθέτει περίγραμμα 1 pixel χρώματος μπλε σκούρο.
- border-radius: 3px; : Κάνει τις γωνίες του κουτιού ελαφρώς γωνιακές.
- box-shadow: 2px 2px 2px #DFDFDF; : Προσθέτει μια ελαφρώς γκρι σκιά στο κουτί της ανακοίνωσης.
- color: #FCFFC3; : Κάνει τα γράμματα της ανακοίνωσης κιτρινωπά.
- font-size: 15px; : Το μέγεθος των γραμμάτων είναι 15 pixel.
- margin: 5px; : Αφήνει μια απόσταση 5 pixel από οτιδήποτε βρίσκεται πάνω, κάτω, δεξιά και αριστερά από το κουτί ανακοίνωσης.
- padding-bottom: 10px; : Η απόσταση των γραμμάτων από το κάτω μέρος του κουτιού ανακοίνωσης.
- padding-left: 64px; : Η απόσταση των γραμμάτων από το αριστερό μέρος του κουτιού ανακοίνωσης.
- padding-top: 8px; : Η απόσταση των γραμμάτων από το πάνω μέρος του κουτιού ανακοίνωσης.
- text-shadow: 1px 1px 3px #000; : Προσθέτει μια μαύρη σκιά στα γράμματα της ανακοίνωσης.

Αφού αλλάξετε ότι θέλετε από τον κώδικα CSS πατάτε .


Αλλαγές στα Πρότυπα

Τώρα θα προσθέσουμε τον κώδικα στο πρότυπο για να υυπάρχει παντού στο φόρουμ σας. Πάμε λοιπόν: Πίνακας Διαχείρισης > Εμφάνιση > Πρότυπα > Γενική Διαχείριση > overall_header και πατάμε το εικονίδιο για να επεξεργαστούμε το πρότυπο ( edit )
Ακολούθως βρίσκουμε αυτό:
Κώδικας:
<div id="page-body">
και ακριβώς πάνω από αυτό προσθέτουμε τον εξής κώδικα:
Κώδικας:
<div class="GlAnnounc">Aυτή είναι μια ανακοίνωση για το φόρουμ σας.</div>
Σε αυτό τον κώδικα αν αλλάξετε το GlAnnounc τότε πρέπει να αλλάξετε και την εντολή του κώδικα στο CSS. Ακολούθως αλλάξετε το κείμενο που υπάρχει "Aυτή είναι μια ανακοίνωση για το φόρουμ σας." με το κείμενο που θέλετε να περιέχει η ανακοίνωσή σας.

Αφού τελειώσετε τις αλλαγές που θέλετε πατάτε και ακολούθως δημοσιεύετε το πρότυπο πατώντας το εικονίδιο δημοσίευσης ( add ) και είστε έτοιμοι!  cheers

Ο οδηγός γράφτηκε από Luffy για τις ανάγκες του ForumGreek.



Luffy
Διαχειριστής

Διαχειριστής

Άντρας
Τόπος : Ελλάδα
Δημοσιεύσεις : 1802

Επιστροφή στην κορυφή Πήγαινε κάτω

Επισκόπηση προηγούμενης Θ.Ενότητας Επισκόπηση επόμενης Θ.Ενότητας Επιστροφή στην κορυφή


 
Δικαιώματα σας στην κατηγορία αυτή
Δεν μπορείτε να απαντήσετε στα Θέματα αυτής της Δ.Συζήτησης
Χρειάζεστε βοήθεια;
Στις Συχνές Ερωτήσεις μπορείτε να βρείτε σημαντικές πληροφορίες που θα σας βοηθήσουν!