Добавление скриптов, линков и произвольного текста в раздел head

Как правило, чтоб добавить в раздел head код, к примеру такой

 
<link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon.png> <link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png> <link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png> <link rel="manifest" href="/site.webmanifest> <link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5> <meta name="msapplication-TileColor" content="#da532c> <meta name="theme-color" content="#ffffff> 

можно просто найти файл в котором находится раздел head и вписать туда данный код, и он будет работать, конечно «типа эксперты» будут критиковать такой код за то что он не соответствует философии битрикса.

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

Подключение link, meta, scripts в раздел head с помощью класса Asset

И так, с начало найдем файл, в котором будем делать подключение

Как правило это файл header.php который находится в папке темы

/bitrix/templates/ваша_тема/header.php

теперь добавляем код

 
<? 
. . . 
$asset = Asset::getInstance(); 
$asset->addString('<link rel="apple-touch-icon" sizes="76x76" href="'.SITE_TEMPLATE_PATH.'/assets/favicon/apple-touch-icon.png">'); 
$asset->addString('<link rel="icon" type="image/png" sizes="32x32" href="'.SITE_TEMPLATE_PATH.'/assets/favicon/favicon-32x32.png">'); 
$asset->addString('<link rel="icon" type="image/png" sizes="16x16" href="'.SITE_TEMPLATE_PATH.'/assets/favicon/favicon-16x16.png">'); 
$asset->addString('<link rel="manifest" href="'.SITE_TEMPLATE_PATH.'/assets/favicon/site.webmanifest">'); 
$asset->addString('<link rel="mask-icon" href="'.SITE_TEMPLATE_PATH.'/assets/favicon/safari-pinned-tab.svg" color="#5bbad5">'); $asset->addString('<meta name="msapplication-TileColor" content="#da532c">'); 
$asset->addString('<meta name="theme-color" content="#ffffff">'); 
?> 
<!DOCTYPE html> 
<html xml:lang="<?=LANGUAGE_ID?>" lang="<?=LANGUAGE_ID?>" itemscope itemtype="http://schema.org/WebSite"> 
<head> 
. . . 
<?php $APPLICATION->ShowHead(); ?> 
. . . 
</head> 

теперь по подробней

с начало добавляем класс

$asset = Asset::getInstance();

у которого есть такие методы

addString — Метод добавляет строку в секцию head

$asset->addString(««);

addCss — Метод добавляет css в секцию head

$asset->addCss(SITE_TEMPLATE_PATH.’/assets/css/main.css’);

addJs — Метод добавляет js в секцию head

$asset->addJs(SITE_TEMPLATE_PATH.’/assets/lib/jquery/jquery-3.2.1.min.js’);

где, SITE_TEMPLATE_PATH — путь к папке шаблона

после добавления подключений в раздел head, эти данные выводятся уже тут $APPLICATION->ShowHead();

Оцените статью
Добавить комментарий

  1. Laretta

    Спасибо за отличный пост!
    Нашла в нем, как подключать фавиконку (rel=»apple-touch-icon»).
    Успехов вам!

    Ответить