Добавление новых CSS, JS или шрифтов
В этом уроке будет показано, как вы можете добавить собственные шрифты, CSS и JavaScript файлы в ваш шаблон, построенный на технологии Warp Framework.
Единый конфигурационный файл /layouts/template.config.php улучшает возможности настройки шаблона путем обеспечения инициализаций всех необходимых файлов в одном месте. Он инициализирует все PHP классы, загружает все необходимые CSS и JavaScript, а также специфичные файлы, необходимые для работы шаблона на браузере Internet Explorer. Если вам необходимо загрузить собственные CSS или JS файлы, этот файл - именно то место, где вы можете это сделать.
Если вы создаете стиль шаблона и захотели добавить некоторые активные элементы, вы можете переопределить стандартный файл template.config.php. Просто скопируйте файл /layouts/template.config.php в /styles/YOUR_STYLES/layouts/template.config.php
Добавление CSS файла
Кофигурационный файл template.config.php загружает все шаблонные CSS файлы. Если вы захотели добавить собственный CSS файл, например, /css/my.css, вы можете сделать это используя следующий синтаксис:
// load css
$this['asset']->addFile('css', 'css:my.css');
Добавление JAVASCRIPT файла
Если вы захотели добавить собственный JS файл, например my.js, просто скопируйте его в папку /js шаблона и добавьте следующий код в файл template.config.php:
// add javascripts
$this['asset']->addFile('js', 'js:my.js');
Добавление шрифта
Иногда вам может понадобится собственный шрифт в шаблон Warp Framework, для этого нкобходимо выполнить несколько шагов. FontSquirrel имеет хороший сервис, где вы можете выбратьмежду многими веб-шрифтами и вы можете даже загрузить свой шрифт с вашего ПК и произвести его трансформацию в веб-шрифт, благодаря этому сервису.Но помните, уважайте авторские шрифты, ведь не каждый шрифт создан технически и может свободно распространяться.
На заметку: Выберите шрифт, который поддерживает надстройку/символьную кодировку MacRoman , если вы хотите использовать французский, испанский или другие латинские языки.
Добавление шрифта в ваш шаблон
Положите файлы вашего шрифта в папку /fonts шаблона. Создайте CSS файл, который включает шрифт и дайте этому файлу какое-нибудь подходящее имя, например fontname.css. Измените файл /layouts/template.config.php и добавьте новую строчку в раздел загрузки шрифтов:
Обновление файла config.xml шаблона сделает шрифт доступным в настройках шаблона. Для выбора шрифта доступны 3 варианта (Body (шрифт "тела" страницы), Header (шрифт заголовков страницы), Menu (шрифт меню)). Просто добавьте новую опцию в параметр нужного шрифта (font1, font2 или font3). В следующем примере мы зададим для нового шрифта параметр Body (шрифт тела страницы).
// load fonts
$this['asset']->addFile('css', 'template:fonts/myfont.css');
<field name="font1" type="list" default="default" label="Body Font" description="Select the main body typeface.">Затем создайте файл myfont.css для вашего шрифта в папке /css/font1.Этот файл определяет все селекторы, которые нужны вам, чтобы применить новый шрифт. Убедитесь, что файлы существуют в папке, потому как вы хотите установить myfont.css по тому же пути. Продолжим наш пример и определим шрифт "тела" страницы в файле myfont.css, например так:
<option value="arial">Arial</option>
<option value="lucida">Lucida</option>
...
<option value="myfont">My Font</option>
body { font-family: "MyFontRegular"; }
