Blogger Yayın İçerisine Otomatik Reklam Kodu Ekleme

Eylül 05, 2020
Görüntüleme

( Kelime)


Arkadaşlar herkese selamlar. Bugün sizlere Blogger yayınları içerisine Google Adsense reklam alanları otomatik olarak nasıl eklenir ondan bahsedeceğim. Bu eklenti görsel olarak daha düzenli ve Blogger kodlamasına oldukça uyumludur.

Önceki Google Adsense reklam alanlarını <data:post.id/> tagını kullanarak ekliyorduk fakat bu kodlama sistemi sayfalarda onlarca "ID" oluşturduğundan arama motorları sayfa taraması sırasında bir çok hata ile karşılaşıyorlardı. Bu paylaşacağım otomatik Google Adsense Reklam kodu size olduğu kadar Google a da kolaylık saylayacak. Bunun yanı sıra makale içerisindeki paragraftan sonra “2” Google Adsense reklam alanı otomatik olarak görünmesi sağlanacaktır.

Blog Yazılarına Otomatik Reklam Kodu Nasıl Eklenir?

Öncelikle Blogger kontrol paneline giriş yapıyoruz. Daha sonra Kalsik Bloggerda Tema > HTML'yi Düzenle adımını, Yeni Bloggerda ise Tema > > HTML'yi Düzenle adımını takip ederek Kod Editörünü açın. Kod Editörü içerinde aşağıda belirttiğim kodu bulun.

NOT : Kod Editörünü açtıktan sonra CTRL + F tuş kombinasyonu ile aşağıdaki kodun bir kısmını aratarak kolayca bulabilirsiniz. Bu koda benzer birden fazla kod bulunabilir, ancak veri konumlandırma etiketleri kullanacağımızdan dolayı problem değil.

Örnek HTML Kodu
<div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id'>
    <data:post.body />
</div>

Blogger Temanızın Kod Editörü kısmında bulduğunuz Örnek HTML Kodunun </div> kapanış etiketinden hemen sonra aşağıda yer alan kodu ekleyin.

Otomatik Reklam Kodu
<b:if cond='data:view.isPost'>
    <div class='inArticle inArticle1' id='inArticle1'>
        <!-- Ads reklam kodu alanı 1 -->
    </div>
    <div class='inArticle inArticle2' id='inArticle2'>
        <!-- Ads reklam kodu alanı 2 -->
    </div>
    <script type='text/javascript'>
        function insertAfter(tbh,tgt) {
            var prt = tgt.parentNode;
            if (prt.lastChild == tgt) {
                prt.appendChild(tbh);
            } else {
                prt.insertBefore(tbh,tgt.nextSibling);
            }
        }
        var tgt = document.getElementById(&quot;post-body-<data:post.id/>&quot;);
        var articleAds1 = document.getElementById(&quot;inArticle1&quot;);
        var articleAds2 = document.getElementById(&quot;inArticle2&quot;);
        var showAds1 = tgt.getElementsByTagName(&quot;br&quot;);
        var showAds2 = tgt.getElementsByTagName(&quot;p&gt;&quot;);
        if (showAds1.length &gt; 0) {
            insertAfter(articleAds1,showAds1[2]); <!-- Sıra sayı değeri -->
        }
        if (showAds2.length &gt; 0) {
            insertAfter(articleAds1,showAds2[2]); <!-- Sıra sayı değeri -->
        }
        if (showAds1.length &gt; 0) {
            insertAfter(articleAds2,showAds1[8]); <!-- Sıra sayı değeri -->
        }
        if (showAds2.length &gt; 0) {
            insertAfter(articleAds2,showAds2[8]); <!-- Sıra sayı değeri -->
        }
    </script>
</b:if>

Otomatik Reklam Kodu ile İlgili Bilgilendirme
  • <!-- Ads reklam kodu alanı 1 --> Birinci reklam kodu yerleştirme alanı
  • <!-- Ads reklam kodu alanı 2 --> İkinci reklam kodu yerleştirme alanı
  • <!-- Sıra sayı değeri --> Reklam alanlarının kaçıncı paragraftan sonra gözükmesini istiyorsanız yukarıdaki kodda belirtilen sıra sayı değerini ayarlayın.
NOT : Sıra sayı değerini artırdıkça reklam alanı o kadar azalır.

Son olarak eklemiş olduğunuz reklam alanlarının daha düzgün gözükmesi için Kod Editöründe </style> tagını CTRL + F tuş kombinasyonu ile aratın. Bulduğunuz </style> tagının bir satır üzerine aşağıdaki CSS Kodunu ekleyin.

CSS Kodu
.inArticle {
    margin: 0 auto 20px;
    display: block;
    overflow: hidden;
    width: 100%;
    height: auto;
    text-align: center
}

Yukarıda anlatmış olduğum adımları eksiksiz ve doğru bir biçimde Kod Editörünüze eksiksiz eklediğinizi düşünüyorsanız Klasik Bloggerda üst kısımda yer alan Temayı Kaydet butonuna, Yeni Bloggerda ise sağ üst kısımda yer alan  butonuna basarak Temayı kaydedin.

Blogger Yayın İçerisine Otomatik Reklam Kodu Ekleme ile ilgili bilgi ve görüşleriniz için yorum formunu kullanabilirsiniz.
Bu makale faydalı mı?

KATEGORİ İÇERİKLERİ


SONRAKİ YAYIN
ÖNCEKİ YAYIN
YORUMLARDA KOD KULLANMA
  • 1- Yorumlarda kalın karakter kullanmak için <code><strong>...</strong></code> veya <code><b>...</b></code>.
  • 2- Yorumlarda italik karakter kullanmak için <code><em>...</em></code> veya <code><i>...</i></code>.
  • 3- Yorumlarda altı çizili karakter kullanmak için <code><u>...</u></code>.
  • 4- Yorumlarda üzeri çizili karakter kullanmak için <code><strike>...</strike></code>.
  • 5- Yorumlarda HTML kod kullanmak için <code><code>...</code></code> veya <code><pre>...</pre></code> veya <code><pre><code>...</code></pre></code>, yorumlarda kod kullanmak için aşağıdaki kod dönüştürücü programını kullanın.

Blogger
Disqus
Yorum Ekle

Hiç yorum yok

Blogger Yayın İçerisine Otomatik Reklam Kodu Ekleme; Hakkında görüşlerinizi bizimle paylaşın. Teşekkürler.