MyBB Depo Forum
MyBB Butonları CSS Yapmak [ Font Awesome Detaylı ] - Baskı Önizleme

+- MyBB Depo Forum (https://mybbdepo.com)
+-- Forum: MyBB 1.6 Depo (https://mybbdepo.com/mybb-1-6-depo-forumu)
+--- Forum: MyBB 1.6 Modifikasyon & Eklenti Deposu (https://mybbdepo.com/mybb-1-6-modifikasyon-eklenti-deposu-forumu)
+---- Forum: Konu Gösterimi (https://mybbdepo.com/konu-gosterimi-forumu)
+---- Konu Başlığı: MyBB Butonları CSS Yapmak [ Font Awesome Detaylı ] (/mybb-butonlari-css-yapmak-font-awesome-detayli-konusu.html)

MyBB Butonları CSS Yapmak [ Font Awesome Detaylı ] - ßyßurak - 23-01-2014

1. Temalar&Şablonlar Sağ Ok Temalar Sağ Ok Global.css

Alttaki Kodu Global.css'nin En Altına Ekleyin.
Kod:
@import url(images/font-awesome-4.0.3/css/font-awesome.css);

/*----------------------------------------------------*/
/*            Button
/*----------------------------------------------------*/

.button {
    border-radius: 2px;
    background: #7ba0e1;
    border: 1px solid #6e90ca;
    padding: 6px;
    height: 29px;
    color: #fff;
    font-weight: bold;
    outline: 0;
    cursor: pointer;
}

.postbitbutton {
    display: inline;
    border-radius: 2px;
    background: #36d488;
    border-bottom: 3px solid #2EBB77;
    border-left: 1px solid #2EBB77;
    border-right: 1px solid #2EBB77;
    border-top: 1px solid #2EBB77;
    padding: 6px;
    height: 29px;
    color: #fff;
    font-weight: bold;
    outline: 0;
    cursor: pointer;
}

.postbitbutton:link, .postbitbutton:visited, .buyuk-button:link, .buyuk-button:visited {
    color: #fff;
    font-weight: bold;
}

.postbitbutton:hover {
    background: #7ba0e1;
    font-weight: bold;
    border-bottom: 3px solid #6588C5;
    border-left: 1px solid #6588C5;
    border-right: 1px solid #6588C5;
    border-top: 1px solid #6588C5;
}

2. Temalar&Şablonlar Sağ Ok Şablonlar Sağ Ok 8. PostBit - [postbit] Şablonlar Sağ Ok postbit_edit

Sil Değiştir.
Kod:
<a class="postbitbutton" href="editpost.php?pid={$post['pid']}"  id="edit_post_{$post['pid']}" title="{$lang->postbit_edit}"><i class="fa fa-pencil-square-o"></i>Düzenle</a>
<div id="edit_post_{$post['pid']}_popup" class="popup_menu" style="display: none;"><div class="popup_item_container"><a href="javascript:;" onclick="Thread.quickEdit({$post['pid']});" class="popup_item">{$lang->postbit_quick_edit}</a></div><div class="popup_item_container"><a href="editpost.php?pid={$post['pid']}" class="popup_item">{$lang->postbit_full_edit}</a></div></div>
<script type="text/javascript">
// <!--
    if(use_xmlhttprequest == "1")
    {
        new PopupMenu("edit_post_{$post['pid']}");
    }
// -->
</script>

3. Temalar&Şablonlar Sağ Ok Şablonlar Sağ Ok 8. PostBit - [postbit] Şablonlar Sağ Ok postbit_email

Sil Değiştir.
Kod:
<a class="postbitbutton" href="member.php?action=emailuser&amp;uid={$post['uid']}" title="{$lang->postbit_email}"><i class="fa fa-envelope"></i>Mail</a>

4. Temalar&Şablonlar Sağ Ok Şablonlar Sağ Ok 8. PostBit - [postbit] Şablonlar Sağ Ok postbit_find

Sil Değiştir.
Kod:
<a class="postbitbutton" href="search.php?action=finduser&amp;uid={$post['uid']}" title="{$lang->postbit_find}"><i class="fa fa-search"></i>Ara</a>

5. Temalar&Şablonlar Sağ Ok Şablonlar Sağ Ok 8. PostBit - [postbit] Şablonlar Sağ Ok postbit_forward_pm

Sil Değiştir.
Kod:
<a class="postbitbutton" href="private.php?action=send&amp;pmid={$id}&amp;do=forward" title="{$lang->forward}"><i class="fa fa-mail-reply-all"></i>Sevket</a>

6. Temalar&Şablonlar Sağ Ok Şablonlar Sağ Ok 8. PostBit - [postbit] Şablonlar Sağ Ok postbit_iplogged_hiden

Sil Değiştir.
Kod:
<a class="postbitbutton" href="moderation.php?action=getip&amp;pid={$post['pid']}" title="{$lang->postbit_ipaddress}{$lang->postbit_ipaddress_logged}"><i class="fa fa-map-marker"></i>IP No</a>

7. Temalar&Şablonlar Sağ Ok Şablonlar Sağ Ok 8. PostBit - [postbit] Şablonlar Sağ Ok postbit_multiquote

Sil Değiştir.
Kod:
<a class="postbitbutton" href="javascript:Thread.multiQuote({$post['pid']});" title="{$lang->postbit_multiquote}"><i class="fa fa-reply-all"></i>Çoklu Alıntı</a>

8. Temalar&Şablonlar Sağ Ok Şablonlar Sağ Ok 8. PostBit - [postbit] Şablonlar Sağ Ok postbit_pm

Sil Değiştir.
Kod:
<a class="postbitbutton" href="private.php?action=send&amp;uid={$post['uid']}" title="{$lang->postbit_pm}"><i class="fa fa-arrow-circle-right"></i>Mesaj</a>
9. Temalar&Şablonlar Sağ Ok Şablonlar Sağ Ok 8. PostBit - [postbit] Şablonlar Sağ Ok postbit_quickdelete

Sil Değiştir.
Kod:
<a class="postbitbutton delete" href="editpost.php?pid={$post['pid']}" onclick="Thread.deletePost({$post['pid']}); return false;" style="display: none;" id="quick_delete_{$post['pid']}" title="{$lang->postbit_qdelete}"><i class="fa fa-trash-o"></i>Sil</a>
<script type="text/javascript">
// <!--
    $('quick_delete_{$post['pid']}').style.display = '';
// -->
</script>

10. Temalar&Şablonlar Sağ Ok Şablonlar Sağ Ok 8. PostBit - [postbit] Şablonlar Sağ Ok postbit_quote

Sil Değiştir.
Kod:
<a class="postbitbutton" href="newreply.php?tid={$tid}&amp;replyto={$post['pid']}" title="{$lang->postbit_quote}"><i class="fa fa-reply"></i>Alıntı</a>

11. Temalar&Şablonlar Sağ Ok Şablonlar Sağ Ok 8. PostBit - [postbit] Şablonlar Sağ Ok postbit_rep_button

Sil Değiştir.
Kod:
<a class="postbitbutton rep" href="javascript:MyBB.reputation({$post['uid']},{$post['pid']});" title="{$lang->postbit_reputation_add}"><i class="fa fa-exchange"></i>Rep</a>

12. Temalar&Şablonlar Sağ Ok Şablonlar Sağ Ok 8. PostBit - [postbit] Şablonlar Sağ Ok postbit_reply_pm

Sil Değiştir.
Kod:
<a class="postbitbutton" href="private.php?action=send&amp;pmid={$id}&amp;do=reply" title="{$lang->reply_title}"><i class="fa fa-reply"></i>Cevapla</a>

13. Temalar&Şablonlar Sağ Ok Şablonlar Sağ Ok 8. PostBit - [postbit] Şablonlar Sağ Ok postbit_replyall_pm

Sil Değiştir.
Kod:
<a href="private.php?action=send&amp;pmid={$id}&amp;do=replyall"><i class="fa fa-group"></i>Çoklu Cevap</a>

14. Temalar&Şablonlar Sağ Ok Şablonlar Sağ Ok 8. PostBit - [postbit] Şablonlar Sağ Ok postbit_report

Sil Değiştir.
Kod:
<a class="postbitbutton" href="javascript:Thread.reportPost({$post['pid']});" title="{$lang->postbit_report}"><i class="fa fa-rocket"></i>Raporla</a>

15. Temalar&Şablonlar Sağ Ok Şablonlar Sağ Ok 8. PostBit - [postbit] Şablonlar Sağ Ok postbit_warn

Sil Değiştir.
Kod:
<a class="postbitbutton" href="warnings.php?action=warn&amp;uid={$post['uid']}&amp;pid={$post['pid']}" title="{$lang->postbit_warn}"><i class="fa fa-exclamation-triangle"></i>Uyar</a>

16. Temalar&Şablonlar Sağ Ok Şablonlar Sağ Ok 8. PostBit - [postbit] Şablonlar Sağ Ok postbit_www

Sil Değiştir.
Kod:
<a class="postbitbutton" href="{$post['website']}" target="_blank" title="{$lang->postbit_website}"><i class="fa fa-star"></i>Website</a>


17. Aşağıdaki Dosyayı FTTP'nizin Ana Dizinine Atın
Kod:
https://mega.co.nz/#!mN0wVZIa!XBwM2Wqk1VErBVSZDxLbogNfUxB4UifEd7Ua3wEGVCM

Resim-Grafik Ekran Görüntüsü
resim

Alıntı Alıntı: TasarimAraci.com

Cvp: MyBB Butonları CSS Yapmak [ Font Awesome Detaylı ] - SouLLesS - 23-01-2014

teşekkür et butonunu nasıl yapcaz

Cvp: MyBB Butonları CSS Yapmak [ Font Awesome Detaylı ] - ßyßurak - 23-01-2014

(23-01-2014, Saat:11:28)SouLLesS Adlı Kullanıcıdan Alıntı: teşekkür et butonunu nasıl yapcaz

Kod:
http://mybbdepo.com/mybb-tesekkur-et-butonunu-css-yapmak-ders-hd-konusu.html


Cvp: MyBB Butonları CSS Yapmak [ Font Awesome Detaylı ] - SvMedeT - 23-01-2014

Ayrıca bu modifikasyonu yapmakla 1 taşla 2 kuş vurmuş oldunuz Açık Ağızlı Gülümseme

Neden derseniz Burak konuya Font Awesome eklemiş ve siz bu ikonları forumda istediğiniz yere ekleyebilirsiniz.

Tüm ikonlar için aşağıdaki bağlantıyı kullanabilirsiniz.
Kod:
http://fontawesome.io/icons/

Nasıl ekleyeceğinizi bilmiyorsanız aşağıdaki bağlantıdan öğrenebilirsiniz.
Kod:
http://fontawesome.io/examples/

İyi forumlar..

Cvp: MyBB Butonları CSS Yapmak [ Font Awesome Detaylı ] - rejaksit - 16-02-2016

eveet şimdi gelelim "css" e bu kodların hangisi ne işe yarıyor dicem ya bu nekadar soru soruyor konu açıyor diceksiniz ama ben yeniyim yepyeni acemiyim çok acemi Gülümseme bu yüzden soracam bu kodlar ne işe yarıyor

Cvp: MyBB Butonları CSS Yapmak [ Font Awesome Detaylı ] - iCarly - 16-02-2016

(16-02-2016, Saat:21:23)rejaksit Adlı Kullanıcıdan Alıntı: eveet şimdi gelelim "css" e bu kodların hangisi ne işe yarıyor dicem ya bu nekadar soru soruyor konu açıyor diceksiniz ama ben yeniyim yepyeni acemiyim çok acemi Gülümseme bu yüzden soracam bu kodlar ne işe yarıyor

Bu mesajın altında gördüğün "Cevapla, Düzenle, Rep Ver, Rapor Et vb." gibi butonlar orjinalde (temaya göre değişir) resim şeklindedir. Mesela "postbit_report.png" gibi. Bu resimleri CSS kodlarıyla değiştirdiğinde örnek vereyim, Facebook'ta ki "Beğen" butonu gibi oluyor. Şekilli, renkli, ikonlu bir buton yapabiliyorsun kafana göre. Bu kodlar da işte onu sağlıyor.  Dil Çıkarma

Cvp: MyBB Butonları CSS Yapmak [ Font Awesome Detaylı ] - rejaksit - 16-02-2016

teşekkür ederim anlar gibi oldum Gülümseme hangi şablonun ne işe yaradığını anlatan bir anlatım mevcutmu şu an için en gerekli bilgilerden biri bu benim için