Bir sorunuz var mı?

AMP yazı içi ve otomatik reklamlar (Adsense)

Google mobil sayfaların daha hızlı sonuç vermesi adına AMP destekli sayfalara öncelik tanımaya başladı. Sistemi detaylı bir şekilde anlatmak isterdim fakat o derece bilgiye sahip değilim. Aslında mobil sayfaların daha hızlı sonuç vermesi ve Google’nin bunu desteklediğini bilmeniz yeterli.

Duyuru: (31.07.2018)

Artık bunca zahmete girmeye gerek yok. Google Adsense Otomatik Reklamlar seçeneği ile basitçe konu içi reklam gösterimi yapabilirsiniz.

Üstelik yazınızın uzunluğuna göre gerekli miktarda en uygun yerlere en uygun boyutlarda reklam gösterimi yapıyor.

wp-content/plugins/amp/templates/html-start.php dosyanızı açın ve etiketinin tam üstüne aşağıdaki köprüyü ekleyin.

<script async custom-element="amp-auto-ads" 
src="https://cdn.ampproject.org/v0/amp-auto-ads-0.1.js"></script>

Son olarak wp-content/plugins/amp/templates/single.php dosyanızı açın ve etiketinin hemen altına aşağıdaki komutu ekleyin. ca- ile başlayan kısma kendi Adsense ID’nizi girerek kaydedin.

<amp-auto-ads type="adsense"
data-ad-client="ca-pub-123456">
</amp-auto-ads>

Yazının bundan sonraki kısmı eski bilgilerden oluşmaktadır fakat yine de tercih ederseniz uygulayabilirsiniz.

Duyuru: (04.05.2018)

Arkadaşlar, WordPress AMP eklentisine son gelen güncelleme nedeniyle işlem biraz değişti. head etiketini bulup üstüne ekle dediğim bütün kodları single.php dosyasına değil, html-start dosyasına eklemeniz gerekiyor.

AMP kurulumu

WordPress’in orijinal uygulaması olan WordPress AMP uygulamasını sitemize yüklüyoruz. Yükledikten sonra yapmamız gereken tek şey etkinleştirmektir. Bu kadar basit! Artık sitenizde AMP destekli mobil sayfalar bulunuyor. Ayrıca bilmenizi isterim ki Google WordPress için bağlantıda verdiğim eklentiyi önermektedir.

Test etmek için sitenizde bulunan bir konu linkinin sonuna /amp ekleyin.

AMP sayfanıza Adsense reklamları ekleyin

Yazının üstüne ve sonuna eklemek için;

Bu işlemi tamamen Google yönergelerine uygun bir şekilde gerçekleştireceğiz. AMP reklam birimi oluşturma sayfasındaki yönergeleri kaynak olarak kullandım.

Yazının üstüne ve sonuna reklam eklemek

WordPress AMP eklentisini kurduktan sonra eklentiler sayfasından düzenle sayfasına girin.

Sağ tarafta bulunan amp/templates/single.php sayfasını açın.

Bul:

</head>

Hemen üstüne ekle:

<script async custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>

Sayfanın en üstüne reklam eklemek için bulun:

<div class="amp-wp-article-content">

Hemen altına ekleyin:

<amp-ad 
height=100
type="adsense"
data-ad-client="ca-pub-1234567890"
data-ad-slot="1234567890">
</amp-ad>

Sayfanın en altına reklam eklemek için bulun:

<?php echo $this->get( 'post_amp_content' ); // amphtml content; no kses ?>

Hemen altına ekleyin:

<amp-ad 
height=250
width=300
type="adsense"
data-ad-client="ca-pub-1234567890"
data-ad-slot="1234567890">
</amp-ad>

Şimdi Adsense esnek (duyarlı) reklam kodunuzdaki kırmızı alanları güncelleyin. Bu işlemi yapmadan sonuç alamazsınız.

Sayfanın altına ve üstüne reklam eklemiş olduk. Reklamların AMP sayfalara yansıması zaman alabilir. Olmadığını düşünmeyin, biraz bekleyin ve sayfayı yenileyin.

İki reklam koduda farklı özellikler taşımaktadır. Google yönergelerine uygun olması için aynı şekilde uygulayın lütfen. Ayrıca özelleştirme yapmak isterseniz AMP reklam kodları sayfasından yararlanabilirsiniz.

Yazı içine ve ortasına reklam ekleyin

Asıl konumuza geldik. Bildiğiniz gibi bir sayfada üç Adsense reklam yayını yapabiliyorsunuz. Sayfanın başına ve sonuna ekledik. Şimdi en çok verim alınan yazı içerisine Adsense reklamınızı yerleştireceğiz. Bu işlem için Isabel’e teşekkür ediyorum. Bağlantıdan detaylara ulaşabilirsiniz.

Temanızın function.php sayfasını açın. Uygun yere Isabel‘in yazdığı aşağıdaki kodu ekleyin.

add_action( 'pre_amp_render_post', 'isa_amp_add_content_filter_within' );

function isa_amp_add_content_filter_within() {
add_filter( 'the_content', 'isa_amp_adsense_within_content' );}

function isa_amp_adsense_within_content( $content ) {
$publisher_id = 'ca-pub-1234567890';
$ad_slot = '1234567890';

// Below the fold ad code. This is responsive as per Google guidelines for Adsense for AMP.
$btf_ad_code = '<amp-ad layout="fixed-height" height="250" type="adsense" data-ad-client="' . $publisher_id . '" data-ad-slot="' . $ad_slot . '"></amp-ad>';

// Insert Adsense ad between the content, after paragraph 2
$new_content = isa_insert_after_paragraph( $btf_ad_code, 6, $content );
return $new_content;}

function isa_insert_after_paragraph( $insertion, $paragraph_id, $content ) {
$closing_p = '</p>';
$paragraphs = explode( $closing_p, $content );

foreach ($paragraphs as $index => $paragraph) {
if ( trim( $paragraph ) ) {
$paragraphs[$index] .= $closing_p;}

if ( $paragraph_id == $index + 1 ) {
$paragraphs[$index] .= $insertion;}}
return implode( '', $paragraphs );}

Yine aynı şekilde kırmızı alanları Adsense esnek reklam kodunuzdaki verilerle güncelleyin. Yine kırmızı olan altı rakamıyla reklamın kaçıncı paragrafta olacağını belirleyebilirsiniz.

Örnek kodda reklam yüksekliğini sabit 250px yaptım. Yazı ortasındaki reklam biraz daha büyük olsun istedim. Siz istediğiniz gibi düzenleyebilirsiniz.

AMP sayfalarınızın sağlıklı olup olmadığını sorgulayın: AMP sayfalarınızı test edin

Google Search Console panelinde Arama Görünümü > Hızlandırılmış Mobil Sayfalar ekranında AMP sayfalarımız için uyarıları veya yönlendirmelerini takip edebiliriz.

Son olarak AMP sayfaları Google’a bildiren bir komut ekleyeceğiz. AMP olmayan sayfalarınızın head tagları içerisine aşağıdaki kodu ekleyin.

<link rel="amphtml" href="<?php the_permalink(); ?>/amp" />

Aynı şekilde AMP olan sayfanıza (eklentiler, AMP eklentiyi düzenle, Single.php) aşağıdaki kodu ekleyin.

<link rel="canonical" href="<?php the_permalink(); ?>" />

Bu şekilde AMP olmayan standart sayfanızda Google’a bu sayfanın AMP sürümü var demiş oluyorsunuz. Aynısı AMP sayfaları için de geçerli.

Sabit AMP reklamları

Reklamları sayfa altına sabitlemek için amp-sticky-ad özelliğini kullanabiliriz. Mobil gösterimlerde oldukça etkili bir tercihtir. Sabitleme işlemi oldukça basit bir işlem. Daha önce AMP sayfamıza eklediğimiz reklamlardan birini sayfaya sabitlemek için aşağıdaki adımları uygulayınız.

Bu:

</head>

Üstüne ekle:

<script async custom-element="amp-sticky-ad" src="https://cdn.ampproject.org/v0/amp-sticky-ad-1.0.js"></script>

Bul: (alt reklam eklediğimiz için, istediğiniz yere ekleyebilirsiniz.)

<amp-ad height=100
type="adsense"
data-ad-client="ca-pub-123456789"
data-ad-slot="123456789">
</amp-ad>

Değiştir:

<amp-sticky-ad layout="nodisplay">
<amp-ad width="320"
height="100"
type="adsense"
data-ad-client="ca-pub-0540780362853405"
data-ad-slot="4500779460">
</amp-ad>
</amp-sticky-ad>

Bu şekilde mobil sayfalarımızda AMP sabit reklam yayını yapmış olduk. İşlemi uyguladıktan sonra hemen test edemeyebilirsiniz. Değişikliğin yansımazı biraz zaman alabilir.

WordPress AMP Google Analytics Eklemek için html-start dosyasına aşağıdaki kodu ekleyin.

<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>

Son olarak aşağıdaki kodu temanızın fonction sayfasının uygun bir yerine yapıştırıp UA-xxxx alanını revize etmeniz yeterlidir.

/*Add amp-analytics to the amp post template footer*/
function isa_amp_analytics( $amp_template ) {
    ?><amp-analytics type="googleanalytics">
    <script type="application/json">
    {
      "vars": {
        "account": "UA-xxxxx-x"
      },
      "triggers": {
        "trackPageview": {
          "on": "visible",
          "request": "pageview"
        }
      }
    }
    </script>
    </amp-analytics><?php
}
add_action( 'amp_post_template_footer', 'isa_amp_analytics' );

Bol kazançlar.

Anasayfa » WordPress » AMP yazı içi ve otomatik reklamlar (Adsense)

“AMP yazı içi ve otomatik reklamlar (Adsense)” üzerine 146 yorum

  1. Merhabalar,
    Siz kendi siteniz için hangi eklentiyi kullanıyorsunuz ayarlarını nasıl yaptınız acaba?
    Sizin sitenizde birkaç paragraftan sonra reklam gösteriyor tam ortasında 1 tane göstermiyor. Bunun için ne yapmak gerekiyor?

    Cevapla
    • Sadece Adsense otomatik reklam kodunu kullanmanız yeterlidir. Yazıda bulunan 04.05.2018 tarihli güncellemeyi uygulayın lütfen.

      Cevapla
  2. Hocam merhaba ben amp otomatik kodunu head ile head etiketinin arasına ekledim..şimdi siz head etiketinin hemen üstüne dediniz…bir örnekle nasıl yapılacağını yazar mısıniz..reklamlar çıkmadı bende..

    Cevapla
    • Ne mail ne isim girmişsin. Şimdi cevap yazsam görüp görmeyeceğini bile bilmiyorum. Bu yüzden hiç uğraşmıyorum. Takipteyse yazarsın dönüş yaparım.

      Cevapla
  3. Hocam onca araştırmadan sonra “Aha bende bunu arıyordum” dediğim yazıyı yazdığınız için teşekkür ederim. Yalnız ben yazdığınız tüm işllemleri yapmış olmama rağmen başarılı olamadım. Bunun sebebi AMP eklentisinin ‘Paired’ modunu seçmiş olmamdan kaynaklanıyor olabilir mi?

    Cevapla
    • Hocam sorunun ne olduğunu bilmiyorum ama en son gelen güncellemede değişiklikler olmuş olabilir. Henüz güncelleme yapmadığım için kesin konuşamıyorum. Yakın zamanda güncelleme yapacağım. Eğer güncellemede değişiklik yoksa sizde başka bir sorun vardır inceler çözeriz. Güncellemede reklamları etkileyen bir değişiklik varsa konuyu revize eder size bilgi veririm.

      Cevapla
  4. Çok teşekkür ederim hocam. orjinal tema ara yüzü gibi yapmışlar dediğim modda. Çok iyi olmuş ama reklamlarda sıkıntı oluşturuyor. Takipteyiz hocam. 🙂

    Cevapla
  5. Dediklerinin hepsini yaptım. Amp sayfasında reklam çıkıyor. Ancak şu dikkatimi çekti Google sonucunda çıkan amp sayfaya tıklıyorum mobilden adres kısmındaki URL Google ile başlayıp amp ile biten bir URL oluyor. Ve böyle olunca da reklam görülmüyor.

    Cevapla
    • Bir güncelleme gelmiş ve ben hala güncelleme işlemimi yapacak fırsat bulamadım. Bu sorunun nedeni bütük ihtimalle yaptıkları yeniliktir. Yakın zamanda yeni uygulamayla konuyu revize edeceğim.

      Cevapla
    • Hocam güncelleme yaptım ve aynı şekilde reklam gösterimini sağladım. Klasik versiyonda hiçbir sorun yok. Daha önce Yusuf Bey’in talebi olan Paired versiyonu için bir yöntemi yakın zamanda bulacağım.

      Cevapla
  6. Hocam detaylı anlatım için teşekkür ederim. Benim konuyla alakalı bir sorum olacaktı. Amp sayfalarında fav icon gözükmüyor ve amp sayfaları google test aracı ile aramada sorguladığımda logo kısımları boş gözüküyor. Ben amp eklenti sindeki tüm ayarları yaptım ama nedense düzelmedi.

    Cevapla
    • Merhaba Tamer Bey, tema menüsünden özelleştir sayfasına girip site kimliği kısmından belirtilen boyutlara uygun icon eklemeniz lazım.

      Cevapla
  7. Kerem bey mevcut tema üzerinde fav icon gözüküyor. Ben amp eklentisinin görünümünü düzenleyerek site kimliği kısmından tekrar söylenene boyutlarda resim eklemem rağmen başarılı olamadım. Yapısal test aracında @type nin altında bulunan url de logo olarak resmin adresi gözüküyor ama hala çözemedim.

    Cevapla
  8. Öne çıkan görsel ekliyorum. Genişlik en az 690 yükseklik 300 ile 400 arası değişen resimler ekliyorum. Resim boyutu büyük olunca öne çıkarılan görsel amp sayfasında gözükmüyor, ben gözüksün de istemiyorum. Bu seferde arama sonuçlarını önizle dediğimde öne çıkan görseller gözükmüyor. 500*300 eklediğim resimler gözüküyor. Fav icon gözükmüyor. Logo gözükmüyor. ep ey karıştı ortalık 🙂

    Cevapla
    • Tabi yardımcı olurum. Akşam 20:00 gibi müsait olursanız beni arayın lütfen. Numaramı mail yoluyla gönderiyorum.

      Cevapla
  9. Merhaba Kerem bey, öncelikle makale için teşekkürler.
    Amp için iki farklı eklenti denedim, birincisi https://wordpress.org/plugins/accelerated-mobile-pages/ adresinde göreceğiniz eklenti diğeri ise https://wordpress.org/plugins/amp olan eklenti.

    1. Eklentiyi kullanmaya başladığımda reklam kodlarımızı girdik fakat gösterim oranı çok düştü, reklamlar bazen görünüyor bazen görünmüyordu. %50 kadar düşüş yaşadık.
    2. Eklentiyi kurdum ve reklam kodlarını sizin burada anlattığınız şekilde amp uyumlu olacak kodlar ile (Kod bilgim var) ekledim.

    Yine reklamlarım arada görünüyor arada görünmüyor.
    Web sitemiz eski bir site ve yaklaşık 10 yıllık Adsense müşterisiyim.
    Gösterimlerimiz yüksek, gelirimiz de öyle. Makalelerimiz orjinal ve 350 kelime üstündeler.

    Bu konuda bize yardımcı olabilir misiniz?
    Danışmanlık isteyebiliriz, eğer öyle bir hizmetiniz varsa skype adresim ilhanoglakcioglu ve 0543 220 ** numaralı whatsapp hattımdan sizinle görüşmek isterim.

    Cevapla
    • AMP sayfalar kısa sürede index alıp sıralamaya girmiyor. Yavaş yavaş fakat daha iyi bir konumda ve kalıcı bir şekilde sıralama alırsınız. Yani AMP sayfaların her zaman daha iyi kazanç getireceğini emin bir şekilde söyleyebilirim. AMP sayfalara geçiş yapın ve bir kaç ay değiştirmeyin. Farkı göreceksiniz.

      Cevapla
  10. Adsense reklamları bazen görünüyor bazen görünmüyor ise,
    Aynı sorun benim sitemde de vardı baya araştırmam sonucunda adsense reklamları bazen gözüküyor bazen gözükmüyor sorununu çözdüm.
    Adsense hesabınıza giriş yapıp Reklam sekmesinde Reklam Dengesi seçeneğine giriyoruz. Burada mavi olan çizgiyi sağa çekip yüzde yüz yapıyoruz. 1 2 saat içerisinde reklamlar sorunsuz gösterilecektir. Bunu yapmadan önce Reklam Dengesi nedir araştırıp öyle uygulayınız.

    Cevapla
  11. Eline sağlık gerçekten çok teşekkür ederim. Hocam bide AMP sayfaları ile standart sayfaları nasıl birleştirebiliriz. Yani AMP sayfasına girildiğinde nasıl normal sayfanın görüntüleme sayısı artar. Yardımcı olursanız çok sevinirim şimdiden teşekkürler.

    Cevapla
    • Emirhan Bey, siteye özel bir çalışma yaptırmak gerekir. Bütün sitelere uygulanabilecek belli bir seçenek yok.

      Cevapla
  12. Yazı için teşekkürler. Ancak her eklenti güncellemesinde sanıyorum ki bu eklemeler de gidecektir. Aslında Better AMP – WordPress Complete AMP adlı bir eklenti var. Bu eklenti ile daha fazla özellik ve kişiselleştirme yapılabiliyor. Reklam ekleme kısmı Google Analytic kısmı da mevcut.

    Cevapla
    • Merhaba, evet doğrudur. Öneriniz için çok teşekkür ederim. Eğer eklenti kullanmadan ve güncellemelerden etkilenmeyecek şekilde yazı içi reklam eklemek isterseniz aşağıdaki içerikten faydalanabilirsiniz. (AMP tema modu standartsa eğer)

      Cevapla
  13. merhaba bu eklentide olan bir özellik var otomatik reklamlar için bende otomatik reklam kodlarını ekliyorum ama benim şöyle bir sorunum var siteadı.com/amp yada sitead.com/antalya/amp uzantısına masa üstü bilgisayardan yazıp girince ads otomatik reklamlar çıkıyor ama aynı uzantıyı mobil bir telefondan girdiğinde hiçbir şekilde reklamlar gözükmüyor sorun neyden kaynaklanıyor olabilir?

    Cevapla
      • 24 saatten fazla oldu yukarı dada belirttiğim gibi an yüklemeden bakmıyorum ve masaüstü pc bakınca örnek siteadı.com/amp reklamlar gözükmekte ama aynı adresi telefondan girince reklamlar gözükmüyor

        Cevapla
        • Site adresinizi, kullandığınız eklenti isimlerini ve otomatik reklam kodunu mail yoluyla gönderir misiniz?

          Cevapla
  14. Merhaba sonunda hatayı buldum gibi ama çözümünü bulamıyorum 🙂

    [amp-auto-ads] No anchor element found

    Cevapla
  15. Merhaba,

    Bu yazı güncel mi? Çünkü dediklerinizi uyguladım, ancak google reklamları amp sayfasında görünmüyor.

    Cevapla
    • Merhaba,

      Adsense ana sayfası > Reklamlar > AMP Açık butonu (sağda ortalarda) tıklarsanız sitenize eklemeniz için iki kod verecek. Header tagları içerisine ekleyip 1 saat gibi beklemeniz gerekiyor. İşe yaramazsa AMP sayfalarınızda bir sorun olabilir. Sitenizi inceleyerek çözüme gitmeye çalışırız.

      Cevapla
  16. Tekrar merhaba,
    Dediğiniz gibi yaptım.

    1. kod olan
    kodunu wp-content/plugins/amp/templates/html-start.php dosyanızı açıp etiketinden hemen öncesine ekledim.

    Ardından;
    2. kod olan
    kodunu ise wp-content/plugins/amp/templates/single.php dosyanızı açıp etiketinin hemen öncesine ekledim. Ve 1 saaten de fazla bir süre oldu. Sanırım bu işlemde bir hata yoktur.

    Cevapla

Yorum yapın