Создание и защита сайта средствами CMS WordPress

Авторы учебного курса:
Перминов Павел Андреевич,
студент гр. ЗКТ-402С ФГАОУ ВО «РГППУ»
Власова Наталья Сергеевна,
доцент кафедры информационных систем и технологий РГППУ




Урок 1. Установка WordPress. Настройка шаблона

Цель:

Установить CMS WordPress на локальный сервер, и создать сайт с настройкой шаблона.

Задачи:

• Исследовать программное обеспечение CMS WordPress
• Научиться создавать сайт средствами CMS WordPress
• Научиться настраивать сайт
• Научиться изменять шаблон сайта

Создание сайта средствами CMS  WordPress на сегодняшний день является одним из самых востребованных заказов для веб-разработчиков. WordPress (вордпресс) может обеспечить практически любой функционал сайта и наиболее популярен по сравнению с другими системами управления контентом. В каждой веб-студии есть услуги по разработке сайтов на вордпресс. Поэтому изучение этой CMS включается почти в каждый учебный курс по веб-технологиям.

Загрузка и размещение дистрибутива на локальном сервере

1. Загрузите и распакуйте дистрибутив WordPress версии 5.5.3. Мы используем не самую последнюю версию, чтобы в ходе обучения потом научиться обновлять WordPress до последней актуальной версии.

2. Необходимо запустить OpenServer или другой локальный сервер, который установлен на Вашем компьютере. 

3. Если у Вас установлен OpenServer далее находим папку OSPanel/domains и в ней создаем папку. Название папки – это домен Вашего сайта, пусть это будет название — mysite.ru (рисунок 1).

Картинка
Рисунок 1 - Создание папки

4. Скопируйте архив в дистрибутивом WordPress в папку mysite.ru (рисунок 2).

Картинка
Рисунок 2 - Адресный путь

5. Теперь необходимо распаковать архив с WordPress в эту же папку mysite.ru, как на рисунке 3.

Картинка
Рисунок 3 - Распаковка архива

Создание базы данных и пользователя

6. Создайте новую базу данных для сайта, для этого в трее OpenServer выберите Дополнительно - PhpMyAdmin (рисунок 4). В последующем окне введите логин root без пароля.

Картинка
Рисунок 4 - Localhost

Далее на этом сайте нажимаем Базы данных. Откроется список баз данных (рисунок 5).

Картинка
Рисунок 5 - Базы данных

Необходимо создать новую базу данных, для этого в разделе Создать базу данных прописываем название, пусть это будет mysite. Рядом находится поле, в котором необходимо выбрать сравнение, выбираем utf8_general_ci и нажимаем создать (рисунок 6).

Картинка
Рисунок 6 - Создание базы данных

7. Для работы с новой базой данных необходимо перезапустить OpenServer (рисунок 7).

Картинка
Рисунок 7 - Перезапус OpenServer

8. После перезагрузки OpenServer, открываем сайт, по ссылке http://mysite.ru/ (рисунок 7).

Картинка
Рисунок 7 - Сайт

Нажимаем Вперёд!, откроется новое окно (рисунок 8).

Картинка
Рисунок 8 - Настройки сайта

Заполняем поля, аналогично изображению на рисунке 9, после нажимаем Отправить:

- имя базы данных – прописываем название базы, которое мы дали в 6 пукте (mysite);
- имя пользователя – вписываем имя пользователя базы данных (root);
- пароль – сюда нужно вписать пароль от базы данных (пароля нет);
- сервер базы данных – оставляем значение по умолчанию;
- префикс таблиц – также оставляем все по умолчанию.

Картинка
Рисунок 9 - Ввод данных

9. Если все данные заполнены правильно, то открывается новое информативное окно (рисунок 10).

Картинка

Рисунок 10 - Запуск установки

Нажимаем Запустить установку, откроется новое окно (рисунок 11).

Картинка
Рисунок 11 - Запуск установки

10. Вновь заполняем поля, на этот раз аналогично изображению на рисунке 12, после нажимаем Установить WordPress:

- название сайта – прописываем, указанный ранее в 6 пукте mysite
- имя пользователя – прописываем пользователя admin
- пароль – прописываем пароль Siteadm123
- ваш e-mail – указываем актуальную почту;
- видимость для поисковых систем – оставляем по умолчанию, так как сайт устанавливаем на локальном сервере и его видимость в любом случаи будет не доступна.

Картинка

Рисунок 12 - Ввод учётных данных

Если все данные заполнены правильно, то открывается новое информативное окно (рисунок 13).

Картинка

Рисунок 13 - Запуск установки

Нажимаем Запустить установку. Откроется окно с сообщение успешной установки WordPress (рисунок 14).

Картинка

Рисунок 14 - WordPress установлен

Теперь при переходе по ссылке http://mysite.ru/ должен открыться сайт, изображенный на рисунке 15.

Картинка
Рисунок 15 - Установленный сайт

Настройка шаблона

11. На данный момент установка WordPress закончена, стал доступен сайт и его администрирование.
По умолчанию установлен стандартный шаблон, который нам не подходит. Для его настройки необходимо войти под учётной записью администратора. Чтобы был доступен ввод учетных данных, переходим по ссылке http://mysite.ru/wp-admin/.

Откроется окно, изображенное на рисунке 13.

Картинка

Рисунок 13 - Ввод учётной записи администратора

12. Выбирать тему (или шаблон) WordPress можно как из официальных бесплатных вариантов, так и скачивать со сторонних ресурсов.

В целях безопасности и нормальной оптимизации сайта,установите заранее проверенный подготовленный шаблон GeekVillage, который находится в папке WP-dop в архиве GeekVillage.zip.

В меню Темы нажимаем Добавить новую (рисунок 14).

Картинка
Рисунок 14 - Новая тема

Далее выбираем Загрузить тему и прикрепляем ранее скачанную тему (рисунок 15).

Картинка
Рисунок 15 - Загрузка темы

Нажимаем Установить, в результате будет окно, информирующее об успешной установке новой темы (рисунок 16).

Картинка
Рисунок 16 - Новая тема установлена

Далее нажимаем Активировать. В конечном результате при переходе по ссылке http://mysite.ru/ должен открыться сайт, изображенный на рисунке 17.

Картинка
Рисунок 17 - Сайт с новой темой

Вопросы для самоконтроля

1. OpenServer - это
2. Для функционирования сайта на локальном сервере необходимо создать ______
3. После изменения настроек на локальном сервере не открывается сайт, первым делом необходимо выполнить restart ______
4. Не рекомендуется скачивать тему для WordPress из интернета, потому что _______
5. Если создать папку по адресу C:\WebServers\home\ , то ее название будет являться ___________