Halaman ini diterjemahkan oleh Cloud Translation API.

Template Native

Dengan menggunakan iklan native, Anda dapat menyesuaikan iklan sehingga menghasilkan pengalaman pengguna yang lebih baik. Pengalaman pengguna yang lebih baik dapat meningkatkan engagement dan meningkatkan hasil Anda secara keseluruhan.

Untuk mendapatkan hasil maksimal dari iklan native, penting untuk menata gaya tata letak iklan Anda agar terlihat seperti perluasan alami dari aplikasi Anda. Untuk membantu Anda memulai, kami telah membuat Template Native.

Template Native adalah tampilan lengkap kode untuk iklan native Anda, yang didesain untuk penerapan cepat dan modifikasi yang mudah. Dengan Template Native, Anda dapat menerapkan iklan native pertama Anda hanya dalam beberapa menit, dan dapat menyesuaikan tampilan dan nuansa dengan cepat tanpa banyak kode. Anda dapat menempatkan template ini di mana saja yang diinginkan, seperti di tampilan recycler yang digunakan dalam feed berita, dalam dialog, atau di mana pun di aplikasi Anda.

Template native kami disediakan sebagai modul Android Studio, sehingga mudah untuk menyertakannya dalam project dan menggunakannya sesuka Anda.

Ukuran template

Ada dua template: kecil dan sedang. Keduanya menggunakan class TemplateView dan memiliki rasio aspek tetap. Mereka akan melakukan penskalaan untuk mengisi lebar tampilan induknya.

{i>Template<i} kecil

@layout/gnt_small_template_view

Template kecil cocok untuk tampilan recycler, atau kapan pun Anda memerlukan tampilan iklan persegi panjang yang panjang. Misalnya, Anda dapat menggunakannya untuk iklan dalam feed.

Template sedang

@layout/gnt_medium_template_view

Template media dimaksudkan untuk memenuhi setengah hingga tiga perempat kunjungan halaman, tetapi juga dapat digunakan dalam feed. Ini bagus untuk halaman landing atau halaman pembuka.

Jangan ragu untuk bereksperimen dengan penempatan. Tentu saja, Anda juga dapat mengubah kode sumber dan file XML agar sesuai dengan kebutuhan Anda.

Menginstal template iklan native

Untuk menginstal template native, cukup download file zip (menggunakan opsi Clone atau download di GitHub), lalu impor modul ke project Android Studio yang sudah ada.

Pilih File > New > Import Module.
Pilih folder nativetemplates.

Tambahkan baris berikut ke file build.gradle level aplikasi Anda:

dependencies {
        ...
        implementation project(':nativetemplates')
        ...
}

Menggunakan template iklan Native

Anda dapat menggunakan template ini dalam file XML tata letak apa pun, seperti kelompok tampilan lainnya.

tambahkan template ke tata letak

Penggunaan template adalah proses dua langkah:

Pertama, Anda perlu menyertakan template sebagai bagian dari tata letak.

<LinearLayout
   xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:app="http://schemas.android.com/apk/res-auto"
   xmlns:tools="http://schemas.android.com/tools"
   android:layout_width="match_parent"
   android:layout_height="match_parent"
   tools:context=".MainActivity"
   tools:showIn="@layout/activity_main" >

<!--  This is your template view -->
<com.google.android.ads.nativetemplates.TemplateView
   android:id="@+id/my_template"
   <!-- this attribute determines which template is used. The other option is
    @layout/gnt_medium_template_view -->
   app:gnt_template_type="@layout/gnt_small_template_view"
   android:layout_width="match_parent"
   android:layout_height="match_parent" />

...
</LinearLayout>

Selanjutnya, Anda harus memberikan template iklan native saat iklan dimuat:

MobileAds.initialize(this);
AdLoader adLoader = new AdLoader.Builder(this, "/6499/example/native")
    .forNativeAd(new NativeAd.OnNativeAdLoadedListener() {
        @Override
        public void onNativeAdLoaded(NativeAd nativeAd) {
            NativeTemplateStyle styles = new
              NativeTemplateStyle.Builder().withMainBackgroundColor(background).build();
            TemplateView template = findViewById(R.id.my_template);
            template.setStyles(styles);
            template.setNativeAd(nativeAd);
        }
     })
     .build();

adLoader.loadAd(new AdManagerAdRequest.Builder().build());

Tombol kamus gaya

Ada dua cara untuk menata gaya template Anda: menggunakan XML tata letak tradisional dan menggunakan objek NativeTemplateStyle.Builder. Contoh kode di atas menunjukkan cara menggunakan objek NativeTemplateStyle.Builder untuk menetapkan warna latar belakang utama, tetapi ada juga berbagai opsi lainnya. Berikut adalah semua metode builder yang tersedia. Builder menampilkan objek NativeTemplateStyle yang mengganti gaya tata letak XML apa pun. Tata letak XML gnt_small_template.xml dan gnt_medium_template.xml menggunakan parameter gaya Android yang sama dengan yang sudah Anda ketahui.

Metode builder untuk gaya template native
`withCallToActionTextTypeface`	`Typeface callToActionTextTypeface` Jenis huruf untuk {i>call-to-action<i}.
`withCallToActionTextSize`	`float callToActionTextSize` Ukuran teks pesan ajakan (CTA).
`withCallToActionTypefaceColor`	`int callToActionTypefaceColor` Warna teks pesan ajakan (CTA).
`withCallToActionBackgroundColor`	`ColorDrawable callToActionBackgroundColor` Warna latar belakang pesan ajakan (CTA).
`withPrimaryTextTypeface`	`Typeface primaryTextTypeface` Jenis huruf pada baris pertama teks.
`withPrimaryTextSize`	`float primaryTextSize` Ukuran baris pertama teks.
`withPrimaryTextTypefaceColor`	`int primaryTextTypefaceColor` Warna baris pertama teks.
`withPrimaryTextBackgroundColor`	`ColorDrawable primaryTextBackgroundColor` Warna latar belakang baris pertama teks.
`withSecondaryTextTypeface`	`Typeface secondaryTextTypeface` Jenis huruf pada baris kedua teks.
`withSecondaryTextSize`	`float secondaryTextSize` Ukuran baris kedua teks.
`withSecondaryTextTypefaceColor`	`int secondaryTextTypefaceColor` Warna teks pada baris kedua teks.
`withSecondaryTextBackgroundColor`	`ColorDrawable secondaryTextBackgroundColor` Warna latar belakang baris kedua teks.
`withTertiaryTextTypeface`	`Typeface tertiaryTextTypeface` Jenis huruf pada baris ketiga teks.
`withTertiaryTextSize`	`float tertiaryTextSize` Ukuran teks baris ketiga.
`withTertiaryTextTypefaceColor`	`int tertiaryTextTypefaceColor` Warna teks pada baris ketiga teks.
`withTertiaryTextBackgroundColor`	`ColorDrawable tertiaryTextBackgroundColor` Warna latar belakang teks baris ketiga.
`withMainBackgroundColor`	`ColorDrawable mainBackgroundColor` Warna latar belakang utama.

Kontribusi

Kami telah membuat Template Native untuk membantu Anda mengembangkan iklan native dengan cepat. Kami ingin melihat Anda berkontribusi pada repositori GitHub untuk menambahkan template atau fitur baru. Kirimkan permintaan pull kepada kami dan kami akan memeriksanya.