Lik Sod Seorang blogger pemula. Suka berbagi hal-hal yang diketahui dan dianggap perlu. Motto hidupnya dalah: sekecil apapun, hidup harus memberi manfaat. Blog ini adalah upaya memberi manfaat kepada orang lain melalui blog.

Tambahkan Adsense Ke Plugin AMP WordPress

3-cara-menambahkan-kode-kustom-ke-wordpress

Tambahkan Adsense Ke Plugin AMP WordPress. Ini menunjukkan kepada Anda cara menambahkan Google Adsense ke Halaman Seluler Dipercepat (AMP) Anda jika Anda menggunakan plugin WordPress AMP oleh Automattic.

Halaman ini menawarkan empat cara berbeda untuk menambahkan Google Adsense ke AMP.

  1. Contoh pertama akan menambahkan satu iklan Google Adsense ke halaman AMP Anda, di atas konten.
  2. Contoh kedua akan menambahkan satu iklan Adsense dalam konten setelah sejumlah paragraf.
  3. Contoh ketiga akan menambahkan beberapa iklan Adsense dalam konten setelah nomor paragraf yang Anda tentukan.
  4. Contoh keempat sangat berbeda. Ini membuat satu kode pendek yang berfungsi baik pada reguler dan AMP (Accelerated Mobile Pages) untuk menampilkan iklan Google Adsense Anda.

Contoh 2 dan 3 berguna jika Anda ingin secara otomatis memasukkan iklan di antara paragraf (setelah sejumlah paragraf tertentu) dalam konten posting AMP Anda. Namun, contoh 4 memberi Anda kendali penuh atas tempat untuk menampilkan iklan dalam konten Anda.

Keempat contoh ini akan membuat Google Adsense berfungsi pada halaman WordPress AMP jika Anda menggunakan plugin WordPress AMP oleh Automattic.

Langkah 1:

Pertama, Anda akan memerlukan unit iklan Google Adsense “responsif”. Jika Anda belum memilikinya, maka buat unit iklan baru seperti ini:

  1. Masuk ke akun Google Adsense Anda -> klik “Unit Iklan” -> klik “Unit iklan baru” -> pilih “Iklan teks & tampilan.”
  2. Beri nama unit iklan baru seperti “Iklan AMP untuk Situs Saya.”
  3. Untuk ukuran Iklan, Anda harus memilih yang Responsif.
  4. Klik “Simpan dan dapatkan kode.” Catat informasi berikut dari kode iklan responsif Anda:
    • ID penerbit Anda ( data-ad-client ), misalnya, ca-pub-1234567891234567.
    • ID unit iklan Anda ( data-ad-slot ), misalnya, 1234567890.
  5. Anda harus menempelkan kedua nilai ini dalam contoh di bawah ini.

Langkah 2:

Selain itu, apakah Anda menggunakan Contoh 1, Contoh 2, Contoh 3, atau Contoh 4, Anda harus menambahkan skrip AMP Iklan .js untuk menambahkan dukungan untuk elemen amp-ad. Ini mudah untuk dilakukan. Tambahkan skrip Iklan AMP ke situs WordPress Anda dengan menambahkan ini ke fungsi Anda:
[code]
/**
* Add the AMP Ad script to AMP pages.
*/
function isa_load_amp_adsense_script( $data ) {
$data[‘amp_component_scripts’][‘amp-ad’] = ‘https://cdn.ampproject.org/v0/amp-ad-0.1.js’;
return $data;
}
add_filter( ‘amp_post_template_data’, ‘isa_load_amp_adsense_script’ );
[/code]
Sekarang Anda siap untuk beralih ke contoh untuk menambahkan kode Adsense yang sebenarnya. Berikut adalah 4 contohnya.

Contoh 1: Tambahkan Google Adsense ke AMP, Di Atas Konten

Perhatikan bahwa metode ini menambahkan Adsense di atas konten posting AMP, tetapi di bawah gambar unggulan. (Jika tidak ada gambar unggulan, maka iklan hanya akan berada di atas konten.)

Untuk menambahkan Google Adsense ke bagian atas konten AMP WordPress, cukup tambahkan kode berikut ke fungsi Anda. Anda harus melakukan dua perubahan ini:

  • Anda harus mengedit baris 12 untuk mengganti “ca-pub-1234567891234567” dengan ID penerbit Anda sendiri.
  • Edit baris 14 untuk mengganti “1234567890” dengan ID unit iklan Anda sendiri.

[code]
/**
* Add Google Adsense code to AMP above the content
*/
add_action( ‘pre_amp_render_post’, ‘isa_amp_add_content_filter_above’ );

function isa_amp_add_content_filter_above() {
add_filter( ‘the_content’, ‘isa_amp_adsense_above_content’ );
}

function isa_amp_adsense_above_content( $content ) {

$publisher_id = ‘ca-pub-1234567891234567’;

$ad_slot = ‘1234567890’;

// Adsense ad code
$ad_code = ‘<amp-ad width="100vw" height=320 type="adsense" data-ad-client="’ . $publisher_id . ‘" data-ad-slot="’ . $ad_slot . ‘" data-auto-format="rspv" data-full-width><div overflow></div></amp-ad>’;

return $ad_code . $content;
}
[/code]

Contoh 2: Tambahkan Satu Iklan Adsense Ke AMP Dalam Konten

Contoh ini akan memasukkan satu iklan Adsense ke dalam konten, setelah paragraf kedua. Jika Anda ingin menampilkan iklan setelah paragraf kemudian, alih-alih paragraf kedua, ubah “2” pada baris 20, di bawah, ke jumlah paragraf yang Anda inginkan. Namun, jika sebuah posting tidak memiliki jumlah paragraf itu, maka tidak ada iklan yang akan ditampilkan di tempat itu.

Perhatikan bahwa contoh ini hanya menambahkan satu unit iklan. Jika Anda ingin memasukkan lebih banyak unit tambahan setelah lebih banyak paragraf, lihat Contoh 3.

Anda harus mengedit kode berikut pada baris 12 dan 14 seperti ini:

  • Anda harus mengedit baris 12 untuk mengganti “ca-pub-1234567891234567” dengan ID penerbit Anda sendiri.
  • Edit baris 14 untuk mengganti “1234567890” dengan ID unit iklan Anda sendiri.

[code]
/**
* Add Google Adsense code to AMP within the content
*/
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-1234567891234567’;

$ad_slot = ‘1234567890’;

// Ad code. This is responsive as per Google guidelines for Adsense for AMP.
$ad_code = ‘<amp-ad width="100vw" height=320 type="adsense" data-ad-client="’ . $publisher_id . ‘" data-ad-slot="’ . $ad_slot . ‘" data-auto-format="rspv" data-full-width><div overflow></div></amp-ad>’;

// Insert Adsense ad between the content, after paragraph 2
$new_content = isa_insert_after_paragraph( $ad_code, 2, $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 );
}
[/code]
Contoh 4: Tampilkan Google Adsense Dengan Kode Pintas yang Berfungsi pada Halaman Reguler dan AMP

Di sini, saya menunjukkan kepada Anda cara yang sangat berbeda untuk menambahkan Google Adsense ke Halaman Seluler Dipercepat WordPress Anda. Cara ini berbeda dari contoh sebelumnya dalam 2 cara:

  1. Ini menunjukkan kepada Anda cara menambahkan Google Adsense dengan kode pendek. Dengan cara ini memberi Anda kendali penuh atas tempat untuk menampilkan iklan dalam konten Anda. Anda menempatkan kode pendek di konten Anda di mana Anda ingin iklan ditampilkan. (Sedangkan contoh sebelumnya menunjukkan cara memasukkan iklan secara otomatis setelah sejumlah paragraf.)
  2. Kode pendek ini akan membuat iklan Google Adsense muncul di pos biasa dan pos AMP (Laman Seluler Dipercepat). Kode pendek mendeteksi jika halaman AMP sedang dilihat, dan jika demikian, maka akan menggunakan kode iklan yang kompatibel dengan AMP. Jika halaman tersebut bukan halaman AMP, maka itu akan menggunakan kode iklan biasa. Jadi, kode pendek ini memastikan bahwa Google Adsense Anda akan berfungsi pada pos biasa dan halaman AMP (Laman Seluler yang Dipercepat).

Untuk membuat kode pendek – shortcode, tambahkan kode berikut ke fungsi Anda. Anda harus melakukan 2 perubahan ini:

  • Anda harus mengedit baris 6 untuk mengganti ca-pub-1234567891234567 dengan ID penerbit Anda sendiri.
  • Edit baris 8 untuk mengganti 1234567890 dengan ID unit iklan Anda sendiri.

[code]
/**
* Shortcode To Display Google Adsense ads on regular posts and and AMP (Accelerated Mobile Pages)
*/
function isa_get_amp_and_regular_adsense( $atts ) {

$publisher_id = ‘ca-pub-1234567891234567’;

$ad_slot = ‘1234567890’;

if ( is_amp_endpoint() ) {
return ‘<amp-ad width="100vw" height=320 type="adsense" data-ad-client="’ . $publisher_id . ‘" data-ad-slot="’ . $ad_slot . ‘" data-auto-format="rspv" data-full-width><div overflow></div></amp-ad>’;
} else {
return ‘<ins class="adsbygoogle" style="display:block" data-ad-client="’ . $publisher_id . ‘" data-ad-slot="’ . $ad_slot . ‘" data-ad-format="auto"></ins><script>(adsbygoogle = window.adsbygoogle || []).push({});</script>’;
}
}
add_shortcode( ‘isa_amp_and_regular_adsense’, ‘isa_get_amp_and_regular_adsense’ );

/**
* Add the regular Adsense script to regular single posts.
*/
function isa_load_regular_adsense_script() {
wp_register_script( ‘google-adsense’, ‘//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js’, ”, null, true );
if ( is_single() ) {
wp_enqueue_script( ‘google-adsense’ );
}
}
add_action( ‘wp_enqueue_scripts’, ‘isa_load_regular_adsense_script’ );

/**
* Add async attribute to the regular Adsense script.
*/
function isa_adsense_async_script( $tag, $handle, $src ) {
if ( ‘google-adsense’ == $handle ) {
return ‘<script async src="’ . $src . ‘"></script>’;
}
return $tag;
}
add_filter( ‘script_loader_tag’, ‘isa_adsense_async_script’, 10, 3 );
[/code]
Kode di atas berhati-hati untuk memuat skrip iklan AMP yang diperlukan ke halaman AMP, dan skrip Adsense biasa (adsbygoogle.js) pada posting tunggal biasa.

Penggunaan Kode Pendek
Kode pendek terlihat seperti ini:

[isa_amp_and_regular_adsense]

Untuk menggunakan kode pendek, rekatkan di dalam artikel Anda tempat Anda ingin iklan ditampilkan. Anda akan menggunakan ini di dalam dashboard WordPress Anda, ketika Anda membuat atau mengedit posting. Jadi, di editor posting, tempel kode pendek di suatu tempat di dalam konten posting. Anda dapat menggunakan kode pendek ini beberapa kali di halaman yang sama. Anda juga dapat menggunakan ini pada halaman sebanyak yang Anda inginkan. Ingat bahwa Google Adsense memiliki batas 3 iklan reguler per halaman.

Catatan
Jika Anda ingin melihat pratinjau bagaimana iklan Anda akan muncul di halaman AMP Anda (Accelerated Mobile Pages), Anda harus menavigasi ke salah satu URL AMP Anda di perangkat seluler (seperti ponsel). Jika Anda melihat pratinjau laman AMP di peramban desktop biasa, Anda mungkin tidak akan melihat iklan. Ini tidak apa-apa karena halaman AMP hanya akan ditampilkan kepada pengguna di perangkat seluler, oleh karena itu namanya “Laman Seluler yang Dipercepat – Accelerated Mobile Pages.”

Demikian Info Blogger tentang Cara tambahkan adsense ke Plugin AMP WordPress. Cara menambahkan Google Adsense ke blog AMP yang menggunakan plugin WordPress AMP oleh Automattic.

Lik Sod Seorang blogger pemula. Suka berbagi hal-hal yang diketahui dan dianggap perlu. Motto hidupnya dalah: sekecil apapun, hidup harus memberi manfaat. Blog ini adalah upaya memberi manfaat kepada orang lain melalui blog.

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *