Aby omawiać nasze usługi i przekazywać opinie na ich temat, dołącz do oficjalnego kanału Discord usługi Ad Manager na serwerze społeczności Google Ads i pomiarów.

Ta strona została przetłumaczona przez Cloud Translation API.

Szablony natywne

Wybierz platformę: Android iOS Flutter

Pobieranie szablonów reklam natywnych

Za pomocą reklam natywnych możesz dostosowywać swoje reklamy, co przekłada się na lepsze wrażenia użytkowników. Lepsze wrażenia użytkowników mogą zwiększyć zaangażowanie i poprawić ogólne zyski.

Aby w pełni wykorzystać potencjał reklam natywnych, warto dostosować układy reklam tak, by stanowiły naturalne rozszerzenie aplikacji. Aby ułatwić Ci rozpoczęcie pracy, utworzyliśmy szablony reklam natywnych.

Szablony reklam natywnych to gotowe widoki kodu reklam natywnych, które zostały zaprojektowane z myślą o szybkiej implementacji i łatwej modyfikacji. Dzięki szablonom reklam natywnych możesz wdrożyć pierwszą taką reklamę w ciągu kilku minut i szybko dostosować jej wygląd bez konieczności pisania dużej ilości kodu. Możesz umieścić te szablony w dowolnym miejscu, np. w widoku recyklera używanym w kanale informacyjnym, w oknie dialogowym lub w innym miejscu w aplikacji.

Nasze natywne szablony są udostępniane jako moduł Android Studio, więc łatwo je uwzględnić w projekcie i używać w dowolny sposób.

Rozmiary szablonów

Dostępne są 2 szablony: mały i średni. Oba elementy korzystają z klasy TemplateView i mają stały format obrazu. Zostaną one przeskalowane tak, aby wypełnić szerokość widoków nadrzędnych.

Mały szablon

@layout/gnt_small_template_view

Mały szablon jest idealny w przypadku widoków recyklera lub wszędzie tam, gdzie potrzebujesz długiego prostokątnego widoku reklamy. Możesz go na przykład używać w przypadku reklam In-Feed.

Szablon średni

@layout/gnt_medium_template_view

Szablon średni powinien zajmować od 1/2 do 3/4 strony, ale można go też używać w pliku danych. Jest to dobre rozwiązanie w przypadku stron docelowych lub stron powitalnych.

Możesz eksperymentować z miejscem docelowym. Możesz też oczywiście zmienić kod źródłowy i pliki XML, aby dostosować je do swoich potrzeb.

Instalowanie szablonów reklam natywnych

Aby zainstalować szablony reklam natywnych, pobierz plik ZIP (korzystając z opcji Sklonuj lub pobierz na GitHubie) i zaimportuj moduł do istniejącego projektu Android Studio.

Wybierz Plik > Nowy > Zaimportuj moduł.
Wybierz folder nativetemplates.

Dodaj ten wiersz do pliku build.gradle na poziomie aplikacji:

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

Korzystanie z szablonów reklam natywnych

Możesz użyć szablonu w dowolnym pliku XML układu, tak jak w przypadku każdej innej grupy widoków.

dodawanie szablonu do układu,

Korzystanie z szablonów to proces dwuetapowy:

Najpierw musisz uwzględnić szablon w układzie.

<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>

Następnie musisz przekazać szablonowi reklamę natywną, gdy się ona wczyta:

MobileAds.initialize(this);
AdLoader adLoader = new AdLoader.Builder(this, "/21775744923/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());

Klucze słownika stylów

Szablon możesz dostosować na 2 sposoby: za pomocą tradycyjnego kodu XML układu i za pomocą obiektu NativeTemplateStyle.Builder. Powyższy przykładowy kod pokazuje, jak użyć obiektu NativeTemplateStyle.Builder do ustawienia głównego koloru tła, ale dostępnych jest też wiele innych opcji. Oto wszystkie dostępne metody tworzenia. Konstruktor zwraca obiekt NativeTemplateStyle, który zastępuje stylizację układu XML. Układy XML gnt_small_template.xml i gnt_medium_template.xml korzystają z tych samych parametrów stylów Androida, które już znasz.

Metody kreatora stylu szablonu natywnego
`withCallToActionTextTypeface`	`Typeface callToActionTextTypeface` Krój pisma wezwania do działania.
`withCallToActionTextSize`	`float callToActionTextSize` Rozmiar tekstu wezwania do działania.
`withCallToActionTypefaceColor`	`int callToActionTypefaceColor` Kolor tekstu wezwania do działania.
`withCallToActionBackgroundColor`	`ColorDrawable callToActionBackgroundColor` Kolor tła wezwania do działania.
`withPrimaryTextTypeface`	`Typeface primaryTextTypeface` Rodzaj czcionki w pierwszym wierszu tekstu.
`withPrimaryTextSize`	`float primaryTextSize` Rozmiar pierwszego wiersza tekstu.
`withPrimaryTextTypefaceColor`	`int primaryTextTypefaceColor` Kolor pierwszego wiersza tekstu.
`withPrimaryTextBackgroundColor`	`ColorDrawable primaryTextBackgroundColor` Kolor tła pierwszego wiersza tekstu.
`withSecondaryTextTypeface`	`Typeface secondaryTextTypeface` Czcionka drugiego wiersza tekstu.
`withSecondaryTextSize`	`float secondaryTextSize` Rozmiar drugiego wiersza tekstu.
`withSecondaryTextTypefaceColor`	`int secondaryTextTypefaceColor` Kolor tekstu w drugim wierszu.
`withSecondaryTextBackgroundColor`	`ColorDrawable secondaryTextBackgroundColor` Kolor tła drugiego wiersza tekstu.
`withTertiaryTextTypeface`	`Typeface tertiaryTextTypeface` Czcionka trzeciego wiersza tekstu.
`withTertiaryTextSize`	`float tertiaryTextSize` Rozmiar trzeciego wiersza tekstu.
`withTertiaryTextTypefaceColor`	`int tertiaryTextTypefaceColor` Kolor tekstu w trzecim wierszu.
`withTertiaryTextBackgroundColor`	`ColorDrawable tertiaryTextBackgroundColor` Kolor tła trzeciego wiersza tekstu.
`withMainBackgroundColor`	`ColorDrawable mainBackgroundColor` Główny kolor tła.

Publikuj

Przygotowaliśmy szablony reklam natywnych, aby pomóc Ci szybko tworzyć takie reklamy. Zachęcamy do dodawania nowych szablonów i funkcji w naszym repozytorium GitHub. Wyślij nam żądanie pull, a chętnie się z nimi zapoznamy.