Телеграм: @bazarow_ru Почта: mihail@bazarow.ru

Вывести компонент новостей на страницу в Битрикс

Просмотров: 65107

Посмотрел Яндекс метрику на свой сайт, и решил что буду частенько писать сюда именно то, что ищут люди. Итак за последнюю неделю 8 раз пытались найти на сайте информацию о том как вывести компонент новостей на страницу в Битрикс.

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

Итак приступим:

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

Создание инфоблока

1. Кликаем в структуре на "Типы инфоблоков" и нажимаем на зеленую кнопку "+ Добавить новый тип"

Создание типа инфоблока Битрикс

2. Откроется окно мастера создания инфоблока:

Задаем индентификатор, он должен состоять из латинских букв/цифр и знака подчеркивания. Русское название, в примере я поставил "Мой блог" и английское "My blog"- если вы действительно делаете для новостей пишите "Новости" и "news" (или как вам будет угодно)

Создание типа инфоблока Битрикс

3. Далее в дереве "Типы инфоблоков" находим наш свежесозданный инфоблок и кликаем по нему. Далее на зеленую кнопку "+ Добавить инфоблок".

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

4. Откроется мастер создания инфоблока. Заполняем примерно следующим образом:

  • Символьный код: латинские буквы без пробелов со знаками подчеркивания
  • Выбираем сайт (в случае многосайтовой структуры), если он всего один, все равно выбираем его чекбоксом
  • Название инфоблока- собственно Новости (в примере Записная книжка)
  • Все остальное оставляем как есть, конечно если понимаете что делаете можно настроить ЧПУ и прочие тонкие параметры, но в простом варианте заработает со всем по умолчанию.
Создание инфоблока в битрикс

5. Переходим на закладку "Доступ" и выбираем в параметре "Для всех пользователей"- Чтение, чтобы новости после вывода на сайт были доступны для просмотра.

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

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

Выводим новости на страницу в Битрикс.

Создаем новый раздел (или страницу), назовем его Новости. Не буду вдаваться в подробности, по его созданию, в крайнем случае после нажатия кнопки "Создать раздел"- запустится пошаговый мастер создания раздела, который более чем понятен. Достаточно просто заполнять поля и нажимать "Далее".

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

В итоге вы придете вот к такому визуальному редактору, все что вы напишите или выведете вместо фразы "Text here..." и будет отображено на сайте в этом разделе.

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

Удаляем "Text here..." нафиг, раскрываем слева структуру (кликая на плюсики если кто не понял)
+Контент- +Статьи и новости
И перетягиваем самый первый компонент прямо на страницу (см. картинку):

Выводим компонент на страницу Битрикс

Далее два раза кликаем по иконке компонента на странице, откроется мастер настройки компонента.

Настройка компонента навостей в Битрикс

Итак пишу сверху вниз как заполнить поля:

  1. Шаблон компонента: выбираем .default если у вас еще нет готового шаблона для компонента новостей
  2. Выводить дату элемента: оставляем если нужно выводить дату публикации новости. 
  3. Выводить изображение для анонса: оставляем если нужно выводить картинку в анонсе. 
  4. Выводить текст анонса: аналогично с текстом. 
  5. Отображать панель соц. закладок: если нужны кнопки лайк социальных сетей то ставим галочку.
  6. Тип инфоблока: выбираем из выпадающего списка тот самый тип что создавали выше (см. выше пункт 2).
  7. Инфоблок- выбираем созданный ранее (см. выше пункт 4 начала статьи) инфоблок, в принципе он должен быть у вас всего один, но в любом случае выбираете именно тот что создавали в этом типе.
  8. Количество новостей на странице: по умолчанию 20, ставите что заблогорассудится. Это колличество которое будет выводится на странице за один раз, если больше- появится постраничная навигация. Пример на моем сайте, в разделе макеты выставлено 26 новостей (да там тоже выведено через компонент статьи и новости)
  9. Далее все пропускаем до пункта Включить поддержку ЧПУ (если оно вам конечно нужно), ставим чекбокс и в поле Каталог ЧПУ (относительно корня сайта): вписываем url раздела в котором выводятся новости, для примера у этого блога стоит /blog-note/ остальные поля оставляем как есть. Само собой это простая настройка для ЧПУ, более тонко вы сможете ее настроить почитав документацию. Однако работать новости итак будут.
  10. Все остальное до конца, оставляем как есть и нажимаем снизу слева, зеленую кнопку сохранить. Снова увидем  (без красной стрелки конечно)
Выводим компонент на страницу Битрикс

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

Повторюсь еще раз- чтобы не усложнять это обьяснение, не стал вдаваться в тонкие настройки, но вот с такими базовыми параметрами, вы уже вполне сможете начать писать новости на своем Битрикс сайте и они будут с поддержкой ЧПУ.

Сергей 10.04.2014
Здравствуйте, Михаил. Спасибо за ваши уроки, оказались очень полезными в отличие от книг издательства Битрикс, из которых понять сразу как работать с системой гораздо сложно.
У меня такой вопрос - я создал инфоблок новости, вывел его в разделе новости, но хотелось бы также вывести анонсы новостей в сайдбаре сайта, если я вывожу в шаблон компонент новостей, то при клике для детального просмотра эта новость также открывается в сайдбаре, а хотелось бы чтобы открывалась страница с детальным просмотром новости в главной области сайта а не сайдбаре.
Заранее спасибо за ответ.
Михаил Базаров 10.04.2014
Цитата
422 пишет:
Видеоурок: сайт на Битрикс
Посмотрите мой видеоурок http://camouf.ru/blog-note/bx_site_created/ ответ на Ваш вопрос там есть (не вспомню в каком именно, но думаю найдете)
Ольга 07.11.2014
Спасибо большое за понятное объяснение. Все сделала, как написано.
Осталась одна проблема.
Есть инфоблок Новости, есть список новостей, он отражается на экране. Можно добавить новость, она появляется в списке новостей.
Но при попытке открыть саму новость, появляется ошибка 404. Причем, в адресной строке стоит именно тот адрес, шаблон которого задан в настройках инфоблока.
Как открыть страничку отдельной новости, подскажите пожалуйста.
Михаил Базаров 11.11.2014
Цитата
Ольга пишет:
Спасибо большое за понятное объяснение. Все сделала, как написано.
Осталась одна проблема.
Есть инфоблок Новости, есть список новостей, он отражается на экране. Можно добавить новость, она появляется в списке новостей.
Но при попытке открыть саму новость, появляется ошибка 404. Причем, в адресной строке стоит именно тот адрес, шаблон которого задан в настройках инфоблока.
Как открыть страничку отдельной новости, подскажите пожалуйста.
Проверьте настройки ЧПУ и наличие файла htaccess в корне сайта
Guest 02.06.2015
Огромное спасибо!  :)
Guest 13.07.2015
Добрый день.
ранее сайт был информационным. решили сделать интернет магазин. Соответственно, есть -Типы инфоблоков/Контент/Аксессуары - хочется сделать этот инфоблок Каталогом ( тип каталог). Иду редактировать инфоблок - во вкладке Инфоблок отмечаю к какому сайту относится, в вкладке свойства прописываю свойства, в вкладке Торг каталог отмечаю что является торг каталогом. Но данный инфоблок "аксессуары" как был в типе Контент, так там и остался . Что еще нужно сделать что бы он стал каталогом и отображался в публичной части сайта в меню и т.д. ? очень не хочется в ручную все переносить и создавать вновь инфоблок каталог аксессуаров :) Возможно ли это ?  
Михаил Базаров 13.07.2015
Цитата
Guest пишет:
Добрый день.
ранее сайт был информационным. решили сделать интернет магазин. Соответственно, есть -Типы инфоблоков/Контент/Аксессуары - хочется сделать этот инфоблок Каталогом ( тип каталог). Иду редактировать инфоблок - во вкладке Инфоблок отмечаю к какому сайту относится, в вкладке свойства прописываю свойства, в вкладке Торг каталог отмечаю что является торг каталогом. Но данный инфоблок "аксессуары" как был в типе Контент, так там и остался . Что еще нужно сделать что бы он стал каталогом и отображался в публичной части сайта в меню и т.д. ? очень не хочется в ручную все переносить и создавать вновь инфоблок каталог аксессуаров Возможно ли это ?
Возможно не до конца понимаю, что вы проделали

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

По поводу меню: вот это в помощь http://camouf.ru/blog-note/722/
Дмитрий 28.01.2016
Спасибо вам за статью! Она мне очень помогла. :D
Andrei 09.01.2023
Благодарю

Записная книжка разработчика

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

Удалить товары из корзины, если есть определенные товары. Просмотров: 1915 Задача: если в корзину добавлены товары с определенным свойством, нужно удалить из корзины... Следующая/предыдущая новость/статья при просмотре подробной в Битрикс Просмотров: 18287 Дизайн создается только для наглядного и удобного предоставления содержимого сайта, пользо... Снять ограничение на количество символов в комментарии к заказу магаз... Просмотров: 12607 Как многим известно, в интернет-магазине на Битрикс имеется ограничение на количество симв... Установить остатки товара на складе из доступных остатков. Просмотров: 6229 Задача, заполнить остатки товаров, в 1С-Битрикс, из параметра "Доступное количество". Сортировка элементов по индексу сортировки значений типа список Просмотров: 11592 Внутри любого компонента есть заранее заложенные поля для сортировки элементов. МОжно сорт... Автоматическая загрузка каталогов из csv файлов в Битрикс Просмотров: 11797 Если требуется настроить автоматический импорт каталогов из csv файлов, от поставщиков. В... Если товар в корзине, поменять кнопку на "В корзине" в новом шаблоне ... Просмотров: 1769 Ранее я уже делал заметку на эту тему. Тогда, мы меняли значение input-а при добавлении то... Самодельная форма добавления элемента на API Битрикс Просмотров: 45279 Компонент iblock.element.add.form написан таким образом, что вы не сможете (не попотев изр... Ссылки для добавления и удаления товара из сравнения в Битрикс Просмотров: 8715 Просто оставляю это здесь, вставка ссылок на добавление и удаление товара из сравнения, ес... Открытие мобильного приложения Apache Cordova по ссылке Просмотров: 1187 Достаточно часто нужно реализовывать открытие мобильного приложения по ссылке. Например: п... AJAX корзина с отправкой количества из раздела каталога Просмотров: 20154 Столкнулся с задачкой: нужно было на одном сайте реализовать интерактивный прайс лист. При... Заполнение габаритов товара, после обмена с 1С, из свойств элемента и... Просмотров: 11821 Если Ваш интернет-магазин интегрирован с 1С, скорее всего столкнулись с такой проблемой: 1... Fancybox в стандартном шаблоне детальной карточки товара, вместо вспл... Просмотров: 105 Задача: заменить работу с изображениями в стандартном или кастомном шаблоне детальной карт... Добавление и удаление из сравнения на AJAX: Битрикс Просмотров: 18759 Рецепт лежал у меня в закромах, почти о нем и забыл, но тут подвернулся под руку- решил оп... Быстрая отписка от всех рассылок модуля "E-mail маркетинг", в кабинет... Просмотров: 277 Задача: дать пользователям возможность отписаться от всех рассылок "E-mail маркетинга", не... Правильное подключение стилей и скриптов в Битрикс Просмотров: 85235 Есть несколько способов подключения файлов стилей и скриптов, при верстке шаблонов в систе... Свойство: привязка к Яндекс:Картам - вывести из нескольких элементов ... Просмотров: 18668 Предположим, что у вас есть инфоблок со свойством "Привязка к яндекс картам". В этом инфоб... Массово: применить наценку ко всем товарам каталога с пересчетом от б... Просмотров: 6372 Рассмотрим как, в магазине работающем на 1С-битрикс, массово применить наценку на все това... Сравнение двух типов цен для иммитации системы скидок, в Битрикс Просмотров: 6820 Встала задачка, иммититровать систему скидок в интернет магазине на Битрикс. Из 1С-УТ, на ... Определить местоположение пользователя и показать магазины поблизости... Просмотров: 1831 Задача: в мобильном приложении, которое открывает сайт на 1С-Битрикс внутри себя, нужно оп...