Как вывести на сайт новости из RSS ленты

АвторСообщение
Machino
Разработчик
месяц назад

Для добавления RSS новостей сторонних ресурсов вы можете воспользоваться виджетом "Произвольный контент". Также понадобится немного JavaScript кода. Создание новостей будет рассмотрено на примере RSS с сайта worldoftanks.ru.

1. Создайте на любой странице виджет "Произвольный контент" и нажмите кнопку "Исходный код" в редакторе HTML:

2. В открывшемся окне создайте пустой DIV блок с идентификатором "rss":

Можете скопировать тут:

<div id="rss" class="row">Загрузка...</div>

3. Откройте "Панель управления -> Редактор HTML -> Head/Body". В поле "HTML перед </body> тегом " скопируйте следующий код:

<script>
$(function(){
var url = 'https://worldoftanks.ru/ru/rss/news/';
var rss = $('#rss');
if (!rss.length) return;
$.get('/api/rss-proxy?url=' + encodeURIComponent(url), function (data) {
rss.empty();
$($.parseXML(data)).find("item").each(function () {
var el = $(this);
var date = (new Date(el.find('pubDate').text())).toLocaleString("ru", {year: 'numeric', month: 'long', day: 'numeric', hour: 'numeric', minute: 'numeric'});
rss.append('<div class="col-3 p-3"><img src="'+el.find('enclosure').attr('url')+'"><div class="h6 mt-2 mb-0">'+el.find('title').text()+'</div><div class="text-muted"><small>'+date+'</small></div><div class="mt-2">'+el.find('description').text()+'</div></div>');
});
});
});
</script>

Этот код предназначен для вывода новостей в 4 колонки с сайта worldoftanks.ru. Для других сайтов код будет отличаться.

Скриншот для наглядности:

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

Сообщение было изменено пользователем Machino месяц назад
Machino
Разработчик
месяц назад

В примере выше я добавил в настройках виджета во вкладке Стиль немного CSS, что бы ссылки "Читать дальше, Обсудить на форуме" выглядели лучше: