ДОСТИГНУТО:

01.11.2016-300 страниц в индексе Google;
19.01.2017-300 страниц в индексе Яндекса;
03.02.2017-40 ТИЦ;
05.02.2017- сайт принят в DMOZ каталог;

Как подключить CSS файл к WordPress

.

Всем привет!

Подключение CSS файла к WordPress не многим отличается от стандартного подключения в нединамической (обычной) HTML странице. Но все-же есть ньюансы и отличия, о которых и пойдет речь в данной статье.

Для начала приведу основные способы подключения СSS к HTML файлу. То-есть сначала рассмотрим обычное, стандартное подключение стилей к сайту, это пригодится в дальнейшем.

Чтобы подключить CSS файл к обычной HTML странице нужно:


Первый способ подключения CSS к HTML странице

Между тегами

прописать следующий код:

Тут все довольно просто, css — это папка, куда помещен файл стилей,reset.css — сам подключаемый файл.

Или так, с указанием полного адреса URL нахождения стилевого файла:

Данным кодом можно подключить любой css файл, даже если он размещен на стороннем ресурсе.


Второй способ подключения CSS к HTML странице

Можно подключить CSS файл через @import. В данном случае подключаемый файл импортируется в основной файл CSS, дополняя его.

Для этого нужно в самом начале style.css (см. название своего файла) прописать следующий код:

Или для стороннего файла стилей, с указанием полного адреса:

Как видно из примера, в код подключения просто вставляется ссылка на сторонний ресурс.

Может пригодиться статья — Как прописать правильный путь к папке с файлом.

Из личного опыта

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

В этой статье я не буду затрагивать такие моменты как «точечное подключение» или компановка стилей в HTML файле. А лучше перейду к главному.

Как подключить CSS файл к WordPress

Подключать файлы CSS к WordPress можно и выше приведенными способами, но правильнее будет последовать следующим примерам.


Первый способ подключить CSS файл к WordPress

Открываем файл header.php и сразу перед закрывающим тегом </head>нужно прописать такой код:

Это то-же самое, что и в верхнем примере, только написано на языке PHP. Нужно только правильно прописать путь к папке и файлу /css/reset.css.

Но самым правильным способом считается подключение CSS файлов к сайту на WordPress является нижеприведенный пример.


Регистрация CSS файлов в WordPress

Дабы избежать подключения одного и того-же файла CSS несколько раз, разработчики WordPress придумали функцию wp_register_style. Дублирование стилевых файлов может возникать, если к примеру несколько плагинов подключают одни и те же стили.

Добавляем в файл functions.php этот код:

Ну и рассмотрим, что нужно минимально знать и учитывать при подключении CSS файла к WordPress используя данную функцию.

function my_style_load ()my_style_load — название функции, можете придумать свое, пишется без пробелов в нижнем регистре букв и без знака — (тире). Обратите внимание, что встречается оно в коде два раза.

$theme_uri = get_template_directory_uri ();get_template_directory_uri(); значит, что подключаемый файл должен обязательно находится внутри папки вашей темы, в директории шаблона.

wp_register_style (‘my_theme_style’, $theme_uri.’/css/reset.css’, false, ‘0.1’);my_theme_style идентификатор стилей, может быть произвольным.

/css/my-style.css — это как можно догадаться, путь к папке и название подключаемого CSS файла.

Вот и все, стоит потратить 5-10 минут и немного разобраться просто что-где прописывать и ваши стили CSS не будут загружаться по два раза.

Если вы уверены, что к сайту не подключен подобный CSS файл, то для подключения подойдут все способы указанные в статье. Выбирайте какой нравится!

На этом на сегодня все друзья.

БЕРЕГИТЕ СЕБЯ!




лайк

Эти красотки хотят чтобы ты их жестко лайкнул и даже несколько раз твитнул!

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *