Navigation.tpl Görünümü Değiştirmek

[AhmetZekiTasgar]

Merhaba ForumX Takipçisi ;





Bazen tema yaparken navigasyon çubuğu kötü bir görüntü yaratabiliyor. Aşağıdaki kodları kullanarak daha güzenli bir görünüm navigation.tpl dosyasına ekleyebilirsiniz.





Temanızın içerisinden navigation.tpl dosyasını Açınız ve İçerisindekileri siliniz. Aşağıdaki kodları yapıştırıp kayıt edin.

<div class="navigation ignore-select"[available=lastcomments] style="padding: 4% 8%;"[/available]>


        <span class="page_prev" title="Önceki sayfa">
            <div class="pages">        [prev-link]<i class="icofont-hand-drawn-left"></i>[/prev-link]</div>
        </span>


    <div class="pages">{pages}</div>


    <span class="page_next" title="Sonraki sayfa">
            <div class="pages">    [next-link]<i class="icofont-hand-drawn-right"></i>[/next-link]</div>
        </span>





</div>

<style>
/* --- Постраничная навигация --- */
.navigation { margin: 25px 0; }
    .navigation:after { clear: both; display: block; content: ""; }

    .pages { text-align: left; }
    .pages span, .pages a:hover, .page_next-prev {
        background-color: #fff;
        box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2); -webkit-box-shadow: 0 1px 2px 0 rgba(0,0,0,0.2);
    }
    .pages span, .pages a {
         color: black;
  float: left;
  padding: 8px 16px;
  text-decoration: none;
  transition: background-color .3s;
  border: 1px solid #ddd;
    }
    .pages span { color: #399; }
    .pages a:hover { color: #fff; background-color: #f37600; }
    .pages span { color: #3394e6; }

    .page_next-prev { }
        .page_next-prev * { float: left; }
        .page_next-prev .icon { width: 32px; height: 20px; fill: #d7d7d7; }
        .page_next-prev > span >  a:hover .icon { fill: #3394e6; }
        .page_next-prev > span > * { float: left; padding: 8px 12px; }

    .page_next > span, .page_prev > span { opacity: 0.5; }

    /* Постраничная навигация в новости */
    .splitnewsnavigation { margin-top: 4%; padding-top: 4%; font-weight: bold; border-top: 1px solid #efefef; }
    .splitnewsnavigation > a, .splitnewsnavigation > span { padding: 6px 10px; }

/* --- Блок: Новости Партнеров --- */</stylE>