AdMob
Реклама — один из способов заработать на приложении. FlutterFlow поддерживает Google AdMob: в проект добавляются баннеры и полноэкранные объявления.
Настройка AdMob
Понадобится создать приложения AdMob для Android и iOS, получить их ключи и задать несколько настроек.
1. Приложение в AdMob
Зарегистрируйтесь в AdMob под аккаунтом Google и создайте приложения для Android и iOS, указав платформу и название.
Приложений должно быть два — по одному на платформу, иначе реклама покажется только на одной из них.
2. Ключи во FlutterFlow
Ключи приложений связывают ваше приложение с сервером AdMob.
Скопируйте ключ из App Settings в AdMob, откройте Settings and Integrations во FlutterFlow и вставьте ключи Android и iOS в настройки интеграции AdMob.
3. Дополнительные настройки
Остальные настройки лежат там же, в Settings and Integrations.
-
Show Test Ads — тестовые объявления вместо настоящих. Включайте на время разработки: по ним можно нажимать, не списывая деньги рекламодателей и не рискуя блокировкой аккаунта за подозрительную активность. Перед публикацией выключите.
-
Show GDPR Consent Dialog at App Launch — показывать запрос согласия пользователям из Евросоюза. Диалог появится, только если пользователь действительно из ЕС и вы создали сообщение о европейских требованиях.
-
Child-Directed Settings — отметка, что контент рассчитан на детей. Google будет учитывать это при подборе рекламы.
-
Users Under the Age of Consent — для пользователей Европейской экономической зоны младше возраста согласия. Ограничивает сбор данных и таргетинг, как того требует закон.
-
Ad Content Filtering — возрастной рейтинг рекламы. AdMob не покажет объявления выше выбранного уровня:
- G — для всех, без взрослых тем.
- PG — можно детям под присмотром взрослых.
- T — для подростков, допустимы отдельные взрослые темы.
- MA — только для взрослых.
Дальше можно выводить баннеры и полноэкранные объявления.
Баннер
Виджет AdBanner показывает рекламный баннер: текст, картинку или видео.
Вот как выглядит виджет с тестовым объявлением:
Добавление виджета
Перетащите AdBanner из палитры Base Elements. Затем создайте в AdMob новый рекламный блок типа Banner и вставьте его unit ID во FlutterFlow — это идентификатор конкретного объявления.
Размер баннера по умолчанию — 100 × 50.
Слишком частые нажатия по объявлениям во время разработки приводят к пометке аккаунта AdMob за недействительную активность. Включайте Test Ads.
Проверка баннера
В Test и Run Mode реклама не работает — только на реальном устройстве или эмуляторе. Запускайте через Local Run или выгрузите код и соберите его в своей среде.
Полноэкранное объявление
Interstitial Ad занимает весь экран и показывается в паузах — например, при переходе между страницами. В отличие от баннера, пользователь должен закрыть его, чтобы продолжить. Форматы: картинка, видео, интерактивное объявление.
Работает это в два действия — Load Interstitial Ad и Show Interstitial Ad:
Сначала объявление загружается, потом показывается. После закрытия то же объявление показать повторно нельзя — нужно загрузить новое, и оно будет готово к следующему вызову Show Interstitial Ad.
Между Load Interstitial Ad и Show Interstitial Ad должно пройти достаточно времени — загрузка не мгновенная. Если объявление должно появиться по нажатию на виджет, загружайте его сразу при открытии страницы. Не успело загрузиться — не покажется вовсе.
Разберём на примере: объявление показывается при переходе на следующую страницу.
На первой странице по её загрузке вызывается Load Interstitial Ad. По нажатию на виджет — Show Interstitial Ad. Результат попадает в переменную interstitialAdSuccess: если она true, объявление закрыто — можно загружать следующее и переходить дальше.
Ad Unit ID
Ad Unit ID — идентификатор конкретного объявления в AdMob, он нужен при загрузке.
В панели AdMob выберите приложение в разделе Apps и создайте рекламный блок типа Interstitial в разделе Ad units. Скопируйте его идентификатор; для iOS-версии повторите то же самое.
Загрузка при открытии страницы
Загружайте объявление заранее — чтобы картинка или видео успели подтянуться. Лучшее место для этого — триггер On Page Load.
Выберите страницу, добавьте триггер On Page Load и действие Load Interstitial Ad. Укажите Ad Unit ID для iOS и Android из предыдущего шага.
На время разработки включайте Test Ads — иначе аккаунт AdMob можно получить пометку за недействительную активность.
Показ объявления
Показывает объявление действие Show Interstitial Ad. Оно возвращает переменную interstitialAdSuccess — по ней видно, закрыл ли пользователь объявление. Если да, загрузите следующее и переходите на нужную страницу.
Рекомендации
- Тестовые объявления на разработке. Это защищает аккаунт от блокировки за недействительный трафик.
- Соблюдение правил AdMob. Размещение, частота показов, случайные нажатия — всё это регулируется: правила и ограничения AdMob.
- Приватность пользователей. GDPR, CCPA и настройки согласия — см. приватность и согласие в AdMob.
Баннеры
- Место на экране. Держите баннер сверху или снизу, чтобы он не мешал работе с основным содержимым: рекомендации по размещению баннеров.
- Отличие от контента. Баннер не должен сливаться с интерфейсом — пользователь должен видеть, что перед ним реклама, и не нажимать на неё случайно.
Полноэкранные объявления
- Загружайте заранее — в фоне, до момента показа.
- Показывайте в паузах. Объявление посреди действия раздражает.
- Не частите. Слишком много полноэкранной рекламы — верный способ потерять пользователей.
- Проверяйте на тестовых объявлениях до выхода в продакшн: так вы не наберёте недействительных нажатий и не рискуете аккаунтом.