Hover στα εικονίδια επικοινωνίας στα θέματα [PunBB,phpBB2]

Για σας.
Σήμερα θα σας δείξω πως να βαλετε Hover στα εικονίδια επικοινωνίας στα θέματα
Όπως αυτό
[Πρέπει να είστε εγγεγραμμένοι και συνδεδεμένοι για να δείτε αυτή την εικόνα.]
Μπαίνετε
Admin Panel >> Εμφάνιση >> Πρότυπα >> Γενική Διαχείριση >> viewtopic_body
και ψάχνετε τον παρακάτω κώδικα

Κώδικας:

{postrow.displayed.PROFILE_IMG} {postrow.displayed.PM_IMG} {postrow.displayed.EMAIL_IMG}<!-- BEGIN contact_field --> {postrow.displayed.contact_field.CONTENT}<!-- END contact_field -->

και τον κάνετε

Κώδικας:

<span class="mikraiconkatoapototopicpmprofilektl1">{postrow.displayed.PROFILE_IMG}</span> <span class="mikraiconkatoapototopicpmprofilektl2">{postrow.displayed.PM_IMG}</span> <span class="mikraiconkatoapototopicpmprofilektl3">{postrow.displayed.EMAIL_IMG}</span><!-- BEGIN contact_field --> <span class="mikraiconkatoapototopicpmprofilektl4">{postrow.displayed.contact_field.CONTENT}</span><!-- END contact_field -->

μετά μπαίνετε
Admin Panel >> Εμφάνιση >> Χρώματα >> CSS Stylesheet
και βάζετε τον παρακάτω κώδικα

Κώδικας:

.mikraiconkatoapototopicpmprofilektl1{
    background-color: #4E6A97;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    color: #FFFFFF;
    display: inline-block;
    padding-bottom: 3px;
    padding-left: 3px;
    padding-right: 3px;
    padding-top: 3px;
}

.mikraiconkatoapototopicpmprofilektl1:hover {
    background-color: #D69411;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    color: #FFFFFF;
    display: inline-block;
    padding-bottom: 3px;
    padding-left: 3px;
    padding-right: 3px;
    padding-top: 3px;
}


.mikraiconkatoapototopicpmprofilektl2{
    background-color: #4E6A97;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    color: #FFFFFF;
    display: inline-block;
    padding-bottom: 3px;
    padding-left: 3px;
    padding-right: 3px;
    padding-top: 3px;
}

.mikraiconkatoapototopicpmprofilektl2:hover {
    background-color: #D69411;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    color: #FFFFFF;
    display: inline-block;
    padding-bottom: 3px;
    padding-left: 3px;
    padding-right: 3px;
    padding-top: 3px;
}




.mikraiconkatoapototopicpmprofilektl3{
    background-color: #4E6A97;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    color: #FFFFFF;
    display: inline-block;
    padding-bottom: 3px;
    padding-left: 3px;
    padding-right: 3px;
    padding-top: 3px;
}

.mikraiconkatoapototopicpmprofilektl3:hover {
    background-color: #D69411;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    color: #FFFFFF;
    display: inline-block;
    padding-bottom: 3px;
    padding-left: 3px;
    padding-right: 3px;
    padding-top: 3px;
}


.mikraiconkatoapototopicpmprofilektl4{
      background-color: #4E6A97;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    color: #FFFFFF;
    display: inline-block;
    padding-bottom: 3px;
    padding-left: 3px;
    padding-right: 3px;
    padding-top: 3px;
}

.mikraiconkatoapototopicpmprofilektl4:hover {
    background-color: #D69411;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    color: #FFFFFF;
    display: inline-block;
    padding-bottom: 3px;
    padding-left: 3px;
    padding-right: 3px;
    padding-top: 3px;
}

έτοιμο