Blog İcon Simgeleri Nasıl Oluşturulur?

10/17/2015
Blogger blogspot simgeler

Blog İcon Simgeleri Nasıl Oluşturulur? - Blogunuzda yayınladığınız yazılarınızda ve blogunuzda oluşturmuş olduğunuz menu yazılarında simge - emoji kullanmak isteyenler için harika bir icon serisini sizlerle paylaşmak istedim.

Örneğin: Blogunuzun üst menusunde Anasayfa yazan yere bir simge koymak istediniz yada oluşturmak istediniz bunu küçük bir kod ile yapabilirsiniz.

Blogger Blogspot Simgeleri Nasıl Eklenir?


1- Blogunuzun kumanda Şablon ve Şablon-HTML'yi Düzenle kısmında Ctrl + F tuşları yardımı ile </head> kodunu bulun ve aşağıdaki javaScript koduu </head> kodunun hemen üst kısmına ekleyin ve şablonu kaydedin.

<link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.6.0/css/font-awesome.min.css' rel='stylesheet'/>

2- Blogunuzda yeni yayın oluşturduğunuzda bir ifade kullanmak istediğinde kırmızı ile icon-home yazan yere görmek istediğiniz ifadeyi şu şekilde yazmanız yeterli facebook ve twitter gibi sosyal medya icon simgelerini oluşturabilirsiniz.

3- Simgelerin boyutlarını değiştirmek için aşağıdaki kodda belirtilenleri uygulamanız yeterli olacaktır. Simge içerisinden bulunan fa-2x ve fa-3x simge boyutlarını değiştirmektedir. Simge içerisinde bulunan fa-fw simgenin iki yana genişlemesi için kullanılır.

<i class="fa fa-facebook"></i>
<i class="fa fa-facebook fa-2x"></i>
<i class="fa fa-facebook fa-2x fa-fw"></i>
<i class="fa fa-facebook fa-3x"></i>
<i class="fa fa-facebook fa-3x fa-fw"></i>



4- Blog icon ifadesini çerçeve içine almak için kullanlan kod;

<i class="fa fa-dribbble fa-border"></i>
<i class="fa fa-dribbble fa-2x fa-border"></i>
<i class="fa fa-dribbble fa-3x fa-border"></i>



5- Sürekli hareket eden yani dönen icon/simgeler için kullanılan aşağıdaki kod;

<i class="fa fa-dribbble fa-spin"></i>
<i class="fa fa-dribbble fa-2x fa-spin"></i>
<i class="fa fa-dribbble fa-3x fa-spin"></i>



6- Yönüne göre yani yukarı - aşağa - sola yada sağa yönler için aşağıdaki kodları kullanın;

<i class="fa fa-play-circle fa-rotate-90"></i>
<i class="fa fa-play-circle fa-rotate-180"></i>
<i class="fa fa-play-circle fa-rotate-270"></i>
<i class="fa fa-play-circle fa-rotate-360"></i>



Blogunuzda simgeleri artık kolayca oluşturabilirsiniz. Blogger blogspot icon/simge listesi için buraya tıklayın.

Kategori İçerikleri



Blogger
Disqus
Yorum Ekle

Hiç yorum yok