Здравствуйте, сегодня поговорим как подключить к сайту еще один файл стилей CSS.
Скачать исходники для статьи можно ниже
Для начала давайте рассмотрим как же создать свой собственный файл стилей CSS?
Достаточно просто!
Можно воспользоваться обычным “Блокнотом” (“Пуск”-“Все программы”-“Стандартные”-“Блокнот”) или редактором кода, такими как Notepad, Dreamweaver.
В данном примере буду пользоваться обычным Блокнотом.
Допустим напишем простенький CSS код для нашего будущего файла стилей.
Теперь сохраним его, при сохранении выбираем в строке “Тип файла” – “Все файлы”, в строке “Кодировка” – UTF-8, а в строке “Имя файла” – moicss.css.
Все файл стилей создан.
Теперь можно его закачать на сайт через пункт “Медиафайлы” админпанели, но тогда мы не сможем его редактировать через панель управления.
Поэтому советую воспользоваться FTP-загрузчиком, например FileZilla, и перекинуть созданный нами в данной статье файл стилей moicss.css в папку активной темы сайта, например, если активная тема моего тестового сайта называется “Portocal”, то файл moicss.css я закачиваю по следующему пути /wp-content/themes/Portocal.
И сейчас, если открыть “Редактор” (Панель управления -“Внешний вид” – “Редактор”), то справа в списке шаблонов я увижу свой еще один файл стилей: moicss.css
Выбрав его, я могу без особых усилий редактировать и сохранять его код.
Далее разберемся как подключить наш новый файл стилей непосредственно к сайту?
Для начала нам нужно открыть файл header.php, для этого входим в панель управления сайтом, в левом меню выбираем пункт “Внешний вид” и его подпункт “Редактор”, справа в списке шаблонов ищем файл header.php, в его коде ищем строчки:
... <link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" /> ...
Вот после данной строчки и добавим свой файл стилей, например так:
... <link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>" /> <link rel="stylesheet" type="text/css" href="http://mnogoblogru.hostenko.com/wp-content/themes/Portocal/moicss.css" /> ...
То есть мы указали нашей активной теме сайта использовать также помимо основного файла стилей (style.css) еще и созданный нами файл moicss.css, который находится по следующему url: “http://mnogoblogru.hostenko.com/wp-content/themes/Portocal/moicss.css”.
Аналогично можно подключать любой другой файл стилей, который может храниться не только на вашем сайте, но и на любом другом, достаточно указать до него путь.
