ForumNavLinks


Μη Συνδεδεμενος Παρακαλώ συνδεθείτε ή εγγραφείτε

NavBar οπως το IPB [PunBB]

Πήγαινε κάτω  Μήνυμα [Σελίδα 1 από 1]

1 NavBar οπως το IPB [PunBB] Την / Το Τετ Φεβ 27, 2013 6:27 am

Admin

avatar
Administrator
Administrator
Γεια σας.
σήμερα θα σας δείξω πως να κάνετε το NavBar οπως το IPB
Όπως αυτό
Όταν δεν έχεις κάνει σύνδεση
[Πρέπει να είστε εγγεγραμμένοι και συνδεδεμένοι για να δείτε αυτή την εικόνα.]
Και όταν έχεις κάνει σύνδεση
[Πρέπει να είστε εγγεγραμμένοι και συνδεδεμένοι για να δείτε αυτή την εικόνα.]
Μπαίνετε
Admin Panel >> Εμφάνιση >> Εικόνες και χρώματα >> Χρώματα >> CSS Stylesheet
και βάζετε τον παρακάτω κώδικα
Κώδικας:
#pun-head #pun-navlinks {
    background-color: #171717;
    background-image: url("http://i14.servimg.com/u/f14/18/01/17/16/800_a_22.png");
    background-repeat: repeat-x;
    color: #fff;
    font-size: 13px;
    height: 37px;
    margin-bottom: 10px;
    margin-left: -12px;
    width: 100%!important;
}

#pun-head #pun-navlinks {
    background-color: #171717;
    background-image: url("http://i14.servimg.com/u/f14/18/01/17/16/800_a_22.png");
    background-repeat: repeat-x;
    color: #fff;
    font-size: 13px;
    height: 37px;
    margin-bottom: 10px;
    margin-left: -12px;
    width: 100%!important;
}

#pun-navlinks1 ul {
    list-style: none;
    font-size: 10px;
    color: #757575;
    transform: translate(0px, -13px);
}

#pun-navlinks1 li {
    display: inline;
    font-size: 1.15em;
}

#pun-navlinks1 li a {
    margin: 0 0.1em 0 0;
}

#pun-navlinks1 a, #pun-navlinks1 a:visited {
    color: #fff;
    font-weight: normal;
    text-decoration: none;
    text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.6);
    padding-left: 5px;
    line-height: 26px;
    transform: translate(0px, -52px);
}

#pun-navlinks1 a:hover {
    color: #fff;
    font-weight: normal;
    text-decoration: none;
    text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.6);
    padding-left: 5px;
    line-height: 26px;
    background-color: rgba(0, 0, 0, 0.2);
    padding-top: 13px;
    padding-bottom: 13px;
    padding-right: 5px;
    transform: translate(0px, -13px);
}

#pun-navlinks a:hover {
    color: #fff;
    font-weight: normal;
    text-decoration: none;
    text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.6);
    padding-left: 5px;
    line-height: 26px;
    background-color: rgba(0, 0, 0, 0.2);
    padding-top: 13px;
    padding-bottom: 13px;
    padding-right: 5px;
}

#pun-navlinks ul {
    list-style: none;
    font-size: 10px;
    color: #757575;
}

#pun-navlinks li {
    display: inline;
    font-size: 1.15em;
}

#pun-navlinks li a {
    margin: 0 0.1em 0 0;
}

#pun-navlinks a, #pun-navlinks1 a:visited {
    color: #fff;
    font-weight: normal;
    text-decoration: none;
    text-shadow: -1px -1px 1px rgba(0, 0, 0, 0.6);
    padding-left: 5px;
    line-height: 26px;
    transform: translate(0px, -52px);
}

μετά μπαίνετε
Admin Panel >> Εμφάνιση >> Πρότυπα >> Γενική Διαχείριση >> overall_header
ψάχνετε τον παρακάτω κώδικα και τον διαγράφεται
Κώδικας:
</div>
               <div id="pun-head">
                  <div id="pun-navlinks">
                     <ul class="clearfix">
                        <li>{GENERATED_NAV_BAR}</li>
                     </ul>
                  </div>
μετά ψάχνετε αυτόν τον κώδικα
Κώδικας:
<a id="top" name="top" accesskey="t"></a>
και βάζετε αυτόν τον κώδικα ακριβώς από πάνω
Κώδικας:
  <!-- BEGIN switch_user_logged_out -->
               <div id="pun-head">
                  <div id="pun-navlinks">
                     <ul class="clearfix">
                        <li><a href="/login"><img src="http://i15.servimg.com/u/f15/17/34/84/29/key11.png" border="0" alt="" /> Σύνδεση</a> <a href="/register"><img src="http://i73.servimg.com/u/f73/18/10/58/17/user_r10.png" border="0" alt="" /> Εγγραφή</a></li>
                     </ul>
                  </div>
               </div>
<!-- END switch_user_logged_out -->
  <!-- BEGIN switch_user_logged_in -->
                 <div id="pun-head">
                  <div id="pun-navlinks">
                     <ul class="clearfix">
                        <li><a href="/privmsg?folder=inbox"><img src="http://hitskin.com/themes/19/59/13/i_icon_mini_message.png" border="0" alt="" /> </a> <a href="/login?logout"><img src="http://hitskin.com/themes/19/59/13/i_icon_mini_logout.png" border="0" alt="" /> Αποσύνδεση</a></li>
                     </ul>
                  </div>
               </div>
  <!-- END switch_user_logged_in -->

έτοιμο Smile

Επισκόπηση του προφίλ των χρηστών http://help.forumgreek.com

Επιστροφή στην κορυφή  Μήνυμα [Σελίδα 1 από 1]

Δικαιώματα σας στην κατηγορία αυτή
Δεν μπορείτε να απαντήσετε στα Θέματα αυτής της Δ.Συζήτησης