Простой скрипт ротатора ссылок и баннеров на PHP+jQuery
В предыдущей статье я рассказал о том, как сделать ротатор баннеров в CMS DataLife Engine на основе стандартной функции «Рекламные материалы». А сейчас я покажу, как подобное можно просто реализовать на PHP+jQuery для любой CMS.
Идея будет следующая: составим небольшой массив ссылок в HTML-разметке, с помощью функции shuffle перемешаем его, получим первые N элементов и посредством jQuery выведем результат на страницу.
1. Скрипт-обработчик будет выглядеть следующим образом:
<?php
header('Content-Type: text/html; charset=utf-8');
$link = [
'<div><a href="https://www.pandoge.com">Все для начинающего вебмастера</a></div>',
'<div><a href="https://vk.com">Вконтакте</a></div>',
'<div><a href="https://ya.ru">Yandex</a></div>',
'<div><a href="https://www.google.ru">Google</a></div>',
'<div><a href="https://mail.ru">Mail</a></div>',
'<div><a href="https://www.pandoge.com">www.pandoge.com</a></div>',
'<div><a href="https://www.yahoo.com">Yahoo</a></div>'
]; // Массив ссылок
shuffle($link); // Перемешиваем массив
$limit = 3; // Количество выводимых ссылок
if($limit > count($link)) {
$limit = count($link);
}
for($i = 0; $i < $limit; $i++) {
echo $link[$i];
}
?>
Его вы помещаете в PHP-файл и размещаете на сайте в нужной вам директории (папке).
2. Далее с помощью jQuery получим ссылки, которые отобрал наш PHP-скрипт. В нужное место на вашем сайте вставьте скрипт и элемент для вывода результата:
<div id="get_link"></div>
<script>
$(document).ready(function() {
$("#get_link").load("/rotator.php");
});
</script>
Если вы хотите сделать регулярное автоматическое подтягивание (получение) новой выборки без перезагрузки страницы, то скрипт jQuery замените на этот:
<script>
$(document).ready(function() {
$("#get_link").load("/rotator.php");
setInterval(function() {
$("#get_link").load("/rotator.php");
}, 5000); // Получаем новую выборку каждые 5 секунд
});
</script>
В обоих вариантах не забудьте «/rotator.php» изменить на адрес до вашего PHP-скрипта.