Blogger'da Logo veya Blog Başlıklarınıza Efekt Ekleme Eklentisi
Belki de fark edeniniz vardır. Logonun (biliyorum çok dandik) üzerine geldiğinizde şekil şukul bir eklenti beliriyor. İşte ben de bu eklentiden bahsedeceğim, beğenen varsa da kendi blogunda kullanır. Hemen belirteyim, çok fazla uğraş gerektirecek bir şey de değil. Aşağıda bulunan birkaç satır kodu gerekli yere yapıştırın ve kullanın. Lafı çok fazla uzatmadan yapmanız gerekenlere geçeyim ben.
- Blogger Kontrol Paneli'nde sol tarafta bulunan Şablon > HTML'yi düzenle seçeneklerine tıklayın.
- Kodların bulunduğu alana bir kez tıklayıp CTRL+F tuşlarına tıklayın.
- Gelen arama kısmına ]]></b:skin> yazıp Enter'a tıklayın ve ]]></b:skin> kodunun bir üst satırına aşağıda görmüş olduğunuz kodu yapıştırın.
[#header h1 a:hover{/*animation*/-webkit-animation:jelly .5s; -moz-animation:jelly .5s; -ms-animation:jelly .5s; -o-animation:jelly .5s; animation:jelly .5s;}#header img:hover{/*animation*/-webkit-animation:jelly .5s; -moz-animation:jelly .5s; -ms-animation:jelly .5s; -o-animation:jelly .5s; animation:jelly .5s;}@-webkit-keyframes jelly{from,to{-webkit-transform:scale(1, 1);transform:scale(1, 1)}25%{-webkit-transform:scale(.9, 1.1);transform:scale(.9, 1.1)}50%{-webkit-transform:scale(1.1, .9);transform:scale(1.1, .9)}75%{-webkit-transform:scale(.95, 1.05);transform:scale(.95, 1.05)}}@keyframes jelly{from,to{-webkit-transform:scale(1, 1);transform:scale(1, 1)}25%{-webkit-transform:scale(.9, 1.1);transform:scale(.9, 1.1)}50%{-webkit-transform:scale(1.1, .9);transform:scale(1.1, .9)}75%{-webkit-transform:scale(.95, 1.05);transform:scale(.95, 1.05)} }]
Son Sözler
Yapacaklarınız bu kadardı. Artık blog başlıklarınızın veya logolarınızın mouse ile üzerine gelindiğinde hoş bir animasyon belirecektir. Animasyonun nasıl olduğunu öğrenmek için benim logomun üzerine gelmeniz yeterlidir. Umarım bu küçük eklentiyi sizler de beğenmişsinizdir. Az daha unutuyordum, blog başlıklarınızdan kastım H1 yani blogunuzun adının olduğu başlıktır. Fikirlerinizi yorum olarak belirtebilirsiniz ya da beğendiyseniz aşağıdaki butonlara tıklayarak paylaşabilirsiniz.
Yapamadım yaaaa.Üst tarafta kargacık burgacık yazılar çıktı :(
YanıtlaSilSorununuzu bir ekran görüntüsü ile mail olarak gönderin, yardımcı olmaya çalışırım.
SilGüzel yazin için Teşekürler kardesim .bir blogun varsa Blogger konuları aslında hiçte hafife alinmayacak kadar degerli tabiki anlayana ve anlamak isteyene . Ellerine sağlık.
YanıtlaSilRica ederim, asıl ben yorumunuz için teşekkür ederim. Elimden geldiğince kaliteli eklenti bulup paylaşmaya devam edeceğim.
SilKeşke her blog böyle yararlı olsa. Emeğinize sağlık.
YanıtlaSilYorum için teşekkürler, her blogun amacı farklı olduğundan faydaları da kişiden kişiye değişecektir.
SilHocam ben ekledim ama hiçbir şey olmadı . Yardımcı olurmusunuz
YanıtlaSilKodları doğru bir şekilde kopyalayıp, doğru yere yapıştırdığınızdan emin misiniz? Yoksa siz bana "İletişim" kısmından mail gönderin, daha iyi yardımcı olurum.
SilÜstad kodları ekledim ancak herhangi bir değişilik olmadı yardımcı olabilir misiniz?Bana tşkr ler iyi çalışmalar.
YanıtlaSilTest ettim, düzgün bir şekilde çalışıyor. #header kısmını .header olarak değiştirip deneyibilir misiniz bir de?
SilMerhaba Semih bey peki logonuzu yaparken hangi programı kullandınız onu açıklayabilir misiniz?
YanıtlaSil"Canva" adlı web sitesinden yaptım. Blogumda site ile ilgili yazım var, bakabilirsiniz.
Silhttps://i.hizliresim.com/JDvaDW.jpg
YanıtlaSilResim linkini gönderdim üstad.
Üstad bir sorum daha olacak bazı yazıların alt rengi beyaz bazıları da gri bunu nasıl yapabiliriz bizde?
YanıtlaSilhttps://i.hizliresim.com/nlZnJ5.jpg
YanıtlaSilTema düzenleme eklentisinde "Post Background White" benzeri bir seçenek olması lazım. Seçeneği aktifleştirip kaydedin.
SilMerhaba üstad cevabın için tşkr ederim ancak bahsetmiş olduğun kodu temam da ben bulamadım.Başka bir alternatif var mı?
YanıtlaSilHangi kodu bulamadınız?
Silmerhaba kardeşim acaba en üstte yazılı semih Keçecioğlu kişisel blog başlığını nasıl yaptınız yardımcı olabilir misiniz?
YanıtlaSilMerhaba, Canva adlı online editör ile yaptım.
Silmerhaba kodları yazdım ama logommda degısen bırsety olmadı hocam
YanıtlaSil