Konu: SMF ile Font-Icon Simgeleri Kullanma  (Okunma sayısı 1285 defa)

0 Üye ve 1 Ziyaretçi konuyu incelemekte.

22 Eylül 2013, 10:45
  • *
    • İleti: 211
    • Karma: 15
    • webtiryaki.com
    • Profili Görüntüle


Bugün sizlere başliktada belirtiğim gibi font icon kulanmayi anlatacağim malumunuz sitelerde girafikler önemli bir yer tutmakta buda hem site tirafiğini acilim hizini arti seo kalitesini onemli olcüde etkilemektedir.
dunyada pek cok web tasarimcisinin kulandigi bu olay kisacasi fotoşopta yapilan iconlarin font lara cevrilmesiyle elde edilen güzel bir uygulama.
Font Awesome Icon
Bugün sizlere bunlarin smf de kulanilmasini anlatacağim başlayalim formumuzun Menü barlarina ikon ekleyelim
(Pardon font) bunun icin

Themes/default/index.template.php mizi acalim

bu satiri buluyoruz
Kod: [Seç]
    // The ?fin20 part of this link is just here to make sure browsers don't cache it wrongly.
    echo '
Altina ekleyelim
Kod: [Seç]
        <link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet" />bunu yukarda verdiğim adresteki indirme linkindende indirip ftepeye ata bilirsiniz

şimdi Sources/Subs.php yi acalim ben örnek olarak help butonuna ikan atiyacam siz diğerlerinide ayni şekilde yaparsiniz

bul
Kod: [Seç]
            'help' => array(
                'title' => $txt['help'],
                'href' => $scripturl . '?action=help',
                'show' => true,
                'sub_buttons' => array(
                ),
            ),

şimdi şu adresten ilgili ikon kodunu alalim
BURDAN
aldiğimiz kodu boyle uyguluyacağiz unutmayin hangi parameteri aliyosaniz onun kodu

Kod: [Seç]
            'help' => array(
                'title' => '<i class="icon-lightbulb"></i> ' .$txt['help'],
                'href' => $scripturl . '?action=help',
                'show' => true,
                'sub_buttons' => array(
                ),
            ),

« Son Düzenleme: 22 Eylül 2013, 10:49 Gönderen: gecitli »

22 Eylül 2013, 10:58
Yanıtla #1
  • *
    • İleti: 2018
    • Karma: 41
    • Spina Bifida
    • Profili Görüntüle


01 Aralık 2013, 10:38
Yanıtla #2
  • *
    • İleti: 331
    • Karma: 17
    • haksever,huutheme
    • haksever
    • Profili Görüntüle

bende sitelerde iconlar yok nerde diyordum :)bilgilendirme emek için çok Teşekkürler.


20 Nisan 2014, 18:58
Yanıtla #3
  • *
    • İleti: 141
    • Karma: 1
    • Forumigo8navigation
    • Profili Görüntüle

gecitli arkadaşım.Bilgilendirme için teşekkürler.Fakat verdiğiniz kodu hiç değiştirmeden eklememe  rağmen görüntü aşağıda ki  gibi oluştu.Bunun sebebi nedir?



20 Nisan 2014, 19:45
Yanıtla #4
  • *
    • İleti: 211
    • Karma: 15
    • webtiryaki.com
    • Profili Görüntüle

yeni sisteme gecmişler şunlari deneyin

<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet"/>

ikon kodu böyle olacak

<i class="fa fa-home">

examples bolümünü ince


20 Nisan 2014, 19:52
Yanıtla #5
  • *
    • İleti: 141
    • Karma: 1
    • Forumigo8navigation
    • Profili Görüntüle

yeni sisteme gecmişler şunlari deneyin

<link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css" rel="stylesheet"/>

ikon kodu böyle olacak

<i class="fa fa-home">

examples bolümünü ince

font-awesome.css dosyası kendi css klasörümdedir.Aslında menü butonlarının tümünü sprites ile birleştirdim. o şekilde resim linki de verdim aynı sonuç olumsuz oldu.

« Son Düzenleme: 20 Nisan 2014, 20:02 Gönderen: kimyaci »

20 Nisan 2014, 22:32
Yanıtla #6
  • *
    • İleti: 211
    • Karma: 15
    • webtiryaki.com
    • Profili Görüntüle

Olmamasina imkan yok bir yerde hata yapiyorsunuz


20 Nisan 2014, 23:00
Yanıtla #7
  • *
    • İleti: 141
    • Karma: 1
    • Forumigo8navigation
    • Profili Görüntüle

Olmamasina imkan yok bir yerde hata yapiyorsunuz

Sizin kodu kopyalayarak yapıyorum.Kaç defa denedim sonuç aynı.