Blogger yazar yorumu

Blogger Yazar Yorumuna icon Ekleme

Bloglarda blog yazarlarının yorumlara verdiği yanıtı diğer yorumlardan ayırd etmek ve daha çekici bir yorum görünümü sağlamak için kullandığı icon veya yazar yorumu gibi isimden sonra kullanılan eklentilerin, iki şekilde bllogger sitenize eklemenizi göstericem. Bu şekilde bir eklenti ile her giren ziyaretçi, yorumlardaki dikkat çekici yazar yorumunu görebilecek. Yaptığınız yorumlarla ziyaretçilerin dikkatini çekecek, yorum formunu sade halinden daha çekici bir görünüm sağlayacak.
Örnek olarak yaptığım yorumlara bakabilirsiniz. Blog panelinden tema > html'yi düzenle dedikten sonra sizin için belirlenmiş profil ID'nizi bulun, yaptığınız yorumlardaki kullanıcı adınıza tıklayarak bulabilirsiniz, sayfanızın url linki kısmını. HTML editöründen CTRL-F yardımı ile 'b:skin' yani CSS kodlarımızın bulunduğu kısmı aratıp en alt kısmına aşağıda verdiğim CSS kodunu kopyalayıp yapıştırın.
a[href="https://www.blogger.com/profile/09582703341938352010"]:after { padding: 2px; border-radius: 5px; margin-left: 10px; background: #21759b; border: 1px solid #1f6f93; content: "yazar"; font-weight: bold; font: normal normal normal 18px/1 FontAwesome; font-size: 10pt; color: #f5f5f5; }
Buradaki turuncu renk ile belirlediğim kısma kendi profil linkinizi yazın. Tanımlarda kullandığım content:"yazar"; kısmını dilediğiniz gibi değiştirip temanızda yaptığınız yorum için kullanabilirsiniz. Siz bunun yerine gif veya icon kullanmak istiyorsanız turuncu renk ile belirlediğim kısmı silip onun yerine background: url(icon url'si) no-repeat right; yazarak, yazar yorumlarından sonra icon kullanabilirsiniz. Ayrıca background tanımından ilkinide silmeniz gerekir.

Yorumlar

Yorum Gönder

Bu blogdaki popüler yayınlar

Google bağlantı yolu arama motoru

Resim
Bazı sitelerde fark ettiyseniz arama sonuçlarında, yanyana bağlantılardan önce bir arama motoru daha çıkar. Bu arama motoru aynı domain için birden çok çıkan bağlantı arasında google içi arama yapmayı sağlayıp daha kolay bulabilmemiz için oluşturulan google site bağlantıları arama motorudur. Bu arama motoru tek bir domain bağlantısı üzerinden değil, aranan kelime üzerinden çıkan sonuçlara göre öne çıkan site için oluşturulur. Örnek bir görüntü aşağı kısımda verilmiştir. Blogspot içinde kullanıla bilen bu özellik küçük bir java kodunu blogspot.com sitenize ekleyerek oluştura bilirsiniz. Bağlantı Yolu Arama Motoru Bloggere Ekleme Blogspot sitenize giriş yaptıktan sonra sırasıyla Tema > html düzenle > deyip altbilgi veya üst bilgi kısımlarından birine ekleyebilirsiniz, veya CTRL-F yardımı ile  aratarak en üst ile en alt kısımlarda çıkan sonuclardan hemen sonrasına ekleyebilirsiniz. < Script type = "application / json ld +">{ "@context": "ht
Devamı

Blogger için css buton oluşturma

Resim
Blogger buton eklentisi oluşturma Bloglar için kullanılan butonları, kolaylık olsun diye css tanımlarıyla birleştirip demo ve download gibi butonlar ortaya çıkarıcaz. CSS tanımlarıyla oluşturduğumuz bu  çok amaçlı butonlar renk ve hover özelliğini alt kısımda verdiğim renkli kod yerleşkesinde renk kodunu belirleyerek rengini değiştirebilirsiniz. İlk olarak div ismi belirleyelim, div ismini bloga ve blogb veriyorum. <div class="bloga"><a href="http://demo">Demo</a></div> <div class="blogb"><a href="http://download">Download </a> <div> Bunlar sadece link verilmiş divlerimiz şimdi bunları tanımlayan CSS kodlarına geçicez, her biri için farklı css kodları hazırlayalım. İlk olarak 'bloga' buton için tanım belirleyelim renk, kenarlık, alan açısı, yazı büyüklüğü, arka plan gibi tanımlar kullanıcaz. CSS buton bloga için: .bloga a{margin-right: 5px; a display: inline-block; height: 30
Devamı

Kod editörü araçlarini özelleştirme

Resim
Makale editörü - seçenekleri özelleştirme Araç editöründen yararlanmayı bilenler için makale, konu yazmak ve sayfa düzeninde fark yaratmak çeşitli özelliştirmeler yaparak mümkün. Kullandığımız platformların bize sunduğu genellikle üst veya sağ kısımda bulunan bu araçlar CSS tanımlarıyla sayfamıza uygun renk ve biçim vererek makale, konularda kısa yazı ve kod paylaşımında kolaylıklar sağlayacak şekilde düzenleyebiliriz. Genellikle kullanacağımız araçlar div, pre, code, blockquote gibi makale araç çubuğunda bulunan seçenekler için CSS kodlarını paylaşıcam. Bu araçları daha önce kullanmayan arkadaşlar için açıklama yapmama gerek yok, deneyerek nasıl kullanıldığını öğrenebilirsiniz. Bu araçlar için kendim oluşturduğum ve kullandığım özelleştirme kodlarını paylaşıcam . Div kullanımı ve kodlama(özelleştirme) Div'e özellik vermek için CSS tanımlarını div ile birleşik veya CSS kısmına yazabilirsiniz. Bunun için style tagı arasında css tanımı kullanılır. Comi adını verdiğim div'
Devamı