Видеокурс "jQuery от А до Я. Библиотека JavaScritp для начинающих." на Stepik, бесплатно! https://stepik.org/134100

Темизация WordPress 4

Создаём свою тему на WordPress 4

Добрый день дорогие друзья, рад приветсвовать вас в цикле уроков по созданию темы для WordPress 4, с нуля. Данный учебник предназначен для начинающих WordPress специалистов. Работать будем с четвёртой версии WordPress.

Прежде чем начать изучать уроки по темизации WordPress, вы уже должны знать как установить WordPress (локально или на хостинг). Уметь администрировать WordPress: создавать посты и страницы, пользоваться виджетами и плагинами.

Помимо начальных знаний о CMS WordPress, вы также должны уметь верстать сайты (понимать что такое шапка сайта, сайдбар, подвал и т.д.), знать на хорошем уровне языки HTML и CSS.

В цикле уроков учебника по «Самостоятельному созданию своей темы для WordPress», мы научимся:

  1. Разбираться в иерархии шаблонов WordPress
  2. Создавать шаблоны для постов (записей) и страниц
  3. Узнаем что такое цикл и его теги (функции)
  4. Грамотно подключать файлы стилей CSS и скриптов JavaScript
  5. Использовать файл functions.php с помощью которого на сайт внедряются, такие элементы как:
    • Сайдбар с виджетами
    • Произвольное меню
    • Миниатюры
    • Устанавливают правильные пути к файлам CSS и JS
    • и мн.др.
  6. Создавать собственные комментарии для сайта
  7. и много чего ещё интересного…

Итак приступим, для начала проясним некоторые слова, которые будут использоватся в данном учебнике.

Тема — это набор файлов которые формируют дизайн сайта, созданного с помощью WordPress.
Шаблон (файл-шаблон) — это файл, являющийся частью темы WordPress, с помощью файл-шаблонов обозначают как будет выглядеть шапка сайта, сайдбар или подвал, также с помощью шаблонов обозначают как будет вяглядеть главная страница сайта, одиночный пост, одиночная страница, страница категории и т.д.

Где хранятся темы WordPress?

Темы которые установлены в ваш WordPress, хранятся по адресу /wp-content/themes/

Чтобы подключить свою тему к WordPress, нужно в папке themes, создать папку с каким нибудь именем (например mytheme), и в этой папке разместить файл-шаблоны темы.

Первая тема WordPress

Чтобы ваша тема была видна в админке WordPress Внешний -> Темы

Создаём простую тему WordPress

Достаточно всего лишь в папке с вашей темой (например в папке mytheme), разместить 2 пустых файла index.php и style.css, и ваша первая тема уже готова, правда если вы её активируете и перейдете на главную страницу сайта то он окажется пустым.

Файл шаблоны начальной темы.

Чтобы на сайте с вашей темой была видна различная информация (посты, страницы, виджеты, дизайн), нужно файл шаблоны заполнить HTML-тегами и некоторыми WordPress фунциями, написанными на языке PHP. Кстати сразу вам скажу, чтобы создавать темы для CMS WordPress, знать язык PHP хоть и желательно, но вовсе не обязательно.

В данном учебнике создадим простую тему WordPress, где ничего программировать не нужно, просто скопируете и вставите необходимый PHP-код, который встречается практически в каждой теме. В последующих учебниках WordPress, где мы будем создавать более сложные темы, вполне возможно вам уже придётся знать хотябы основы языка PHP.

При создании тем, можете использовать любой удобный вам текстовый редактор файлов: Notepad++, Sublime Text, Brackets и т.п. Я буду использовать Sublime Text. Главное в редакторе не забудьте установить кодировку UTF-8 (без BOM).

В заключение, по первому уроку темизации WordPress

Прежде чем приступить ко второму уроку по созданию тем в WordPress, вы уже должны сделать следующее:

  • Скачать последнюю четвёртую версию CMS WordPress
  • Установить её локально или на хостинг
  • Создать 10 любых записей, можно одинаковых, главное заполнить заголовок и текст
  • Заголовок и тело записи WordPress

  • Создать по адресу /wp-content/themes/ папку с любым именем, например mytheme
  • В папке mytheme создать два пустых файла: index.php и style.css

Читать далее: основные файл шаблоны темы WordPress.

Область видимости переменных

Область видимости переменных в языке JavaScript

Прежде чем читать об области видимости переменных, вам нужно прочитать статью о функциях в JavaScript.

В JavaScript, существует две области видимости: локальная и глобальная. Зависит от того, где объявлена переменная, внутри функции или вне функции.

Если переменная объявлена внутри функции, то она называется локальной, если переменная объявлена вне функции, то она называется глобальной.

Read More

Переменные в JavaScript

Переменная JavaScritp — это именованная область в памяти, которая хранит в себе данные (значение). К этим данным можно получить доступ, обратившись по имени переменной в которой они хранятся.

Создание переменной в JavaScript (объявление)

Прежде чем использовать переменные в JavaScript, их нужно создать:

Read More

Каскадность в CSS

Каскадность – приоритеты стилей в CSS

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

В учебнике по CSS для начинающих, мы узнали что внедрить CSS-код в HTML-документ, можно тремя способами:

Read More

Изучаем блочные элементы

Изучаем блочные элементы с помощью CSS-свойств

Добрый день, в данной статье рассмотрим CSS-свойства, влияющие на ширину и высоту блочных элементов.

  • height:
  • width:
  • margin:
  • padding:
  • border:

Перед и после блочного элемента, браузер автоматически ставит перенос строки, также по-умолчанию блочный элемент занимает всю ширину родительского элемента. В учебнике по HTML, вы можете посмотреть на теги, которые создают блочные элементы.

Read More