Чтобы подключить несколько блоков Яндекс рекламы к ReactJS, вам необходимо выполнить следующие шаги:
1. Установите пакет react-yandex-ads
с помощью npm или yarn:
npm install react-yandex-ads
или
yarn add react-yandex-ads
2. Импортируйте компонент YandexAd
из пакета react-yandex-ads
в вашем React-компоненте:
import { YandexAd } from 'react-yandex-ads';
3. Зарегистрируйтесь в Яндекс.Директ и создайте необходимые блоки рекламы. Получите их идентификаторы (slot id).
4. Внутри вашего React-компонента создайте блоки YandexAd
с помощью полученных идентификаторов:
const MyComponent = () => { return ( <div> <YandexAd adType="direct" blockId="ваш_slot_id" format="размер_и_формат" /> <YandexAd adType="direct" blockId="ваш_slot_id" format="размер_и_формат" /> {/* Добавьте ещё блоки рекламы по необходимости */} </div> ); }
5. Вместо "ваш_slot_id"
вставьте идентификаторы ваших блоков рекламы (slot id), а вместо "размер_и_формат"
укажите размеры и форматы блоков рекламы (например, 300x250
или auto
).
6. Перейдите на страницу, содержащую ваш React-компонент, и вы должны увидеть подключенные блоки Яндекс рекламы.
Обратите внимание, что для работы с Яндекс.Директ вам потребуется создать аккаунт и настроить необходимые настройки рекламного кабинета.