- Uyumlu XF 2 Sürümleri
Yapılması Gerekenler.
Öncelikle aşağıdaki yolu izleyerek bir widget oluşturuyoruz.
Admicp-> Görünüm ve Diller -> Widget Yöneticisi-> Widget Ekle
Karşımıza Gelen alandan HTML türünü seçiyoruz.
Örnek Resim:
Daha sonra aşağıdaki alanları dolduruyoruz.
Widget kimliği-ID: hackstatus
Başlık: Hack Status (Dilediğiniz ismi de verebilirsiniz.)
Bu alandan göstermek istediğimiz alanı seçmemiz gerekiyor. Ben Forum listesi: Kenar çubuğu alanında gösterim yaptıracağım.
Örnek Resim:
Daha sonra yine aynı alanda şablon bölümünü göreceksiniz. Bu alana aşağıdaki kodları yerleştirelim.
<span class="hackStatus HackLoader" dir="auto"><a href="http://linkgir"> LOADER </a></span>
<span class="hackStatus hackUpdate" dir="auto"><a href="http://linkgir"> UPDATE</a></span>
<span class="hackStatus hackRun" dir="auto"><a href="http://linkgir"> RUN </a></span>
<span class="hackStatus hackNotrun" dir="auto"><a href="http://linkgir"> NOTRUN</a></span>
Örnek Resim:
Kayıt edip diğer işlemlere geçebiliriz.
Şablonlarımızdan extra.less şablonumuzu açıyoruz ve içerisine aşağıdaki less kodlarını giriyoruz.
.hackStatus {
color: rgba(255,255,255,0.8);
border-radius: 2px;
display: inline-block;
position: relative;
padding: 10px 6px 8px 32px;
margin-bottom: 4px;
cursor: pointer;
font-weight: normal;
list-style: none;
font-size: 12px;
width: 100%;
a {
color: #FFF;
}
&:before {
background-color: rgba(0,0,0,0.2);
position: absolute;
border-right: 2px solid rgba(0,0,0,0.1);
top: 0;
bottom: 0;
left: 0;
padding: 6px 1px 0 5px;
width: 20px;
.m-faBase();
text-align: center;
font-size: 17px;
}
}
.HackLoader {
background-color: #2196F3;
&:before {
content: "\f12a";
}
}
.hackUpdate {
background-color: #ef8216;
&:before {
content: "\f021";
}
}
.hackRun {
background-color: #259845;
&:before {
content: "\f00c";
}
}
.hackNotrun {
background-color: #e30a17;
&:before {
content: "\f00d";
}
}
Kayıt edip sonuca bakabiliriz.
Sizde bu şekilde farklı işlemler yapabilirsiniz.
Kolay gelsin.