Random post

Tuesday, January 2, 2018

√ Cara Memasang 2 Iklan Adsense Di Tengah Postingan Pada Template Amp

Memasang 2 Iklan Adsense di Tengah Postingan AMP » Selamat tiba di website sederhana lapaklama.com yang akan selalu menawarkan tips-yips ngeblog yang benar dan membagikan template-template blogger gratis. dan premium.


Pada kesempatan yang indah ini admin ingin membuatkan info Cara Memasang 2 Iklan Adsense di Tengah Postingan AMP Blogger.


AMP atau akronim dari Accelerated Mobile Pages atau yang gampang kita pahami Laman Seluller yang dipercepat. Adapun tujuan dibuatnya project AMP ini yakni untuk menciptakan halaman web yang gampang dimuat jikalau dibuka memakai perangkat seluler atau mobile ibarat android dan iphone.


Inti tujuan project AMP ini semoga orang-orang yang membuka laman atau situs akan mencicipi sensasi kecepatan jalan masuk tanpa harus mengeluarkan banyak kuota data internet mereka.


Namun ada sebagian orang yang mengeluhkan kalau memakai template AMP itu sanggup mengurangi pendapatan adsense mereka, Nah untuk semoga pendapatan adsense kita tetap stabil kita harus memasang beberapa slot iklan di halaman AMP kita. Salah satu daerah yang paling cocok untuk memasang iklan yakni di tengah postingan artikel.


Untuk kau pengguna template AMP blogger. silahkan gunakan panduan dibawah ini untuk Memasang 2 Iklan Adsense di Tengah Postingan AMP template blogger.


Atau jikalau kau belum memakai template AMP dan sedang mencari template AMP yang cocok untuk blog kamu, kami mempunyai 3 rekomendasi template AMP dibawah ini. Atau kau sanggup cari pada halaman Template kami.



Memasang 2 Iklan Adsense di Tengah Postingan AMP Template Blogger


Sebelum memakai panduan dibawah kau perlu memastikan kalau template blogger yang kau gunakan dan format postingan yang kau gunakan sudah valid AMP. Selamat tiba di website sederhana lapaklama √ Cara Memasang 2 Iklan Adsense di Tengah Postingan Pada Template AMP


Panduan 1:


Langkah pertama yang harus kau gunakan untuk melaksanakan cara ini ialah, Kamu harus mengubah halaman indexsi AMP terpisah dari link/Halaman canonical yang asli. dalam tahap ini kau harus memanfaatkan URL Mobile m+1 yang akan kita jadiakan sebagai syarat tampilan AMP dan hanya akan aktif pada perangkat mobile saja. adapun caranya sebagai berikut:



  1. Masuk Kedalam dasboard blogger kamu.

  2. Kemudian pilih sajian Template kemudian pilih Edit HTML.

  3. Cari arahan ibarat ini atau paling tidak ibarat dengan arahan ini. 
    Script
    <HTML amp=’amp’ expr:dir=’data:blog.languageDirection’ lang=’id’>

  4. Ganti arahan tersebut dengan arahan dibawah ini.
    Script
    <HTML expr:dir=’data:blog.languageDirection’ lang=’id’>

    <b:attr cond=’data:blog.isMobileRequest == &quot;true&quot;’ name=’amp’ value=’amp’/>

  5. Masih dihalaman Edit HTM. Cari meta tag berikut ini.
    Script
    <link expr:href=’data:blog.url’ rel=’canonical’/>

  6. Ganti arahan Meta Tag tersebut dengan arahan ini.
    Script
    <b:if cond=’data:blog.isMobileRequest == &quot;false&quot;’>

    <link expr:href=’data:blog.url’ rel=’canonical’/>

    <link expr:href=’data:blog.url + &quot;?m=1&quot;’ rel=’amphtml’/>

    </b:if>

    <b:if cond=’data:blog.isMobileRequest == &quot;true&quot;’>

    <link expr:href=’data:blog.url’ rel=’canonical’/>

    </b:if>

  7. Kemudian klik simpan Template/Save Template.


Sampai Tahap ini tampilan AMP hanya akan muncul pada URL mobile m+1 sudah selesai. dan kita akan menuju ke panduan ke-2.


PAnduan 2:


Pada panduan kedua kita akan memasang Javascript untuk menampilkan 2 slot iklan adsense di tengah-tengah postingan artikel.


Untuk cara memasang Javascript simak ulasan dibawah ini.



  1. Masih di halaman Edit HTML.

  2. Cari arahan berikut ini. 
    Script
    <b:if cond=’data:blog.pageType == &quot;item&quot; or data:blog.pageType == &quot;static_page&quot;’>

    <data:post.body/>

    </b:if>

  3. Ganti arahan tersebut dengan arahan ini. 
    Script
    <b:if cond=’data:blog.pageType == &quot;item&quot;’>

    <b:if cond=’data:blog.isMobileRequest == &quot;false&quot;’>

    <div class=’middleAds middleAds1′ id=’middleAds1′>

    <div style=’clear:both;’>

    <!– Iklan di tengah artikel 1 –>

    </div>

    </div>

    <div class=’middleAds middleAds2′ id=’middleAds2′>

    <div style=’clear:both;’>

    <!– Iklan di tengah artikel 2 –>

    </div>

    </div>

    <div id=’tgtPost’><data:post.body/></div>

    <script type=’text/j4vascript’>

    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;tgtPost&quot;);

    var midAd1 = document.getElementById(&quot;middleAds1&quot;);

    var midAd2 = document.getElementById(&quot;middleAds2&quot;);

    var showAd1 = tgt.getElementsByTagName(&quot;br&quot;);

    var showAd2 = tgt.getElementsByTagName(&quot;p&gt;&quot;);

    if (showAd1.length &gt; 0) {insertAfter(midAd1,showAd1[3]);}

    if (showAd2.length &gt; 0) {insertAfter(midAd1,showAd2[3]);}

    if (showAd1.length &gt; 0) {insertAfter(midAd2,showAd1[5]);}

    if (showAd2.length &gt; 0) {insertAfter(midAd2,showAd2[5]);}

    </script>

    </b:if>

    <b:else/>

    <data:post.body/>

    </b:if>

    <b:if cond=’data:blog.pageType == &quot;static_page&quot;’>

      <data:post.body/>

    </b:if>

  4. Atau jikalau di template hanya menemukan arahan ibarat ini
    Script
    <b:if cond=’data:blog.pageType == &quot;item&quot;’>

    <data:post.body/>

    </b:if>

  5. Jangan memasukan arahan yang aku tandai dengan warna merah.


Keterangan


  • Letakan slot iklan yang pertama dibawah kode <!– Iklan di tengah artikel 1 –>

  • Kemudian slot iklan kedua letakan dibawah kode <!– Iklan di tengah artikel 2 –>

  • Terahir sesuaikan sendiri pada paragraf keberapa kau ingin menampilkan iklan dengan menentukan angka 3 ata 5 
    Script
    if (showAd1.length &gt; 0) {insertAfter(midAd1,showAd1[3]);}

    if (showAd2.length &gt; 0) {insertAfter(midAd1,showAd2[3]);}

    if (showAd1.length &gt; 0) {insertAfter(midAd2,showAd1[5]);}

    if (showAd2.length &gt; 0) {insertAfter(midAd2,showAd2[5]);}


Note: Semakin besar angka yang kau tuliskan maka iklan akan berada semakin kebawah



Panduan 3:


Sekarang waktunya kita memasang script iklan adsense pada slot widget yang sudah tersedia. untuk cara memasangnya simak ulasan dibawah ini.


Sebelumnya kita harus memisahkan script iklan adsense yang akan kita tampil AMP dan Destop.



  1. Hapus terlebih dahulu arahan js-ad ibarat ini
    Script
    <script async=’async’ custom-element=’amp-ad’ src=’https://cdn.ampproject.org/v0/amp-ad-0.1.js’/>

  2. Kemudian cari kode </head> atau kode &lt;/head&gt;&lt;!--<head/>--&gt; lalu letakkan arahan dibawah ini sempurna di atas arahan tadi.
    Script
    <b:if cond=’data:blog.pageType not in {&quot;static_page&quot;,&quot;error_page&quot;} and data:blog.isMobileRequest == &quot;true&quot; and not data:blog.searchQuery’>

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

    </b:if>

    <b:if cond=’data:blog.pageType not in {&quot;static_page&quot;,&quot;error_page&quot;} and data:blog.isMobileRequest == &quot;false&quot; and not data:blog.searchQuery’>

    <script async=’async’ src=’//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js’/>

    </b:if>

  3. Untuk sanggup meletakan slot iklan pada script widget yang akan menampilkan 2 slot iklan di tengah postingan kita harus memakai format yang biasa dan bukan format AMP. Kurang lebihnya ibarat arahan ini.
    Script
    <ins class=’adsbygoogle’ data-ad-client=’ca-pub-xxxxxxxxxxxxxx’ data-ad-format=’rectangle’ data-ad-slot=’xxxxxxxxxxxxxx’ style=’display:block’/>

    <script>

    (adsbygoogle = window.adsbygoogle || []).push({});

    </script>

  4. Kemudian kita juga harus mengubah seluruh script semua slot iklan kecuali widget yang menampilkan 2 iklan di tengah tadi menjadi ibarat arahan ini.
    Script
    <b:if cond=’data:blog.isMobileRequest == &quot;false&quot; and not data:blog.searchQuery’>

    <!– Ini untuk menampilkan iklan di perangkat desktop (laptop/PC) –>

    <ins class=’adsbygoogle’ data-ad-client=’ca-pub-xxxxxxxxxxxxxx’ data-ad-format=’rectangle’ data-ad-slot=’xxxxxxxxxxxxxx’ style=’display:block’/>

    <script>

    (adsbygoogle = window.adsbygoogle || []).push({});

    </script>

    </b:if>

    <b:if cond=’data:blog.isMobileRequest == &quot;true&quot; and not data:blog.searchQuery’>

    <!– Ini akan menampilkan iklan di tampilan AMP/mobile –>

    <amp-ad data-ad-client=’ca-pub-xxxxxxxxxxxxxx’ data-ad-slot=’xxxxxxxxxxxxxx’ data-auto-format=’rspv’ data-full-width=” height=’320′ media='(max-width: 736px)’ type=’adsense’ width=’100vw’>

    <div overflow=”/>

    </amp-ad>

    </b:if>
    Ganti Kode data-ad-client dan data-ad-slot pada iklan dengan Script iklan yang sesuai dengan iklan kamu.

  5. Supaya tampilan iklan di tengah postingan terlihat rapi. silahkan tambahkan arahan CSS berikut diatas </style> pada post page.
    Script
    /* Middle Ads */

    .middleAds{margin:10px auto 4px;display:block;overflow:hidden;width:100%;height:auto;text-align:center}

    .middleAds p{font-size:11px!important;font-weight:400;text-align:center;display:block;padding:0;margin:0 auto 5px!important;color:#bbb!important}

  6. Terahir simpan Template.


Dua iklan yang sudah kita buat tadi hanya akan tampil pada halaman destop saja, atau perangkat lainya selain device yang berahiran url m=1


Demikianlah panduan Memasang 2 Iklan Adsense di Tengah Postingan AMP pada template blogger, Jika kau suka dengan artikel ibarat ini, silahkan berlangganan artikel kau via email dan sukai halaman fb agenponsel.com



Sumber aciknadzirah.blogspot.com