Template - uniqcle/Bitrix GitHub Wiki

Adding New Template

  1. Добавляем папку local->templates->skillbox

  2. Добавляем файлы header.php и footer.php

  3. В Настройки-Настройки продукта-Сайты-Шаблоны сайтов появляется новый шаблон

Можно туда зайти и пересохранить. Тогда на сервере появятся файлы description.php и файлы стилей

  1. В Сайты-Список сайтов-s1 подключаем шаблон по нужному условию

Including Assets

  1. Переносим все файлы html img, css, js в шаблон
  2. Подключаем header

CUtil::GetAdditionalFileURL для того чтобы правильно работало облачное кеширование 

<?php use \Bitrix\Main\Page\Asset; ?>
<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="utf-8">
    <title><?php $APPLICATION->ShowTitle(); ?></title>

    <?php
    $APPLICATION->ShowHead();

    Asset::getInstance()->addCss( CUtil::GetAdditionalFileURL(SITE_TEMPLATE_PATH.'/css/application.css') );

    Asset::getInstance()->addString("<meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\">");
    Asset::getInstance()->addString("<meta name=\"viewport\" content=\"width=1250\">");
    Asset::getInstance()->addString("<link href=\"https://fonts.googleapis.com/css?family=Roboto:400,400italic,500,500italic,700,700italic&subset=latin,cyrillic\" rel=\"stylesheet\" type=\"text/css\">");

    Asset::getInstance()->addJs( CUtil::GetAdditionalFileURL(SITE_TEMPLATE_PATH.'/js/jquery.js') );
    Asset::getInstance()->addJs( CUtil::GetAdditionalFileURL(SITE_TEMPLATE_PATH.'/js/application.min.js') );
    ?>


    <!--[if lt IE 9]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
</head>
<body>
<div id = "panel">
    <?php $APPLICATION->ShowPanel(); ?>
</div>
...

Assets Component

Подключение CSS и JS файлов в компоненте в template.php:

<? if (!defined('B_PROLOG_INCLUDED') || B_PROLOG_INCLUDED !== true) die();

  $this->addExternalCss($templateFolder."/css/owl.carousel.css");
  $this->addExternalCss($templateFolder."/css/owl.theme.default.css");

  $this->addExternalJS( $templateFolder.'/js/jquery.min.js' );
  $this->addExternalJS( $templateFolder.'/js/owl.carousel.js' );
  ?>

в component_epilog.php

$this->getTemplate()->addExternalCss("/local/addcss.css");

Additional

⚠️ **GitHub.com Fallback** ⚠️