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

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

  • автор:

Как разместить баннер на сайте

Для размещения дополнительной информации на сайте (в текстовом формате, в виде картинки или анимации, со ссылкой на интернет-ресурс и т.д.) удобно пользоваться баннерами. Такой инструмент позволит дополнить контент Вашего сайта, не нарушая его структуру, эстетику и удобство пользования. При этом добавление баннера на Ваш сайт с помощью конструктора «Нубекс» не потребует технически сложных манипуляций и займет не более пяти минут.

Для того, чтобы вставить баннер на сайт, необходимо войти в режим управления сайтом и в панели управления (слева) выбрать раздел «Виджеты».

Панель управления сайтом

Затем следует выбрать колонку, в которой Вы хотите разместить баннер.

Обратите внимание: в системе «Нубекс» баннеры можно вставить только в левую или правую колонку, соответственно, максимальная ширина баннера определяется шириной колонки: 220 точек. Если Ваш сайт использует дизайн без колонок (одноколоночник), то баннеры, добавленные в систему, на сайте не отобразятся.

Выбор колонки

После выбора колонки нужно кликнуть по раскрывающемуся меню: откроется список элементов, которые Вы можете добавить в эту колонку.

Раскрывающееся меню

Вы можете разместить баннер как в виде картинки, так и в виде кода (созданного Вами или полученного от партнера/исполнителя).

Размещение баннера в виде картинки

Если Вы хотите вставить баннер картинкой, выберите в меню пункт «Создать блок баннеров»: откроется раздел редактирования.

Выбор пункта «Создать блок баннеров»

Вы можете изменять тип оформления баннера:

  • ввести заголовок (необязательно): он будет отображаться над опубликованным баннером-картинкой;
  • изменить стиль отображения баннера и заголовка: добавить фон или рамку для картинки, фон для заголовка.

Редактирование блока баннеров

Обратите внимание: по умолчанию система предлагает Вам отображать баннер как на главной, так и на всех внутренних страницах сайта. Если Вам необходимо добавить баннер только на главную страницу (или только на остальные), уберите нужные галочки в меню вверху страницы. Отобразить баннер только на некоторых (не всех) внутренних страницах сайта невозможно.

Для выбора картинки — будущего баннера — нажмите на кнопку «Загрузить изображения» внизу экрана, выберите нужный файл на компьютере и нажмите «Открыть».

Загрузка изображений

Выбор изображений

Обратите внимание: допустимые форматы загружаемых файлов — jpeg, jpg, gif, png; максимальный размер каждого файла — 10 Мб. В ширину картинки должны иметь не менее 200px.

После загрузки картинки Вы можете изменить параметры баннера, щелкнув по стикеру «Изменить настройки тизера» в графе «Редактирование».

Переход в режим редактирования параметров баннера

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

Редактирование параметров баннера

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

Отображение баннера

Как показать баннеры в случайном порядке

Если Вы хотите, чтобы при каждом обновлении страницы (или при переходе в другой раздел сайта) у пользователя отображался случайный баннер из определенного набора (пула), при создании блока баннеров нужно сделать следующее:

  1. При загрузке изображений выбрать не одну картинку, а несколько — это будет основой для Вашего пула;
  2. После загрузки изображений (при необходимости) для каждого из них отредактировать параметры баннера (подпись, URL ссылки, краткое описание);
  3. Установить режим отображения: случайный или в порядке сортировки. Сортировать порядок изображений Вы можете кнопками «вверх/вниз» в поле, где отображаются загруженные картинки;
  4. Установить количество отображаемых анонсов (1-10), т.е. то количество баннеров из пула, которое будет одновременно отображаться на странице;
  5. Сохранить изменения, выйти в режим просмотра сайта и обновлять страницу до тех пор, пока меняющиеся картинки не перестанут Вас радовать.

Режимы отображения баннеров

Размещение баннера в виде кода

Если Вы уже имеете код для вставки баннера (например, код предоставлен Вашим партнером или сгенерирован специальным сервисом), то выберите в меню пункт «Создать текстовый блок». Перейдите в режим «Источник» и вставьте код в текстовое поле.

Создание текстового блока

Вставка кода в режиме источника

Так же, как и при размещении баннера-картинки, Вы можете изменять параметры отображения (на главной и внутренних страницах сайта, в т.ч. в мобильной версии) и типы оформления баннера (фон и рамка).

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

  • Как создать сайт самостоятельноКак создать сайт самостоятельно
  • Работа со страницамиРабота со страницами
  • Наполнение страницНаполнение страниц
  • Работа с изображениями и файламиРабота с изображениями и файлами
  • ФотогалереиФотогалереи
  • НовостиНовости
  • Каталог товаровКаталог товаров
  • Интернет-магазинИнтернет-магазин
  • Формы обратной связиФормы обратной связи
  • ВиджетыВиджеты
  • Функции продвиженияФункции продвижения
  • Доступ в систему управленияДоступ в систему управления
  • Внешние сервисыВнешние сервисы
  • ДизайнДизайн

Добавление баннера на OpenCart

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

Название баннера – как называется ваш баннер.

Статус – определят включен или выключен баннер.

Заголовок – название изображения, которое будет использоваться в баннере.

Ссылка – ссылка которая ведет на страницу сайта. Это может быть статья, категория, производитель, продукт.

Изображение – непосредственно изображение баннера.

Порядок сортировки — порядок показа баннера.

После внесенных изменения необходимо их сохранить.

Добавление модуля баннера на сайт.

Для отображения добавленного баннера на сайт необходимо добавить модуля для данного баннера на сайт. Для этого необходимо зайти в раздел Модули/Расширения выбрать пункт Модули/Расширения – Модули.

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

В открывшемся окне необходимо заполнить параметры:

Название модуля – Пишем название нашего баннера.

Баннер – в списке выбираем баннер, который нам необходим.

Ширина и Высота – параметры баннера, которые мы хотим иметь.

Статус – для отображения баннера на сайте необходимо изменить статус на включено.

После заполнения данных сохраняем нажатием кнопки с дискетой. Обязательно проверяем его в списке модулей.

Для отображения на сайте баннера необходимо добавить его в макеты тех страниц, где мы хотим его размещать. Для этого необходимо зайти в раздел меню Дизайн- Макеты. В списке выбираем необходимый макет страницы. В рассматриваемом примере мы выберем макет для Категорий.

В разделе “Выберете расположение модуля” выбираем место для баннера.

В выпадающем меню выбираем наш модуль.

После выбора обязательно нажимаем кнопку добавить для сохранения выбора.

Сохраненный баннеры должен иметь следующий вид:

Затем необходимо сохранить изменения в макете.

Все — вы добавили баннер на сайте.

Как установить баннер на сайт на WordPress: самый простой и быстрый метод

Как создать блог. Видео Уроки WordPress

В этой статье вы узнаете о том, как установить баннер на сайт, который работает на WordPress. Способ, который подойдёт для новичков, так как является самым лёгким, простым и понятным.

Баннеры – это изображения, анимированные или статичные, клик по которым переводит на какой-то адрес. Они являются самым распространённым видом рекламы. И если вы будете знать, как установить баннер, то сможете торговать баннерными местами на своём сайте.

Советы к баннерам

Прежде, чем установить баннеры, узнайте о рекомендациях для них:

  • Баннер лучше использовать анимированный, так как статичный сливается со всем дизайном сайта.
  • Анимированный баннер не должен переключаться слишком часто, чтобы посетитель смог увидеть, что нарисовано на каждом кадре.
  • Баннер лучше делать в формате изображения gif, а не в виде флеш-картинки swf, так как флеш-баннеры вызывают негативную реакцию у поисковиков.
  • Изображения баннера не должно весить слишком много, чтобы не нагружать сайт.
  • Клик по баннеру должен открывать другую страницу в новой вкладке, а не в той же.

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

Для того чтобы установить баннер, не нужно быть программистом. В WordPress всё можно реализовать проще, без знания кода, хотя с кодом повозиться всё-таки придётся. Те, кому лень, могут воспользоваться специальным плагином. О нём здесь.

Чтобы установить баннер, сделайте следующее:

  • Откройте редактор записи (пункт консоли «Записи», подпункт «Добавить новую»).
  • Нажмите кнопку «Добавить медиафайл», и загрузите изображение баннера.
  • Когда изображение будет загружено в его атрибутах, в списке «Ссылка» выберите «Произвольно» и укажите ссылку, на которую должен перенаправлять баннер.
  • В редакторе записи перейдите во вкладку «Текст». Вы увидите код баннера, который можно установить в любое место сайта или распространять его, чтобы кто-то другой устанавливал.

В WordPress можно установить баннер двумя способами:

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

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

Вам также следует узнать о том, как можно создать баннер самому.

Как разместить баннер на сайте за 2 минуты

У многих начинающих вебмастеров часто возникает такой вопрос: «А как разместить баннер на сайте?» Например, я уже разместил не один banner на своих сайтах, поэтому с удовольствием расскажу вам, как это сделать.

как разместить баннер на сайте

Кроме этого вы узнаете, на каких проектах можно размещать баннеры, а на каких нет, и как правильно это делать, чтобы не навредить своему ресурсу.

Перед тем как размещать баннер, его конечно нужно создать. Чтобы это сделать, вы можете прочитать 2 статьи на моем блоге: «Как сделать gif баннер?» и «Как сделать угловой баннер?» Ну а если вы решили разместить баннер на сайт рекламодателей, то он должен сам его предоставить, и делать вам ничего не нужно.

Итак, прежде чем перейти к размещению баннера, нужно сказать следующее:

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

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

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

Теперь что касается посещаемости. Я не понимаю тех людей, которые вешают рекламу на блоге с посещаемостью 10 уникальных посетителей в сутки. Вот у меня сейчас примерная посещаемость 250 уников в сутки, но я рекламу еще не размещаю. Зачем это делать? Много денег я и так не заработаю, а вот навредить эти баннеры могут прилично.

2) Не размещайте баннеры с яркими цветами, которые режут глаза. Вам нравиться смотреть на этот banner :smile:?

как разместить баннер на своем сайте

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

Когда вы разместите banner на своем блоге, начните читать свою статью, и ответьте себе на такие вопросы: «Мне удобно читать?» «Меня ничего не раздражает?» Если не раздражает, то все замечательно, так и должно быть.

Многие почему-то думают, что чем они ярче сделают баннер, тем больше на него будут кликать. Но на самом деле это далеко не так. Посетитель смотрит на этот banner и тут же отворачивает глаза в сторону. Я уже давно понял, что лучше всего работает реклама на сайте тогда, когда она аккуратно вписывается в дизайн.

3) Размещайте только тематические баннеры. Я часто захожу на развлекательные блоги и вижу там баннеры о продвижении сайтов с партнерской ссылкой :smile:. Ну, кто будет на него кликать? Кому он нужен? Да, возможно у школьника также есть свой ресурс, но все равно, нетематические баннеры размещать на сайте бесполезно и толку от них никакого не будет.

Конечно, если вам заплатили за этот banner деньги, и рекламодатель сам решил разместить рекламу на нетематическом сайте, то тогда, пожалуйста, если баннер не режет глаза, можете размещать.

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

Припустим, вы создали примерно такой banner:

как разместить баннер на сайте бесплатно

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

Мне нужно еще сделать так, чтобы этот баннер вел на такую страницу:

Теперь я делаю код баннера, выглядит он у меня следующим образом:

пример кода баннера

Сейчас давайте разберем этот код подробно, чтобы было понятно, что здесь за что отвечает.

  • rel=»nofollow» — этот атрибут нужен для того, чтобы закрыть ссылку на внешний сайт от индексации. Обязательно вставляйте этот атрибут и закрывайте ненужные ссылки от индексации, они могут только навредить в продвижении, особенно если это сквозные линки где-нибудь в сайдбаре;
  • target=»_blank» — атрибут предназначен для того, чтобы ссылка на баннер открывалась в новом окне. Лучше его оставить, чтобы не терять посетителей со своего сайта и тем самим улучшать поведенческие факторы;
  • site.ru — ну, здесь все понятно, это ссылка на сайт. Эту ссылку даст вам рекламодатель, если вы размещаете рекламный banner. Или это будет ваша партнерская ссылка;
  • Alt – тег alt нужно указывать возле картинки всегда, чтобы не было ошибок валидации;
  • vachevskiy.ru/wp-content/themes/BusinessBlog/images/banner.png — адрес на хостинге, куда я загрузил баннер. Вы указываете свой адрес. Более того, если ввести этот адрес в браузере, то вы должны увидеть там banner. Если будет выдаваться 404 ошибка, значит, вы указали путь к баннеру неверно;
  • width=»240″ и height=»400″ — ширина и высота баннера, лучше также указывать, это ускорит загрузку баннера с хостинга.

Вы можете просто скопировать этот код и заменить в нем некоторые вещи:

  1. Ссылку на сайт, куда должен вести banner. Вместо site.ru указываете свою;
  2. Адрес на хостинге, откуда нужно загружать баннер. Вместо vachevskiy.ru/wp-content/themes/BusinessBlog/images/banner.png указываете свой;
  3. Тег Alt пропишите свой и укажите ширина и высота своего баннера.

Следующая задача – это разместить рекламный баннер на сайте. Здесь сложно дать конкретные рекомендации, так как мне неизвестно какой у вас движок. Но сейчас для примера я покажу, как разместить баннер на сайте wordpress в сайтбаре.

Для этого захожу в «панель управление» – «дизайн» – «виджеты» и просто вставляю свой код баннера в виджет.

как разместить баннер на сайте wordpress

На блоге banner у меня выглядит следующим образом:

баннер на vachevskiy.ru

Кроме этого, если у вас сайт сделан на движке wordpress, то вы можете еще открыть файл header.php, sidebar.php или single.php и вставить код баннера в любой из этих файлов в то место, где вы хотите, чтобы он выводились.

Если нужно выровнять banner по центру, то для этого подойдет тег «center». Код баннера будет выглядеть так:

выравнивание баннера по центру

Если banner прилипает внизу к какому-то элементу, то можно сделать отступ снизу на несколько пикселей. Для примера сделаю отступ на 10 px. Код баннера будет таким:

прописываем отступы снизу

Если баннер сверху прилипает, то можно также сделать отступ сверху на несколько пикселей. Пусть будет также на 10:

отступ сверху от баннера

Как видите, ничего сложного нет. Делаем код, вставляем его на своем блоге и радуемся. У меня обычно эта процедура занимает несколько минут.

На этом здесь все. Теперь думаю понятно, как разместить баннер на сайте бесплатно. Всем пока!

(8 оценок, среднее: 4.38 из 5)

  • Профессия SEO специалист, что нужно знать и уметь
  • Бесплатный или платный хостинг сайтов
  • Что такое таргетинг и какие виды таргетинга бывают
  • UTM метка – что это и для чего она используется?
  • Как зайти в админку WordPress легко и быстро?

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *