Алёнка

Как добавить баннер на свой сайт

Как установить баннер на сайт: пошаговая инструкция для новичков

Друзья, привет! Иногда у новичков возникает вопрос как установить баннер на сайт? На самом деле установить баннер на сайт достаточно просто: нужно лишь определиться с местом рекламной картинки. Чаще рекламные баннера со своей партнерской (реферальной) ссылкой размещают в виджете сайта на движке wordpress (боковые колонки) или непосредственно в статьях в виде картинок, которые ведут на партнерские продукты.

Как установить баннер в виджет сайта

Давайте сразу определимся с тем, чтобы установить баннер на сайт, нам нужно знать его код. Коды баннеров обычно предоставляют те ресурсы, партнерские продукты которых вы хотите продвигать. Обязательно к вашей партнерке вам присваивается реферальная (партнерская) ссылка. Посетители вашего сайта, щелкнув на нее, прописываются за вами, и если будет сделана продажа, часть прибыли уйдет вам!

Рассмотрим, как установить баннер на сайт, на примере партнерки хостинга OfferHost. Тем более, что такой баннер у меня уже имеется.

На главной странице Offerhost.ru внизу переходим на вкладку Партнерская программа.

Далее в рекламных материалах выбираем понравившийся вам баннер.

Есть баннеры анимированные, есть с ценой, для соцсетей и т.д. Обязательно под картинкой копируем внимательно код баннера полностью!

Переходим в Консоль сайта – Внешний вид – Виджеты.

Для того, чтобы вставить код баннера в сайдбар, необходимо перенести сюда из левой колонки новый блок Текст.

И уже в открывшемся поле Текста вставить скопированный код баннера.

Теперь обратите внимание в коде на слова в кавычках ВАША РЕФЕРАЛЬНАЯ ССЫЛКА. Сюда строго между кавычек нужно вставить партнерскую ссылку, которая именно в Офферхосте находится внутри кабинета. Естественно вы должны быть зарегистрированы на хостинге. Админка хостинга – Клиент – вкладка Реферальная программа – Реферальная ссылка.

Скопируйте реферальную ссылку. Возвращаемся на сайт в блок Текст с кодом баннера. Вместо слов ВАША РЕФЕРАЛЬНАЯ ССЫЛКА строго между кавычек вставляйте скопированную реферальную ссылку.

Не забудьте нажать Сохранить. Теперь, если перейти на главную страницу сайта в виджете вы увидите баннер, щелкнув по которому, посетители вашего сайта по реферальной ссылке попадут на хостинг Офферхост.

Часто бывает такое, что баннер встает не посередине виджета, а смещается к левому краю. Это можно исправить, заключив код баннера в теги center: <center>…</center>. Тогда ваш баннер встанет строго посередине колоночки.

Как установить баннер в статью сайта

В этом случае вы можете использовать картинки партнерского продукта или собственные. Здесь код баннера копировать нет необходимости! И, на мой взгляд, это более простой вариант размещения реферальной ссылки. Все, что вам нужно при загрузке медиафайла (картинки) в статью в ссылке картинки в поле URL вставить вашу реферальную ссылку и Сохранить.

Щелкнув по такой картинке, посетители так же будут попадать на рекламируемый вами партнерский продукт.

Более подробно как установить баннер на сайт смотрите в моем видеоуроке

Денежные ручейки

Полное руководство по добавлению баннера cookie на ваш веб-сайт

В любом случае, каким типам веб-сайтов нужен баннер cookie?

Если на ваш веб-сайт приходят посетители из Европейского Союза, вам, вероятно, понадобится баннер с согласием на использование файлов cookie, если вы хотите придерживаться правил Европейского Союза.

Первоначально принятые в 2011 году и расширенные с помощью GDPR в 2018 году, правила Европейского Союза в отношении файлов cookie по существу требуют, чтобы вы получали «четкое, осознанное согласие» посетителей на использование файлов cookie, которые отслеживают данные пользователей.

Это технически не для каждого отдельного веб-сайта, но с учетом популярности таких инструментов, как Google Analytics, Facebook Pixel, кнопки публикации в социальных сетях и других, есть довольно высокая вероятность, что ваш веб-сайт использует хотя бы некоторые файлы cookie для отслеживания.

Итак, на практике , большинству сайтов, которые принимают посетителей из Европейского Союза, требуется баннер согласия на использование файлов cookie. И в этом глобальном мире это большинство сайтов - точка.

Короче говоря… Вам, вероятно, понадобится баннер согласия на использование файлов cookie , если вы хотите соблюдать правила Европейского Союза!

Вот что вам нужно включить в уведомление о согласии на использование файлов cookie.

Цель баннера файлов cookie - получить информированное согласие на использование файлов cookie до того, как посетители начнут использовать ваш сайт.

Итак, вам необходимо:

Показывать баннер согласия на использование файлов cookie сразу после первого посещения пользователя.
Получить информированное согласие посетителей на использование файлов cookie. Обычно это делается путем ссылки на вашу политику конфиденциальности / файлов cookie, а также с помощью кнопки, указывающей на согласие.

Три отличных примера баннеров cookie в действии (вы узнаете, как их все воссоздать!)

Хорошо, вам нужен баннер cookie. А теперь - куда вы его положите?

Вы можете разместить свой баннер cookie где угодно, если он достаточно заметен, чтобы привлечь внимание читателей и получить осознанное согласие.

Давайте начнем с нескольких примеров, а затем мы покажем вам, как вы можете продублировать любой из этих примеров на своем собственном сайте без необходимости написания ни одной строчки кода.

1. Баннер согласия на использование файлов cookie на нижней панели

Beyond The Barre использует привлекающую внимание нижнюю панель для подтверждения согласия на использование файлов cookie:

2. Баннер согласия на использование файлов cookie на верхней панели

Decksender меняет положение, перемещая файл cookie Баннер вверху страницы:

3.Выдвижной баннер согласия на использование файлов cookie

INUSUAL позволяет отображать баннер согласия на использование файлов cookie в виде вставки в нижнем левом углу (вы можете легко переключить его вправо):

Добавьте эти баннеры файлов cookie в за пару кликов

Если вам понравился какой-либо из этих примеров, вы можете добавить их прямо на свой веб-сайт в течение нескольких минут. Просмотрите галерею баннеров согласия на использование файлов cookie ниже и нажмите кнопку «Просмотреть в реальном времени», чтобы увидеть их в действии. Затем выберите тот, который хотите разместить на своем веб-сайте, и в режиме предварительного просмотра следуйте кратким пошаговым инструкциям.

Плавающая панель

Хотите создать баннер с нуля? Вы тоже можете это сделать. Следуйте пошаговой инструкции по созданию баннера для файлов cookie ниже.

Как создать свой собственный баннер для файлов cookie, не написав ни единой строчки кода

Теперь самое интересное - как вы можете создать баннер согласия на использование файлов cookie, как в этих примерах , для вашего собственного веб-сайта .

Во всех трех примерах используется Getsitecontrol - инструмент, позволяющий добавлять несколько виджетов на ваш сайт.Виджеты могут быть плавающими кнопками контактов, всплывающими окнами электронной почты, онлайн-формами обратной связи или… как вы уже догадались - баннерами согласия на использование файлов cookie .

Используя простой интерфейс, вы сможете настроить свой баннер cookie:

Размещение
Включая все приведенные выше примеры, а также другие
Текст
Включая возможность ссылки на вашу политику конфиденциальности
Кнопка
Оба текст и цвет вашей кнопки
Цвета
В соответствии с дизайном вашего сайта

И он также включает в себя специальный адаптивный режим, который гарантирует, что ваше уведомление о согласии на использование файлов cookie отлично работает и для мобильных посетителей.Вот как использовать Getsitecontrol для создания уведомления о согласии на использование файлов cookie…

Шаг 1. Добавьте Getsitecontrol на свой веб-сайт

Хотя вы будете выполнять большую часть работы в веб-интерфейсе Getsitecontrol, вам сначала нужно добавить Getsitecontrol на свой веб-сайт чтобы вы могли отображать баннер согласия на использование файлов cookie после его публикации.

Для этого вам необходимо создать учетную запись Getsitecontrol. Затем вам нужно добавить на свой сайт фрагмент кода Getsitecontrol. Если вы используете WordPress, самый простой способ добавить фрагмент - через официальный плагин Getsitecontrol.Он выполнит интеграцию за вас. Для других сайтов вам необходимо вручную добавить код перед закрывающим тегом на вашем сайте.

Если вы не знаете, как это сделать, в документации Getsitecontrol есть подробные руководства для большинства популярных платформ, в том числе:

После завершения процесса вы можете использовать кнопку ~~Установить код~~ на панели инструментов Getsitecontrol, чтобы убедиться, что код работает:

Теперь вы готовы создать фактическое уведомление о согласии на использование файлов cookie!

Шаг 2. Создайте новый виджет

Чтобы отобразить уведомление о согласии на использование файлов cookie, вы можете создать новый виджет, используя галерею шаблонов.

Для начала нажмите кнопку ~~+ Создать виджет~~ на панели инструментов Getsitecontrol, а затем выберите ~~Я хочу продвигать контент~~ .

Шаг 3: Выберите расположение баннера cookie

Прежде всего, вы должны выбрать, где разместить баннер cookie.

Хотя Getsitecontrol предлагает четыре различных варианта положения, обычно лучшим подходом является использование одного из этих двух положений:

Штанга
Верхняя или нижняя
Задвижная
Левая или правая

Эти позиции по-прежнему привлекают внимание и могут отображать полный текст, но они не полностью захватывают впечатления вашего посетителя, как модальное всплывающее окно.

Для уведомлений о согласии на использование файлов cookie следует также избегать последнего варианта, поскольку он отображает текстовое содержимое только после того, как посетитель щелкнет панель.

При выборе вставки или панели вы заметите, что в галерее уже доступны базовые шаблоны баннеров для файлов cookie. Имейте в виду, что при желании вы сможете изменять как текст, так и дизайн. Когда будете готовы, нажмите ~~Выбрать и настроить~~ .

Шаг 4: Выберите цветовую тему

Возможно, вы хотите, чтобы цвета вашего баннера согласия соответствовали остальной части вашего сайта.Чтобы управлять этим, вы можете использовать область цветов , чтобы установить цвета для:

Фон
Кнопка
Обычный текст
Текст кнопки

Вы также можете добавить изображение из галереи или загрузить его со своего компьютер.

Шаг 5. Добавьте свой контент

Теперь, когда вы определились со стилем и расположением баннера согласия, пора настроить сообщение согласия для ваших посетителей. Общий текст уже включен, но вы можете редактировать его по своему усмотрению.Кроме того, вам нужно будет добавить ссылку на свою политику в отношении файлов cookie.

Чтобы настроить содержимое баннера, перейдите на вкладку ~~Содержимое~~ .

Не требуется указывать точный текст, который вы используете, но, опять же, цель здесь - получить «четкое, осознанное согласие». Итак, вот альтернативная копия, которую вы можете использовать:

Название - Этот веб-сайт использует файлы cookie
Описание - Продолжая использовать наш сайт, вы понимаете, что мы используем файлы cookie для улучшения вашего опыта и собирать аналитические данные.Узнайте больше в нашей Политике конфиденциальности.
Текст кнопки - Я согласен

Вы можете увидеть, как ваш текст будет отображаться для мобильных посетителей, если переключитесь в мобильный режим под окном предварительного просмотра.

Шаг 6. Контроль времени появления уведомления о согласии на использование файлов cookie.

Чтобы не приставать к посетителям, когда они перемещаются по вашему сайту, необходимо убедиться, что уведомление о согласии на использование файлов cookie перестанет появляться после того, как посетитель нажмет кнопку ~~Я согласен~~ .Для этого вы можете использовать вкладку ~~Targeting~~ .

Перейдите к ~~Stop, чтобы отобразить меню виджета~~ и выберите ~~+ Добавить условие~~ . Затем выберите ~~Действие пользователя~~ .

В этом случае «действие» - это посетитель, нажимающий кнопку, чтобы дать согласие на использование файлов cookie. Вам не нужно изменять какие-либо другие настройки на вкладке ~~Targeting~~ .

Шаг 7: Активируйте баннер согласия на использование файлов cookie

Теперь все готово! Все, что вам нужно сделать, чтобы активировать уведомление о согласии на использование файлов cookie, - это нажать кнопку ~~Сохранить и закрыть~~ в правом верхнем углу, чтобы завершить настройку баннера.

Затем выберите опцию ~~Активировать сейчас~~ , как предлагает приложение:

После этого посетители должны начать видеть уведомление о согласии на использование файлов cookie. И как только они нажмут кнопку, чтобы согласиться на использование файлов cookie, они больше не будут видеть баннер файлов cookie.

Добавление уведомления о согласии на использование файлов cookie не должно быть трудным

Поддержание вашего веб-сайта в соответствии с законом о согласии на использование файлов cookie - не то, для чего вам нужен разработчик. Используя Getsitecontrol и принципы, изложенные в этом посте, вы можете настроить свой собственный настраиваемый баннер согласия на использование файлов cookie без необходимости писать ни одной строчки кода.

Custom Banners - плагин для WordPress

Custom Banners - это плагин WordPress, который позволяет легко управлять несколькими баннерами (рекламой) и отображать их во внешнем интерфейсе.

Создавайте баннеры один раз и повторно используйте их на своем веб-сайте

Используйте пользовательские баннеры, чтобы создавать многоразовые баннеры, которые может использовать вся ваша команда! Установите баннеры один раз, и вы сможете повторно использовать их на сайте. Лучше всего, если вам нужно сделать обновление, вы можете просто сделать это один раз.

Обновите свои баннеры, не касаясь кода

Просто разместите шорткод с помощью виджетов нашего редактора на странице, где вы хотите разместить свой баннер, и тогда вам больше не придется редактировать эту страницу! Пользовательские баннеры также реализованы как простой в использовании виджет!

Вместо этого вы сможете управлять этим баннером прямо из панели управления WordPress, загружая новые баннеры и удаляя старые по своему усмотрению. И все это без необходимости редактировать ваши страницы.

Простое добавление подписей и кнопок с призывом к действию к вашим пользовательским баннерам

Custom Banners позволяет вам дополнительно указать заголовок, текст призыва к действию и URL-адрес для каждого баннера, что делает ваши баннеры эффективным способом привлечения посетителей на самые важные страницы. Субтитры могут поддерживать все типы контента, включая видео на YouTube!

Используйте подписи, чтобы объявить о новом специальном предложении, и кнопку с призывом к действию, чтобы ваши клиенты сразу же заявили о нем.

Поворот между несколькими баннерами с группами баннеров

Custom Banners также дает вам много возможностей для вращения баннеров в позиции. Таким образом, вы можете указать несколько баннеров, которые принадлежат к группе баннеров, и тогда программное обеспечение будет автоматически перемещаться по баннерам в группе баннеров.

Автоматически публиковать новые баннеры в указанное время

У вас есть баннер, объявляющий о новой акции, но вы хотите скрыть его до нужного времени? Нет проблем - с функцией «Время публикации» пользовательских баннеров вы можете настроить свой баннер сейчас, но не показывать его до нужного времени.

С версией Pro легко добавляйте слайды, перелистывание и мозаичные баннеры по всему сайту!

Щелкните здесь, чтобы увидеть живые примеры.

Обновите до Pro, чтобы получить расширенные возможности и поддержку

Команда GoldPlugins не предоставляет прямую поддержку плагина Custom Banners на форумах WordPress.org. Индивидуальная поддержка по электронной почте доступна только тем, кто приобрел Custom Banners Pro. Custom Banners Pro добавляет возможность создавать расширенные слайд-шоу из ваших баннеров, просматривать и отслеживать клики, а также более 50 профессионально разработанных тем.Вам следует обновить его сегодня!

Перейти на персонализированные баннеры Pro

. .

Конструктор интернет-баннеров, Дизайн и создание баннеров

Получите больше кликов, создавая плавную анимацию

Адаптивные и анимированные баннеры HTML5 всего в нескольких кликах

Создавайте полностью адаптивные баннеры, которые будут идеально смотреться на экранах любого размера и любого устройства. Создавать собственные интерактивные медийные объявления никогда не было так просто: вы можете создавать анимацию HTML5, добавлять видео, ссылки или встраивать собственный код.Выучить больше...

HTML5 Адаптивная шкала

HTML5 анимации

Баннерная аналитика