Как сделать подключение bootstrap к wordpress?

Опубликовано: 08.10.2017

видео Как сделать подключение bootstrap к wordpress?

Как создать шаблон для WordPress. Грамотная посадка верстки на WordPress (Right Way)

Очередная статья из рубрики «подключение чего-то к чему-то» На этот раз рассмотрим подключение Bootstrap к wordpress. Если вы интересуетесь этим вопросом, то наверняка понимаете, что обозначают эти слова. Bootstrap — это css-фреймворк, в разы упрощающий нам верстку веб-страниц, а wordpress — сайтовый движок, упрощающий управление сайтами. Обзор фреймворка вы можете почитать здесь .


Bootstrap - 1 Урок. Знакомство и установка

Как скачать Bootstrap?

Для начала скачайте себе фреймворк. Для этого перейдите на официальный сайт бутстрапа — getbootstrap.com . Он на английском языке, но ничего, не пугайтесь этому. Перейдите на вкладку Getting Started, там вам будет предложено 3 варианта скачивания фреймворка. Скорее всего, вас устроить пока первый вариант.


#2. Создание основы шаблона. Подключение Bootstrap.

На данный момент актуальная версия бутстрапа — 3.3.7. Впрочем, вы можете прочитать эту статью через год и тогда уже это будет устаревшая версия. Но способ подключения к wordpress не изменится, поэтому все равно можете читать дальше.

Итак, после скачивания распакуйте архив, там у вас должно быть три папки. Это и есть содержимое фреймворка:

К слову, если вы не хотите скачивать все компоненты фреймворка целиком, а только нужные вам, тогда вам пригодится эта страница:

Customize

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

Устанавливаем Bootstrap на wordpress

Во-первых, все три папки нужно скопировать в ваш активный wordpress-шаблон. Для этого соединитесь с сервером через ftp, ssh или панель управления на хостинге, и скиньте эти папки.

Далее в корневой папке активного шаблона найдите файл functions.php. Именно его нам предстоит редактировать, чтобы правильным образом подключить файлы фреймворка. Собственно, чтобы все компоненты бутстрапа работали, необходимо подключить bootstrap.css и bootstrap.js, либо минифицированные копии этих файлов.

rss