9 Kas 2015

Bloga Sosyal Medya Butonu Nasil Eklenir?




Merhabalar Nasılsınız.

Geçen günler de bir takipçim benden blogumda ki sosyal medya butonlarımı nereden bulduğumu ve bloguma nasıl yerleştirdiğimi sormuştu. Ben de onun isteği ve bilmeyenlerin de faydalanması adına bugün sizlere bloga sosyal medya butonları eklemeyi aşamalarıyla beraber anlatacağım.



1. Buton Bulma(iconlar)
Ben blogumda ki iconlarımı iconfinder adresinden alıp kullandım.

İnternet sitesini açtığımız zaman karşımıza aşağıda ki gibi ekran gelecek.

Arama kutusuna aramak istediğimiz icon ismini yazıyoruz. Örn. İnstagram,facebook,youtube vb. gibi.




Arama yaptığımızdan iconlar karşımıza geliyor. Kendimize uygun olanı seçmek için sol kenarda bulunan arama filtreleme kısımdan seçiyoruz. İşaretli olanlar bizim işimize yarayacak olanlardır.
1- Free seçerseniz ücretsizler karşımıza çıkar.
2- Buradan icon boyutunu seçiyoruz dilediğiniz büyüklükte seçebilirsiniz. Ben blogum için 32px kullandım. Bence ideal boyutu bu ama dediğim gibi siz ister daha büyük ister daha küçük sezvkinize göre seçebilirsiniz. 
3- İcon arka plan seçmemizi sağlıyor. Benim kullandığım en sonda ki transparan  sizlerde transparan seçerseniz daha iyi olur.

Altta kendi seçtiğim ayarla ekrana gelen iconları görüyorsunuz.



Ben sizlere göstermek amaçlı seçimlerimi yaptım karşıma gelen seçeneklerden beğendiğimi seçtim.



Yukarıda gördüğünüz ekran karşımıza çıkacak. Buradan işaretlemiş olduğum PNG butonuna tıklayıp iconu bilgisayarımıza indiriyoruz. Siteyle işimiz bu kadar diğer indirmek istediğiniz sosyal medya iconlarını aynı işlemi uygulayarak bilgisayara indirin.

2.Butonu Bloga Ekleme

İndirdiğimiz iconları öncelikle herhangi bir upload sitesine yüklüyoruz ki bu linkler bize birazdan lazım olacak. Ben upload sitesi olarak Hızlı resim  adresini kullandım.

  

Dosya seç kısmına tıklayıp ekrana gelen pencereden iconumuzu seçiyoruz ve ardından yükle butonuna basıyoruz.


Gelen ekrandan bizim işimize yarayacak olan üst kısımda işaretlediğim resim direkt adresi olan kısım. Burada ki linki kopyalayıp bir yere kaydedin. Diğer icon resimleri için de aynı işlemi yapın.





Daha sonra blogger adresimize gelip yerleşim yazan yere giriyoruz. Gelen ekranda gadget ekle  yazan yere tıklayıp HTML/JavaScript seçeneğini seçiyoruz. 







Açılan kutucuğa sizlere vereceğim kodları yapıştırın.


<a href="https://www.facebook.com/face adınız"><img 
src= "icon resim linki " /></a>

<a href="https://instagram.com/instagram hesap adınız/"><img 
src="icon resim linki" /></a>


Kırmızı işaretli yerlere sosyal hesap linklerinizi kopyalayın.




İcon resmi linki yazan yere de az önce hızlı resim sitesine yüklediğimiz sosyal medya icon resimlerinin linklerini yapıştırın
Daha sonra tamamı tıklayınız.



Altta blog sayfamda kullandığım şekli görebilirsiniz. 



Tamam diyip kutucuğu kapatıyoruz. 




Kendi blogumda ki görüntü.



Bonus olarak yukarıda gördüğünüz çizgileri eklemek isterseniz eğer tekrar gadget ekle seçip HTML/Java tıklayıp altta ki kodu kopyalarsanız sayfanıza altına ve üstüne ya da istediğiniz bir köşeye ayırma çizgisini ekleyebilirsiniz.

<hr width="”10%”" color="”#000000”" size="1" />


Bu konuyu yazmama sebep olan takipçimin bir diğer sorusu ise blogumda ki fotoğrafla ilgiliydi.Son olarak konumuzun dışında olacak ama onu da eklemek istedim bu yazıma. 

Yerleşim-gadget ekle-resim seçeneğini seçiyoruz.



Dosya Seç kısmından  bloga yüklemek yüklemek istediğimiz resmi seçiyoruz.




Başlıksız kabul etmiyor resmi diye hatırlıyorum bu yüzden ben de bloguma gelenleri karşılamak adına Merhabalar yazdım.
Alt kısımda sığacak şekilde küçült yazısına tıklayıp tamam diyoruz. Benim resmimin büyük olması resim boyutunun büyüklüğünden kaynaklanıyor. Resim boyutunu photoscape gibi programlarla büyütebilirsiniz. 










Benden bu kadar.  :)
Merak edip sormak istediğiniz herhangi bir konu varsa yorum kısmına yorum bırakmayı unutmayınız. Umarım yardımcı olabilmişimdir. 

Hoşkalın,
Sevgiler.


Beni Takip Edin 
YouTube - TUGBAGUNGOR