Tumblr İmleç Ekleme | Ok İşareti Değiştirme | Mouse İmleci Yapma

Yine istek üzerine bu defa imlecin nasıl değiştiğini anlatıcam sadece nasıl değiştiğini değil aynı zamanda kendi imlecinizi nasıl yapacağınızı da anlatıcam.

Başlayalım o zaman..

İlk olarak bir kaç tane başka sitelerden çalıp beğendim kodlardan paylaşayım

1- Bıyık İmleci | Mustache Cursor

Kodu:

<style> body, a, a:hover { cursor:url('http://www.totallylayouts.com/cursors/random/mustache.png'), auto }</style>

Kodların nereye, nasıl ekleneceğini hâla bilmiyorsan;

     Tumblr HTML Düzenle Bölümüne Kod Nasıl Eklenir?

2- Pokemon'daki Kedi İmleci

Kodu:

<style> body, a, a:hover { cursor:url('http://www.totallylayouts.com/cursors/cartoon/meowth_pokemon.png'), auto }</style>

3- Angry Birds'deki Sarı Kuş

Kodu:

<style> body, a, a:hover { cursor:url('http://www.totallylayouts.com/cursors/cartoon/yellow_angry_bird.png'), auto }</style>

4- Angry Birds Kırmızı Kuş

Kodu: 

<style> body, a, a:hover { cursor:url('http://www.totallylayouts.com/cursors/cartoon/red_angry_bird.png'), auto }</style>

5- Pikaçu İmleci

Kodu:

<style> body, a, a:hover { cursor:url('http://www.totallylayouts.com/cursors/cartoon/pikachu_pokemon.png'), auto }</style>

6- Angry Bird Yeşil Domuz

<style> body, a, a:hover { cursor:url('http://www.totallylayouts.com/cursors/cartoon/angry_birds_pig.png'), auto }</style>

Ayrıca resmini paylaşmadığım şu çok kullanılan üçgen imleç için;

KOD:

<style> html, body, a, a:hover { cursor:url('http://www.snazzyspace.com/cursorsfolder/3d-triangle.png'), auto !important; }</style>

Sonsuz İşareti Olan İmleç

KOD:

<style> html, body, a, a:hover { cursor:url('http://www.snazzyspace.com/cursorsfolder/infinite.png'), auto !important; }</style>

    

Not: Kodların içindeki reklamları sildim, hepsini kontrol etmedim çalışmayan varsa belirtirseniz düzeltirim.

Şimdi kendi imlecinizi kendiniz nasıl yapacaksınız onu anlatayım.

Öncelikle Photoshop şart 

Eğer yok ise CS2 versiyonu artık bedava her sitede bulabilirsiniz 200-300mb bişeydi.

Photoshop'u açıp ardından yeni sayfa açıyoruz(CTRL+N) 

Bu sayfa 40x40 olacak şekilde, gerçi çok farketmez sizin imleciniz büyük olucaksa daha büyük yapabilirsiniz.

Sonrasında çizebiliyorsanız kendiniz çizersiniz şekil falan eklersiniz, veya istediniz bişeyin resmini koyabilirsiniz, resim koyması daha zor olacağı için ben resim koyucam.

Bir Game Of Thrones sever olarak ben bu resmi koyucam

Şimdi resim koyarken şöyle bir olay var;

koyduğunuz resim eğer PNG değil ise, yani PNG denilen olay resmin arka planının olmaması. 

Eğer PNG değilse üstte göründüğü gibi mouse kare şekilde görülecektir.

Şöyle anlatayım;

 

ÖZET OLARAK: Resminizi aratırken sonuna PNG diye ekleyin aksi takdirde resmi kesmeniz gerekecektir.

Anlatıma Devam

40x40 açtık resmimizi PNG olarak indirdik ve ardında resmi photoshop'a sürükleyip o küçük kareye sığacak şekilde sağından solundan küçültüyoruz.

Tavsiye: Shift'e basılı tutup resmin köşesinden küçültür iseniz resminiz daha az bozulacaktır.

Şu şekilde görünüyor şuan 

Bu şekildeyseniz. tek yapmanız gereken şu sağdaki arkaplan katmanını'nın yanındaki gözü kapatmak.

Tavsiye: tıklama bölümü resmin sol üst köşesidir. isterseniz oraya küçük bir üçgen yapabilirsiniz;

şöyle;

Burdan sonra ise kaydediyoruz;

Ctrl + Shift + S 

PNG'yi seçerek kaydediyoruz.

Resim kayıt işlemi bittikten sonra ise;

http://postimage.org

Adresine gidiyoruz ve resmimizi oraya yüklüyoruz.

Resim yüklendikten sonra altta kod olarak bize sunacaktır.

Biz 2. sıradakini alıcaz yani Doğrudan Bağlantı olanı.

O orda durakoysun 

Şimdi oradan alıcağınız linki aşağıdaki koddaki KIRMIZI YER'i silerek oraya yapıştıracaksınız, not defterinde yapın isterseniz

<style> body, a, a:hover { cursor:url('KIRMIZI YER'), auto }</style>

Yaptıktan sonra şöyle bişey olacak

<style> body, a, a:hover { cursor:url('http://s7.postimg.org/5r3k5gsmf/icon.png'), auto }</style>

Sonrasında ise bu kodu alıp Tumblr'ımıza atıyoruz.

Bi daha paylaşayım.

 Tumblr HTML Düzenle Bölümüne Kod Nasıl Eklenir?

Sonuç: 

http://gurkansen.com