Blogger'da eklentilerin arka planını nasıl değiştiririz?

16 Temmuz, 2017
Blogger'da eklentilerin arka planını nasıl değiştiririz?
Blogger'da eklentilerin arka planını nasıl değiştiririz?
Blogger (blogspot) bloglarında dilediğimiz eklentilerin arka planını nasıl değiştiririz? Eklentilerin (widget) arka planına nasıl görsel ekleriz?

Bu yazımda yine basitçe yapılabilecek olan bir konudan bahsetmek istedim, eklentilerin arka planını değiştirme.

İnternet dünyasında paylaşılan onlarca eklenti mevcut, bu eklentilerden dilediğinizi blogunuza eklemek oldukça kolay. Ama bu eklentilerin çoğu blogunuzun rengiyle, tasarımıyla uyum sağlayamayabilir. İşte bu bahsettiğim yöntem ile dilediğiniz eklentinin arka plan rengini değiştirebilir hatta arka plana resim, gif ekleyebilirsiniz. Peki nasıl?

Daha önce "Blogger temalarında ufak tefek değişiklikler nasıl yapılır?" başlıklı yazımda az çok bu yöntemden bahsetmiştim. Şimdi yine aynı yöntem ile eklentilerin arka plan rengini değiştirebileceğiz ve hatta görsel bile ekleyeceğiz. Tabi bu sadece eklentilerle sınırlı kalmayacak. Header, menü bar, footer kısmı yani dilediğiniz kısımlarda değişiklikler yapabilirsiniz.

İlk olarak Blog Tecrübem'in menü barında değişiklik yapalım:


Menü bar arka plan rengi değiştirme
Menü bar, eklentiler hiç fark etmez dilediğimiz alan için sağ tıklıyoruz ve açılan seçeneklerden "İncele" seçeneğini tercih ediyoruz. Daha sonra yukarıdaki görselde ki gibi sol tarafta kodların olduğu kısım açılıyor. Bu kodlar arasında menünün rengi ile karşılaşana kadar kodları karıştırıyoruz. Daha sonra:

bu şekilde bir kod serisine ulaşıyoruz. İşte burada dilediğimiz değişikliği yapıp, sonucu görebiliyoruz.

Bilmemiz gereken teknik bilgi şu:

background: yazısının ardından sadece
#e06666
renk kodu ile arka planın rengini belirlemiş oluyoruz. Ama
url(görselim linki)
şeklinde kod eklersek arka plana görsel eklemiş oluyoruz. Örneğin görsel ekleyelim:
Menü bar arka plan görsel ekleme
Gördüğünüz gibi background kodunun hemen yanına:
url(görsel linki)
şeklinde bir ekleme ile menü barın arka planına renkli görsel ekledim. Aynı şekilde:
#111111
şeklinde renk kodu ekleseydim menü barın arka planı sadece renkli olacaktı.

Şimdi gelelim asıl konuya, bu kodu Blogger'a nasıl ekleyeceğiz?


Google Chrome'un bu basit özelliği ile eklentimizin arka planını seçtik renk ya da görsel fark etmez. Hatta bu arka planın nasıl göründüğünü de kontrol ettik. Şimdi gelelim bunu Blogger'ın asıl kodlarının içine yerleştirmeye.

İlk olarak Blogger kullanıcı panelinde sol tarafta yer alan Tema seçeneğine ardından HTML düzenle seçeneğine ulaşıyoruz. Ardından tüm kodların yer aldığı sayfaya ulaşıyoruz. Burada Ctrl F yardımıyla değişiklik yapacağımız koda ulaşmamız gerekir. Peki nasıl?
Kod bulma
Chrome'da kod denemesi yaptığımız alanda bizim değişiklik yapacağımız kod yazılıdır. Yani kodların arasından Ctrl F yardımıyla görselde gösterdiğim kodu aramamız gerekir.
Background kodu düzenleme
Yukarıda yer alan görselde gördüğünüz gibi kodumu buldum ve hemen altında background koduna ulaştım. İşte buraya Chrome'da denediğimiz kodu ekleyebiliriz.

Daha sonra yaptığımız değişiklikleri kaydedip blogumuzu kontrol edebiliriz. Tüm yapılması gerekenler bunlardı.

Bu şekilde dilediğiniz tasarımsal değişikliği yapmak mümkün. Daha sonraki yazılarımda farklı kısımları nasıl değiştirebilceğimizden de bahsedeceğim. Konuyla ilgili sorularınız olursa yorum yaparak bana bildirebilirsiniz.

6 yorum:

  1. Mutlaka ki bir ekletide lazım olur. Teşekkürler hocam

    YanıtlaSil
    Yanıtlar
    1. Bu yorum yazar tarafından silindi.

      Sil
    2. http://blogtecrubem.blogspot.com/2016/12/blogger-icin-email-ile-abone-ol-eklentisi.html Bundan bahsediyorsunuz sanırım?

      Sil
  2. Bilmeyenler için gerçekten güzel ve açıklayıcı bir yazı olmuş hocam,iyi çalışmalar bu arada sürekli takipteyim. En yakın zamanda misafir olarak içerik yazmak istiyorum blogunuzda.

    YanıtlaSil
    Yanıtlar
    1. Çok teşekkür ederim. Tabi, dilediğiniz zaman yazabilirsiniz.

      Sil
  3. Güzel ve açıklayıcı bilgi olmuş..

    YanıtlaSil

Yorum yaparken:
1. İçerik konusuyla alakalı olmasına özen gösterin.
2. Yazım ve dil bilgisi kurallarına uymayı ihmal etmeyin.
3. Konu ile ilgili olmayan sorularınız için ise Blogger Yardım veya İletişim sayfalarını kullanın.

Copyright © 2016 - 2024 Blog Tecrübem. All rights reserved. Powered by Dijidal.com and Blogger. I Google
Sitede yer alan tüm içerikler Blog Tecrübem'e aittir, kullanım koşulları çerçevesinde alıntı yapılabilir.