В данном уроке будет реализован компонент списка новостей, выводимых из инфоблока. Фактически, это урок на закрепление материала по работе с компонентом списка новостей (мы уже в 3й раз будем его использоват ьи наконец по прямому назначению).
Для начала создадим тип инфоблока "Контент" (id=Content) а в нём инфоблок "Новости" с символьным кодом NEWS (процесс создания типа инфоблока показан в Уроке 3, а процесс создания инфоблока в уроках 3 и 7).
Важным отличием от предыдущих уроков станет то, что мы настроим параметры URL и поставим галочки для обоих пунктом индексации модулем поиска:
Будем пока считать, что новости будут находиться в одном инфоблоке и будут разбиты по различным разделам (в случае, если это не так, наша задача будет только проще, поскольку можно будет убрать часть, отвечающую за Символьный код раздела.
Во вкладке поля зададим:
- Обязательной привязку к разделам
- Дата начала активности = "текущие дата и время"
- Обязательность символьного кода (и генерацию транслитерацией или с помощью внешнего сервиса переводов)
Теперь на нашей тестовой странице разместим компонент bitrix:news.list и скопируем шаблон .default в шаблон сайта, переименовав в main_page_newslist.
Обратим в параметрах компонента внимание на "Формат показа даты" - этим пунктом мы воспользуемся для формирования даты по образцу из макета.
Так же в параметрах компонента (.parameters.php) зададим 1 новый параметр - NEWSLIST_TITLE - Заголовок новостной ленты.
Код новостной ленты в HTML макете выглядит:
<h4 class="indent-2">Latest News:</h4>
<ul class="list-news">
<li>
<a href="#" class="btn btn_">Apr 21, 2012</a>
<p class="text-info">Praesent vestibulum molestie lacus. Aenean nonummy hendrerit mauris. Phasellus porta.</p>
Praesent vestibulum molestie lacus. Aenean nonummy hendrerit mauris. Phasellus porta. Fusce suscipit varius mi. <a href="#" class="underline">>></a>
</li>
<li>
<a href="#" class="btn btn_">Apr 21, 2012</a>
<p class="text-info">Aenean nonummy hendrerit mauris</p>
Fusce suscipit varius mi. Cum sociis natoque penatibus et magnis dis parturient montes. <a href="#" class="underline">>></a>
</li>
<li>
<a href="#" class="btn btn_">Apr 21, 2012</a>
<p class="text-info">Phasellus porta. Fusce suscipit varius mi. Cum sociis natoque penatibus et magnis dis parturien.</p>
Fusce suscipit varius mi. Cum sociis natoque penatibus et magnis dis parturient montes. <a href="#" class="underline">>></a>
</li>
</ul>Тогда код шаблона после интеграции этой разметки станет:
<?if(!defined("B_PROLOG_INCLUDED") || B_PROLOG_INCLUDED!==true)die();?>
<h4 class="indent-2"><?=$arParams['NEWSLIST_TITLE']?>:</h4>
<ul class="list-news">
<?if($arParams["DISPLAY_TOP_PAGER"]):?>
<?=$arResult["NAV_STRING"]?><br />
<?endif;?>
<?foreach($arResult["ITEMS"] as $arItem):?>
<?
$this->AddEditAction($arItem['ID'], $arItem['EDIT_LINK'], CIBlock::GetArrayByID($arItem["IBLOCK_ID"], "ELEMENT_EDIT"));
$this->AddDeleteAction($arItem['ID'], $arItem['DELETE_LINK'], CIBlock::GetArrayByID($arItem["IBLOCK_ID"], "ELEMENT_DELETE"), array("CONFIRM" => GetMessage('CT_BNL_ELEMENT_DELETE_CONFIRM')));
?>
<li id="<?=$this->GetEditAreaId($arItem['ID']);?>">
<?if($arParams["DISPLAY_DATE"]!="N" && $arItem["DISPLAY_ACTIVE_FROM"]):?>
<a <?if(!$arParams["HIDE_LINK_WHEN_NO_DETAIL"] || ($arItem["DETAIL_TEXT"] && $arResult["USER_HAVE_ACCESS"])):?>href="<?echo $arItem["DETAIL_PAGE_URL"]?>" <?endif;?>class="btn btn_"><?echo $arItem["DISPLAY_ACTIVE_FROM"]?></a>
<?endif?>
<?if($arParams["DISPLAY_PICTURE"]!="N" && is_array($arItem["PREVIEW_PICTURE"])):?>
<?if(!$arParams["HIDE_LINK_WHEN_NO_DETAIL"] || ($arItem["DETAIL_TEXT"] && $arResult["USER_HAVE_ACCESS"])):?>
<a href="<?=$arItem["DETAIL_PAGE_URL"]?>"><img class="preview_picture" border="0" src="<?=$arItem["PREVIEW_PICTURE"]["SRC"]?>" width="<?=$arItem["PREVIEW_PICTURE"]["WIDTH"]?>" height="<?=$arItem["PREVIEW_PICTURE"]["HEIGHT"]?>" alt="<?=$arItem["NAME"]?>" title="<?=$arItem["NAME"]?>" style="float:left" /></a>
<?else:?>
<img class="preview_picture" border="0" src="<?=$arItem["PREVIEW_PICTURE"]["SRC"]?>" width="<?=$arItem["PREVIEW_PICTURE"]["WIDTH"]?>" height="<?=$arItem["PREVIEW_PICTURE"]["HEIGHT"]?>" alt="<?=$arItem["NAME"]?>" title="<?=$arItem["NAME"]?>" style="float:left" />
<?endif;?>
<?endif?>
<?if($arParams["DISPLAY_NAME"]!="N" && $arItem["NAME"]):?>
<?if(!$arParams["HIDE_LINK_WHEN_NO_DETAIL"] || ($arItem["DETAIL_TEXT"] && $arResult["USER_HAVE_ACCESS"])):?>
<p class="text-info"><?echo $arItem["NAME"]?></p>
<?else:?>
<p class="text-info"><?echo $arItem["NAME"]?></p>
<?endif;?>
<?endif;?>
<?if($arParams["DISPLAY_PREVIEW_TEXT"]!="N" && $arItem["PREVIEW_TEXT"]):?>
<?echo $arItem["PREVIEW_TEXT"];?>
<?endif;?>
<?if(!$arParams["HIDE_LINK_WHEN_NO_DETAIL"] || ($arItem["DETAIL_TEXT"] && $arResult["USER_HAVE_ACCESS"])):?><a href="<?echo $arItem["DETAIL_PAGE_URL"]?>" class="underline">>></a><?endif;?>
<?if($arParams["DISPLAY_PICTURE"]!="N" && is_array($arItem["PREVIEW_PICTURE"])):?>
<div style="clear:both"></div>
<?endif?>
<?foreach($arItem["FIELDS"] as $code=>$value):?>
<small>
<?=GetMessage("IBLOCK_FIELD_".$code)?>: <?=$value;?>
</small><br />
<?endforeach;?>
<?foreach($arItem["DISPLAY_PROPERTIES"] as $pid=>$arProperty):?>
<small>
<?=$arProperty["NAME"]?>:
<?if(is_array($arProperty["DISPLAY_VALUE"])):?>
<?=implode(" / ", $arProperty["DISPLAY_VALUE"]);?>
<?else:?>
<?=$arProperty["DISPLAY_VALUE"];?>
<?endif?>
</small><br />
<?endforeach;?>
</li>
<?endforeach;?>
<?if($arParams["DISPLAY_BOTTOM_PAGER"]):?>
<br /><?=$arResult["NAV_STRING"]?>
<?endif;?>
</ul>
В шаблон практически не внесено изменений, удалявших бы старый код, характерный для шаблона .default - в данном случае это сделано в ущерб лаконичности и чистоте кода для того, чтобы оставить возможность использовать функционал, как правило характерный для новостных лент.
Поскольку раньше мы с помощью этого компонента реализовывали совсем другой функционал, то потребности в этом не было.
Теперь осталось тогда на главной странице внури блока class="span4" вызвать компонент ленты новостей:
<?$APPLICATION->IncludeComponent("bitrix:news.list", "main_page_newslist", array(
"IBLOCK_TYPE" => "-",
"IBLOCK_ID" => "NEWS",
"NEWS_COUNT" => "20",
"SORT_BY1" => "ACTIVE_FROM",
"SORT_ORDER1" => "DESC",
"SORT_BY2" => "SORT",
"SORT_ORDER2" => "ASC",
"FILTER_NAME" => "",
"FIELD_CODE" => array(
0 => "",
1 => "",
),
"PROPERTY_CODE" => array(
0 => "",
1 => "",
),
"CHECK_DATES" => "Y",
"DETAIL_URL" => "",
"AJAX_MODE" => "N",
"AJAX_OPTION_JUMP" => "N",
"AJAX_OPTION_STYLE" => "N",
"AJAX_OPTION_HISTORY" => "N",
"CACHE_TYPE" => "A",
"CACHE_TIME" => "36000000",
"CACHE_FILTER" => "N",
"CACHE_GROUPS" => "Y",
"PREVIEW_TRUNCATE_LEN" => "",
"ACTIVE_DATE_FORMAT" => "f j, Y",
"SET_TITLE" => "N",
"SET_STATUS_404" => "N",
"INCLUDE_IBLOCK_INTO_CHAIN" => "N",
"ADD_SECTIONS_CHAIN" => "N",
"HIDE_LINK_WHEN_NO_DETAIL" => "N",
"PARENT_SECTION" => "",
"PARENT_SECTION_CODE" => "",
"INCLUDE_SUBSECTIONS" => "Y",
"DISPLAY_TOP_PAGER" => "N",
"DISPLAY_BOTTOM_PAGER" => "N",
"PAGER_TITLE" => "Новости",
"PAGER_SHOW_ALWAYS" => "N",
"PAGER_TEMPLATE" => "",
"PAGER_DESC_NUMBERING" => "N",
"PAGER_DESC_NUMBERING_CACHE_TIME" => "36000",
"PAGER_SHOW_ALL" => "N",
"DISPLAY_DATE" => "Y",
"DISPLAY_NAME" => "Y",
"DISPLAY_PICTURE" => "Y",
"DISPLAY_PREVIEW_TEXT" => "Y",
"NEWSLIST_TITLE" => "Новости",
"AJAX_OPTION_ADDITIONAL" => ""
),
false
);?>При необходимости мы можем, как и в предыдущем уроке воспользоваться фильтром для вывода новостей только какого-то конкретного раздела инфоблока.
Как всегда демо-данные для инфоблока, представлены в нашем репозитории в виде XML.
- Папка с демо-данными - IMPORT_DATA
- Подпапка с символьным кодом инфоблока содержит XML для импорта, а так же набор картинок (если они есть).
Результаты урока, как всегда в нашем репозитории на .
