Полное руководство по установке веб-сервера и WordPress на локальном хосте

Любой разработчик WordPress должен иметь возможность разрабатывать на локальном веб-сервере. Это быстрый и прямой способ увидеть ваш код в действии. В этом посте я расскажу об установке и настройке приложения веб-сервера на вашем компьютере (как в Windows, так и в MacOS), в том числе о том, как решить проблемы, которые могут возникнуть.

Существует множество решений для настройки локального веб-сервера, например, с помощью Docker, Vagrant или простого приложения веб-сервера. Последнее, безусловно, самое простое. В этом посте будет описан процесс настройки WampServer для Windows и XAMPP для MacOS. Перейдите к операционной системе вашего компьютера:

Установка WampServer в Windows

Установить веб-сервер для Windows довольно просто. В основном речь идет о следовании мастеру установки, поэтому я не буду здесь вдаваться в подробности.

Первым шагом является загрузка приложения веб-сервера. Нажмите на ссылку, чтобы перейти на веб-страницу WampServer, и нажмите «Загрузить» в меню.

У вас есть выбор: установить 64-битную или 32-битную версию. Большинство компьютеров сегодня поддерживают 64-битную версию, поэтому я бы выбрал ее. После нажатия кнопки загрузки появится всплывающая форма, но вы можете просто щелкнуть ссылку вверху с надписью «вы можете загрузить ее напрямую». Это приведет вас к фактической загрузке.

После загрузки файла щелкните .exe-файл, чтобы начать установку. Следуйте процессу установки. Имейте в виду, что место, которое вы выберете для установки WampServer, — это место, где вам нужно будет разместить файлы WordPress и любые другие проекты веб-сайтов, которые вы, возможно, захотите сделать. Если он спросит у вас браузер по умолчанию, выберите программу браузера (обычно находится в подпапке в C:Program Files (x86)).

Когда установка завершится и WampServer запустится, он появится в системном трее Windows (правая часть панели задач, по часам).

Когда значок зеленый, WampServer успешно запускает веб-сервер. Когда он оранжевый или красный, сервер отключен. Щелкните значок WampServer в трее, чтобы настроить и запустить/перезапустить/остановить службы.

Чтобы проверить, работает ли веб-сервер, откройте браузер и перейдите по адресу http://localhost/. Вы должны увидеть домашнюю страницу WampServer.

Если вы успешно запустили веб-сервер, сразу переходите к разделу «Установка WordPress »! Если что-то пошло не так, загляните в раздел «Возможные проблемы и исправления для WampServer», чтобы попытаться решить проблему.

Установка XAMPP на MacOS X

Настройка веб-сервера и обеспечение правильной работы WordPress на MacOS, безусловно, является сложной задачей. После того, как я сделал это пару раз, я нашел процесс с наименьшим количеством шагов и лучшим результатом.

Перейдите на веб-сайт XAMPP и найдите большую зеленую область загрузки. Нажмите «XAMPP для OS X».

Следуйте инструкциям по установке и, когда появится запрос, перетащите значок в папку «Приложения». Нажмите «Открыть» в диалоговых окнах, которые спрашивают, действительно ли вы хотите открыть приложение, загруженное из Интернета. Когда настройка завершена, запустите приложение XAMPP из Launcher.

Когда XAMPP запустится в первый раз, вам нужно будет нажать кнопку «Пуск».

Через некоторое время индикатор должен изменить цвет с красного на зеленый, и вы должны увидеть свой IP-адрес. На данный момент веб-сервер и сервер базы данных запущены и работают с предоставленным IP-адресом. Но мы хотим использовать хороший URL-адрес локального хоста вместо IP-адреса. Перейдите на вкладку «Сеть» и в строке «localhost:8080» нажмите кнопку «Включить».

После того, как эта строка станет зеленой, откройте URL-адрес http://localhost:8080/ в своем браузере. Вы должны увидеть страницу приветствия XAMPP. Это означает, что веб-сервер запущен и работает.

Чтобы получить доступ к папке веб-проекта, где вы будете размещать WordPress и любые другие файлы проекта, вам нужно перейти на вкладку Volumes в XAMPP. Нажмите кнопку «Монтировать».

Теперь XAMPP должен успешно запускать веб-сервер и сервер базы данных MySQL, готовые к установке WordPress. Следуйте приведенным ниже шагам для установки WordPress, так как для правильной работы XAMPP требуется несколько дополнительных шагов.

Установка WordPress (как WampServer, так и XAMPP)

Перейдите на страницу загрузки WordPress и нажмите синюю кнопку загрузки. Он должен предоставить вам zip-файл, который после распаковки создаст папку «wordpress» со всеми файлами, необходимыми для работы WordPress.

Переместите загруженный zip-файл в wwwпапку (для WampServer) / htdocsпапку (для XAMPP). Разархивируйте загруженный zip-файл. Когда он будет разархивирован, у вас должна быть подпапка «wordpress» внутри папки вашего веб-сервера. Это означает, что WordPress будет доступен по URL-адресу http://localhost/wordpress/ (для WampServer) / http://localhost:8080/wordpress/ для (XAMPP). Однако вы можете переименовать папку, если хотите.

Следующий шаг — создание базы данных для WordPress. И WampServer, и XAMPP автоматически устанавливают phpMyAdmin, чтобы вы могли получить доступ к базам данных. Для WampServer: щелкните значок WampServer на панели задач и нажмите «phpMyAdmin» или перейдите по URL-адресу http://localhost/phpmyadmin. Для XAMPP: войдите в phpMyAdmin, либо перейдя по URL- адресу http://localhost:8080/phpmyadmin, либо щелкнув пункт меню «phpMyAdmin» в правом верхнем углу на странице приветствия XAMPP по адресу http://localhost:8080. Войдите в систему с именем пользователя «root» и пустым паролем (оба веб-сервера).

На боковой панели слева нажмите «Создать», чтобы создать новую базу данных. Введите желаемую базу данных (например, «wordpress») и параметры сортировки базы данных (utf8_general_ciхороший выбор).

После создания базы данных вы можете закрыть phpMyAdmin. Следующим шагом является настройка конфигурационного файла WordPress.

Перейдите в папку WordPress. Сделайте копию файла wp-config-sample.phpи переименуйте копию в wp-config.php. Откройте wp-config.phpи отредактируйте следующие строки (при условии, что имя вашей базы данных ‘ wordpress‘);

• define( 'DB_NAME', 'wordpress' );
• define( 'DB_USER', 'root' );
• define( 'DB_PASSWORD', '' );

Остальное оставьте как есть, сохраните и закройте файл.

В браузере перейдите по адресу http://localhost/wordpress/ (WampServer) / http://localhost:8080/wordpress/ (XAMPP) — или любой другой папке, в которую вы распаковали WordPress. Вас должен приветствовать экран установки WordPress. Следуйте инструкциям по настройке установки WordPress.

Для пользователей Windows/WampServer вы успешно установили WordPress! Если вы столкнулись с проблемами, ознакомьтесь с разделом «Возможные проблемы и исправления для WampServer ».

К сожалению, для пользователей MaxOS/XAMPP есть несколько дополнительных шагов, чтобы заставить WordPress работать правильно — перейдите к следующему шагу.

Устранение проблем с запуском WordPress на XAMPP

При установке плагинов/тем запрашивается информация о FTP

Если вы попытаетесь установить плагин, вы можете получить это диалоговое окно с запросом учетных данных FTP:

Решение, которое я нашел, решает эту проблему, редактируя ваш wp-config.phpфайл. Сразу после WP_DEBUGопределения добавьте эту строку

define( 'FS_METHOD', 'direct' );

Сохраните и закройте wp-config.phpфайл. WordPress больше не будет запрашивать информацию о FTP, но плагины по-прежнему нельзя устанавливать. Скорее всего, вы получите сообщение «Установка не удалась. Не удалось создать каталог». Это происходит из-за неправильного владельца и прав доступа к файлам и папкам.

Установка плагинов/тем завершается с ошибкой «Не удалось создать каталог».

Чтобы исправить это, откройте Finder, щелкните правой кнопкой мыши htdocsпапку и выберите «Получить информацию». В нижней части окна нажмите, чтобы развернуть «Общий доступ и разрешения». Щелкните значок замка и введите пароль администратора, чтобы получить доступ к изменению настроек. На «Все» установите разрешение «Чтение и запись». Затем щелкните значок шестеренки и выберите «Применить к вложенным элементам…». Нажмите OK в диалоговом окне.

Последним шагом является изменение прав доступа к файлам и папкам с помощью chmod. Откройте терминал (Command + пробел, введите «терминал» и нажмите Enter). В командной строке напишите «cd» (включая пробел после), а затем перетащите папку Finder htdocs в окно терминала и нажмите «Ввод». В противном случае вам нужно будет ввести полный путь к папке htdocs (см. серое поле выше). Оказавшись в папке htdocs, введите эту команду и нажмите Enter:

sudo chmod -R 0777 *

Если вас попросят ввести пароль администратора, введите его и нажмите Enter. Приглашение должно остаться на некоторое время и внезапно обновиться до нового приглашения, когда оно будет завершено.

Обновите страницу администратора WordPress, и теперь вы сможете использовать WordPress как обычно!

Возможные проблемы и исправления для WampServer

Значок WampServer в системном трее оранжевый и никогда не становится зеленым

В любом случае попробуйте http://localhost/ в браузере. Если это работает, это, вероятно, означает, что WampServer настроен с большим количеством сервисов, чем вам нужно. Вам нужны только Apache (веб-сервер) и MySQL (база данных). Я обнаружил, что WampServer по умолчанию также пытается запустить MariaDB (другую службу базы данных). Но поскольку он не может запустить MariaDB, значок остается оранжевым, даже если Apache и MySQL работают. Если это так, удалите службу MariaDB.

Локальный хост не работает

К сожалению, причин этому может быть много. Я бы начал с проверки, работают ли службы Apache и MySQL вообще. Щелкните значок WampServer в трее > Apache > Администрирование службы. Если «Запустить/возобновить службу» зеленый и кликабельный, это означает, что Apache в данный момент не запущен.

Если Apache не запущен, попробуйте нажать «Установить службу» в том же меню. Вы должны получить командную строку, которая либо показывает, что он успешно настроил Apache, либо вы можете получить подсказку о том, почему он не работает.

В большинстве случаев Apache не может запуститься, потому что порт 80 занят какой-то другой программой. Проверьте, установлен ли у вас Skype. Погуглите, как настроить скайп, чтобы он не занимал 80 порт и еще раз попробовать WampServer.

Красивые постоянные ссылки не работают в WordPress

Пользовательские (красивые) постоянные ссылки в WordPress требуют, чтобы модуль «rewrite_module» был установлен на вашем веб-сервере. Нажмите на значок WampServer в трее > Apache > Модули Apache — и в длинном списке найдите и нажмите «rewrite_module». WampServer установит модуль и автоматически перезапустит веб-сервер Apache.

Мой максимальный размер загрузки в медиатеке составляет всего 2 МБ.

По умолчанию WampServer устанавливает максимальный размер загружаемого файла в 2 Мб. Это часто слишком мало для загрузки больших изображений в медиатеку. Чтобы исправить это, нам нужно изменить php.iniфайл Apache. Щелкните значок WampServer > PHP > php.ini. Он должен открыть файл в программе редактирования текста по умолчанию.

Найдите «upload_max_filesize» и увеличьте значение M (Mb) примерно так:

upload_max_filesize = 50M

Я также рекомендую изменить еще одну вещь. Найдите «post_max_size». Увеличьте значение M (Mb), чтобы линия выглядела примерно так:

post_max_size = 50M

Закройте файл и перезапустите Apache.