среда, 5 мая 2010 г.

Крутим банеры на блогспоте.

Возникла задача: реализовать на блогспоте систему "случайного" показа банеров.
Для чего? Все тот же Admitad дает много вкусных предложений. Приходится выбирать какое-то одно. А хочется все попробовать.
Вот и появилась задумка сделать списочек ссылок с банерами и показывать их по-очереди.
А потом уже можно будет определить какое предложение лучше всего конвертится.

По "научному" такая вещь называется банерокрутилка. Исходников в сети валяется полно. Как на JS так и на PHP. PHP нам не подходит. Не поддерживает блогспот PHP (. Остается JS.

Для реализации сей задачи идем в "Дизайн"->"Изменить HTML". Загружаем шаблон на всякий случай. Ищем строку </head> и вставляем перед ней следующий код:


<script type="text/javascript">
ban_arr=[
"BiteFight",
"http://www.ad.admitad.com/goto/3b45dcfeb324c02781fe44500ff1dc",
"http://www.ad.admitad.com/banner/3b45dcfeb324c02781fe44500ff1dc",
"Farmerama",
"http://www.ad.admitad.com/goto/84fa2befb424c02781fe87bdddd593",
"http://www.ad.admitad.com/banner/84fa2befb424c02781fe87bdddd593",
"BattleKnight",
"http://www.ad.admitad.com/goto/f51e4dc2c124c02781fe23d4f43007",
"http://www.ad.admitad.com/banner/f51e4dc2c124c02781fe23d4f43007",
"EndWelt",
"http://www.ad.admitad.com/goto/b419ab53bf24c02781fe047b106299",
"http://www.ad.admitad.com/banner/b419ab53bf24c02781fe047b106299"
];

function banershow()
{
datacount=ban_arr.length/3;
index=Math.floor(Math.random()*datacount);
document.writeln("<a href='"+ban_arr[index*3+1]+"'><img src='"+ban_arr[index*3+2]+"' width='468' height='60' border='0'/></a>");
}

</script>



Разберем код.
В массив ban_arr помещаются строки:
1. Название банера - роли не играет, используется лишь для удобства
2. Ссылка, по которой переходит пользователь после клика
3. Ссылка, по которой подкачиваем рисунок

Как видно, на каждый банер приходится по три строки данных разделенных запятыми. В показанном примере 4 таких набора. При желании, можно добавить дополнительные. Не забываем, что у последней строки нет запятой.
После массива идет описание функции, которая и будет показывать банер. Переменная datacount содержит число наборов. В index помещаем случайное число от 0 до datacount-1. Это число будет определять, какой набор в данный момент будет показываться.
Последняя строка функции служит для формирования кода вывода банера в браузер пользователя.

Все. Сохраняем шаблон и идем в "Дизайн"->"Элементы страницы". К этому времени уже должен на нужном месте стоять виджет "HTML/JavaScript". Если нет, то добавляем.
В содержимое виджета вставляем код:

<script>
banershow();
</script>
<noscript>
Здесь прописываем банер в случае если JS отключен
</noscript>


Здесь мы просто вызываем ранее определенную функцию. В случае, если JS не работает, прописываем один банер.

Сохраняем и наслаждаемся простейшей банерокрутилкой. Удачной всем конвертации трафика.

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

2 комментария:

  1. Анонимный30 мая 2014 г., 22:44

    Здравствуйте. А он у Вас срабатывает при обновлении страницы или на временной счетчик?

    ОтветитьУдалить