Что нужно для создания сайта на wordpress

Как создать сайт на WordPress с нуля

WordPress — это бесплатная платформа, которая позволяет создавать сайты без знания HTML-кода. Она подойдет новичкам и профессионалам. Особенно выручит, когда нужно собрать сайт, портфолио или блог, а вы этого раньше не делали. Как создать и настроить сайт на WordPress, используя CMS-хостинг RU-CENTER, расскажем в этой статье.

Кому подойдет WordPress

• блоги;
• одностраничные лендинги;
• сайты-визитки организаций
• портфолио;
• небольшие интернет-магазины без сложных модулей: фильтрации, сортировки и т. д.

Преимущества WordPress

• Бесплатная лицензия.
• Быстрая и простая сборка сайта на хостинге со стандартными настройками: привлекать программистов точно не придется.
• Удобная панель управления для работы с контентом.
• Бесплатные или недорогие темы, которые можно изменять и адаптировать под фирменный стиль сайта.
• Много бесплатных плагинов. Они позволят расширить функциональность сайта и сделать сайт более безопасным.
• Открытый код позволяет разработать свои плагины и темы.

Недостатки WordPress

• Для многих функций нужно вручную устанавливать расширения и дополнения.
• Возможна перегрузка сервера: чтобы ее избежать, нужно оставить только необходимый набор плагинов и убирать лишние расширения. В RU-CENTER панель управления хостингом остается доступной независимо от состояния CMS и сайта. Это позволяет вручную отключить плагины и провести другие необходимые процедуры по восстановлению.
• Сайты на WordPress — популярная мишень для атак: их часто взламывают, поэтому важно внимательно следить за обновлениями платформы. RU-CENTER автоматически установит последнюю версию CMS.

Как создать сайт на WordPress: пошаговое руководство

Мы покажем, как создать сайт на WordPress, используя CMS-хостинг RU-CENTER. Для этого нужно выполнить пять шагов:

1. Зарегистрировать доменное имя и приобрести CMS-хостинг.
2. Установить WordPress.
3. Настроить темы и шаблоны.
4. Добавить контент на готовый сайт.
5. Установить необходимые плагины.

Шаг 1. Регистрируем доменное имя и приобретаем веб-хостинг

Приобретите хостинг для сайта — домен .ru или .рф уже включен в стоимость. Для блога или сайта компании рекомендуем тариф «CMS-хостинг WordPress 1», для сайтов с высокой посещаемостью — «CMS-хостинг WordPress 2», а для интернет-магазинов и больших проектов — «CMS-хостинг WordPress 3».

Тарифы RU-CENTER на CMS-хостинг сайтов на WordPress

Шаг 2. Устанавливаем WordPress

Войдите в панель управления хостингом, введите номер договора и пароль. Перейдите в раздел «Сайты». Нажмите кнопку «Создать сайт» в правом верхнем углу.

Нажмите «Создать сайт» в панели управления хостингом RU-CENTER

Выберите домен из списка зарегистрированных по договору или введите название сайта вручную. Нажмите кнопку «Продолжить».

Выберите домен из списка или введите название сайта вручную. Нажмите кнопку «Продолжить»

Выберите CMS WordPress, затем укажите имя сайта, логин, email и пароль, нажмите кнопку «Продолжить».

Выберите CMS WordPress, укажите имя сайта, логин, email и пароль, нажмите кнопку «Продолжить»

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

Обратитесь к своему сайту по адресу http://ваш_домен/. Продолжить работу с сайтом вы сможете в административной панели WordPress. Чтобы попасть в нее, нажмите на кнопку «Перейти в панель управления».

Чтобы начать работать с сайтом, нажмите на кнопку «Перейти в панель управления»

На странице авторизации введите логин и пароль, затем нажмите на кнопку «Войти».

Введите логин и пароль на странице авторизации

Теперь вы находитесь в панели управления вашим сайтом. Осталось только оформить его и добавить контент.

Шаг 3. Настраиваем темы

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

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

Чтобы выбрать тему, в панели управления перейдите в раздел «Внешний вид» → «Темы». Нажмите кнопку «Добавить новую».

В разделе «Внешний вид» → «Темы» вы можете подобрать тему для вашего сайта

Подберите тему WordPress из каталога, найдите нужную вам по названию или с помощью фильтра характеристик.

Найти нужную тему можно по названию или с помощью фильтра характеристик

Наведите курсор на выбранную тему и нажмите кнопку «Просмотреть». WordPress включит режим предпросмотра. Если внешний вид сайта вам нравится, установите тему.

Кнопка «Посмотреть» включит предпросмотр сайта, если она вам понравится — нажмите кнопку «Установить»

Более подробную инструкцию инструкцию и FAQ по настройке темы вы найдете в полном гиде от WordPress.

Шаг 4. Добавляем контент

У WordPress есть две разновидности контента: страницы и записи.

Записи — часть блога, они показаны в обратном порядке: новые записи отражаются в начале.

Так выглядят «Записи» в WordPress

Страницы — это статический контент: например, страница контактов, страница с информацией о компании и т. д.

Так выглядят «Страницы» в WordPress

Чтобы добавить контент на сайт, перейдите в раздел «Страницы» или «Записи» на панели управления, нажмите «Добавить новую». В редакторе страниц вы можете добавить текст, вставить видео, ссылку, картинку, аудио и т. п. Чтобы разместить готовый контент на сайт, нажмите кнопку «Опубликовать».

Редактор страниц в WordPress

Шаг 5. Устанавливаем дополнительные плагины

Плагины — программные модули, которые подключаются к CMS. С их помощью можно делать страницы сайта безопаснее, увеличивать скорость загрузки страниц, добавлять на сайт форум, содержание, создавать опросы и многое другое.

В интернете много ресурсов, с помощью которых можно скачать плагины. Но велик риск, что они окажутся заражены вирусами.

Существует два наиболее безопасных источника, где можно найти плагины:

1. На официальном сайте WordPress.org.
2. В консоли WordPress.

Вот четыре типа плагинов, которые точно пригодятся даже новичкам:

• Бэкап — он предотвратит потерю всей информации сайта, создаст резервные копии.
• Безопасность — такие плагины защищают данные сайта и пользователей. Например, если ваши пользователи создают личный кабинет, то пригодится плагин двухфакторной аутентификации, генерации надежных паролей и reCAPTCHA.
• Дизайн и настройка — эти плагины помогут вам определиться с дизайном главной страницы и придумать свою пользовательскую тему.
• Плагины для повышения производительности и настройки кеширования контента — такие плагины помогут ускорить работу сайта. Самые популярные из них — W3 Total Cache, WP Super Cache, WP Fastest Cache.

Ваш сайт на WordPress готов. Удачной работы!

Читайте также:

Как создать сайт на WordPress: полезный полный гайд

Согласно статистике Web Technology Surveys, WordPress занимает первое место в мире среди систем управления контентом. В июле 2022 года сервис использовали 64,2% всех интернет-ресурсов. Эта популярная CMS поможет вам запустить информационный, отраслевой портал или даже онлайн-магазин. Разбираемся, как создать сайт на WordPress.

Преимущества WordPress

• Бесплатный движок. У сервиса открытая лицензия, его можно применять даже в коммерческих целях.
• Широкие возможности. CMS позволяет проектировать разные типы сайтов — от личного блога до мультимедийной галереи и крупного интернет-магазина.
• Настройка разных функций и интерфейса. Добавлять функциональные и технические решения можно с помощью плагинов. Для оформления внешнего вида сайта предусмотрено множество шаблонов — платных и бесплатных.
• Интуитивное управление. Не нужно обладать специальными навыками, чтобы создать сайт на WordPress.
• Автоматический перенос на хостинг. Многие компании предоставляют эту услугу. Вам не потребуется скачивать дистрибутив и заниматься установкой самостоятельно.

Выбор хостинга и регистрация домена

Для запуска сайта необходим хостинг — место на сервере и специализированное ПО для работы. У сервиса есть бесплатный хостинг, но он больше подойдет для блогов и небольших сайтов. Если вы ведете коммерческий ресурс и получаете с его помощью значительный доход, используйте платные варианты. Вот несколько надежных провайдеров: Timeweb, Beget, Reg.ru. Чтобы воспользоваться их услугами, достаточно зайти на сайт, перейти в раздел «Хостинг», выбрать и оплатить подходящий вам тариф.

Хостеры предоставляют SLL-сертификат — гарантию шифрования данных между сайтом и браузером посетителя. Также у них есть услуга регистрация домена — адреса вашего сайта в браузерной строке.

Порядок регистрации домена:

• Придумайте доменное имя. Желательно, чтобы оно было коротким и запоминающимся, содержало название вашей компании. Так пользователь сможет без труда ввести его в адресную строку по памяти.
• Проверьте, свободно ли выбранное имя. Это можно сделать на странице сервиса подбора доменных имен, например здесь.
• Выберите доменную зону. Популярные — .ru, .com, .net и другие расширения верхнего уровня. Известным адресам пользователи доверяют больше. Региональным компаниям полезно включать в URL географическое расширения второго уровня, например .spb.ru. Так сайт будет чаще показываться жителям городов и регионов.
• Кликните на «Зарегистрировать домен».

Установка WordPress

Некоторые хостинг-провайдеры предустанавливают движок в качестве бонуса. Если вы купили хостинг без него, действуйте следующим образом:

1. На сайте WordPress скачайте установочный пакет — кликните на синюю кнопку в правом верхнем углу экрана и в открывшемся окне найдите опцию «Скачать WordPress 6.0» (или следующую версию).
2. Дистрибутив загрузится в виде архива. Распакуйте его и с помощью FileZilla или другого FTP-сервиса и поместите программные файлы в корневую папку на вашем ПК.
3. Установите программу. Откройте в браузере ссылку на сайт и введите в соответствующие поля информацию о подключении к базе данных — ее предоставляет хостер. Кликните на «Отправить».
4. В открывшуюся форму внесите сведения о вашем сайте — его название, ваше имя и электронный адрес. Придумайте пароль для входа и отметьте галочкой опцию индексации сайта в поисковых системах, если вам это необходимо.
5. Система оповестит вас об успешной установке WordPress. Теперь сайт будет открываться по ссылке, а вы сможете перейти в панель администратора через опцию «Войти» и редактировать его.

Сделать сайт на WordPress можно как платно, так и бесплатно. Если вы создаете небольшой сайт без покупки стороннего хостинга, достаточно следующих шагов:

1. Зарегистрируйтесь на сайте WordPress — заполните все поля формы.
2. В открывшемся окне активируйте опцию «Мой сайт» в левой верхней части экрана. Затем кликните на «Создать сайт».
3. Выберите домен для сайта. Система подскажет, если доменное имя уже используется, и предложит свободные варианты.
4. Выберите и оплатите онлайн подходящий тарифный план — WordPress Starter или WordPress Pro. Можно также ограничиться минимальным вариантом CMS, нажав на «Продолжить бесплатно».
5. Кликните на «Продолжить» и начните работу с помощью опции «Начать создание сайта».

Выбор темы

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

Вам также будут доступны платные шаблоны от разработчиков.

Каталог шаблонов. Чтобы найти подходящий шаблон из множества вариантов, примените фильтры. Отметьте нужные вам:

• тему (направление вашего сайта);
• функции;
• особенности разметки.

Установка и русификация темы вручную. Чтобы установить шаблон, придерживайтесь алгоритма:

1. В правом меню личного кабинета активируйте опцию «Внешний вид» — «Темы».
2. Кликните на «Добавить новую», отыщите шаблон при помощи фильтров или названия.
3. Оцените внешний вид будущего сайта с помощью режима предпросмотра — наведите курсор на понравившийся вариант и активируйте функцию «Посмотреть».
4. Установите тему с помощью одноименной кнопки в левом верхнем меню.

Второй вариант — загрузить на ПК дистрибутив понравившейся темы в виде zip-архива. Установите шаблон через аккаунт, последовательно активировав «Внешний вид» — «Темы» — «Добавить тему» — «Загрузить тему». Активируйте шаблон после загрузки.

Русифицировать шаблон можно через специальные программы, плагины или вручную. Для ручного перевода:

1. Скачайте файл вашей темы.
2. Откройте его в любом текстовом редакторе.
3. Поменяйте текст внутри кода.

Это рискованный метод — если вы допустите ошибку в коде, сайт будет работать некорректно. В связи с этим безопаснее использовать специализированные сервисы, например плагин Loco Translate.

Знания про маркетинг, аналитику, диджитал, быстро и бесплатно

• Новый скилл всего за 1,5 часа
• Практические знания
• Интерактивные юниты
• Без оплат и встроенных покупок

Настройка CMS

Теперь разберемся, как создать пользовательский интерфейс сайта на WordPress. Задать необходимые свойства сайта можно через опцию «Настройки» в панели администратора WordPress. Вот что нужно указать в разделах:

• Общие. Имя и краткая характеристика сайта. Эти данные увидят пользователи в поиске. URL сайта впишите в строки «Адрес WordPress» и «Адрес сайта». Укажите часовой пояс, язык и вид даты.
• Написание. Здесь задают настройки форматирования. В первое время можно оставить настройки по умолчанию. В «Сервисах обновления» укажите программы, которые будут отслеживать обновления, — это нужно для того, чтобы движок передавал поисковикам информацию о новом контенте на сайте.
• Чтение. Здесь нужно отметить те данные, которые будут отображаться на главной странице сайта. Выберите количество записей на странице и тип отображения новостей в ленте.
• Обсуждение. Здесь можно оставить настройки по умолчанию. Вы можете выбрать свои условия для модерации комментариев и черного списка.
• Медиафайлы. Максимальные возможности выставлены в дефолтных настройках.
• Постоянные ссылки. Укажите структуру ссылок на ваши записи — название или название и дата публикации. Можно добавить префиксы по категориям.

Плагины WP

Не добавляйте много плагинов, чтобы не замедлить работу сайта для посетителей. Выбирайте только самые необходимые:

• для улучшения функциональности и юзабилити;
• для защиты сайта и блокировки спама;
• для поисковой оптимизации.

Функциональные возможности

Решите, что вы ждете от вашего сайта и с какими задачами сможете столкнуться. Исходя из этого выберите плагин.

• управление электронной коммерцией — WooCommerce, Easy Digital Downloads;
• связь с администратором через популярные мессенджеры (WhatsApp, Telegram, Viber) — Whats Help Chat Button;
• возможности комментирования — wpDiscuz, TinyMCE Comment Field;
• добавление кнопок шеринга для соцсетей — Footer and Post Injection;
• транслитерация электронных адресов и названий файлов — Cyriltera.

Расширить функциональность вашего сайта помогут не только плагины, но и специализированные сервисы. Например, Обратный звонок Callltouch мотивирует посетителей, которые не хотят звонить менеджеру самостоятельно, оставить заявку на консультацию. Клиенты смогут поговорить с вашими специалистами в удобное для себя время, а вы не упустите ни одного из них. Виджет можно кастомизировать под дизайн вашего сайта.

Обратный звонок
Увеличивайте количество обращений с сайта
Новым клиентам 50 минут бесплатно

SEO

Сайты, созданные на WordPress, сами по себе содержат SEO-потенциал, однако продвижение в поиске не состоится без решения обязательных задач. В этом помогут плагины. Вот задачи и подходящие модули:

• составление и актуализация карты сайта — Google XML Sitemaps, Google Sitemap by BestWebSoft;
• оптимизация главных страниц — All in One SEO Pack, WP SEO by Yoast;
• автоматическое создание метаданных — Meta Data Filter & Taxonomies Filter;
• запрет индексации повторяющегося контента — All in One SEO Pack;
• генерация микроразметки страницы — WPSSO, Schema App;
• канонизация электронного адреса — WordPress SEO;
• добавление .htaccess и robots.txt — Yoast SEO, Robots.txt Editor.

Защита сайта

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

• создавать резервные копии — подойдут WP Database Backup, BackUpWordPress;
• защищать от взлома — Loginizer Security, Login Lockdown.

Есть комплексные расширения, которые обеспечивают безопасность сайта в нескольких направлениях, например iThemes Security.

Антиспам

В борьбе со спамом помогут встроенный механизм комментариев и специальные сервисы: Disqus, Akismet, Antispam Bee, Advanced noCaptcha & Invisible Captcha.

Маркетинг

Читайте также:

Контекстная реклама или SEO продвижение: что лучше

Контекстная реклама или SEO продвижение: что лучше

Настройка сервисов аналитики

Подключить к сайту Яндекс.Метрику и Google Analytics можно с помощью плагина Footer and Post Injection. Вот порядок подключения через плагин.

Яндекс.Метрика. Алгоритм настройки:

1. Зарегистрируйтесь в системе.
2. В горизонтальном меню вверху активируйте опцию «Счетчики» — «Добавить счетчик».
3. Введите в поля с одноименными названиями имя счетчика и ссылку на сайт. Выберите часовой пояс и примите пользовательское соглашение. Кликните на «Создать счетчик».
4. В шаге «Установите код счетчика на сайт» выберите «CMS и конструкторы сайтов». При необходимости задайте настройки (валюта, длительность визита) и скопируйте код.
5. В админке WordPress в меню настроек перейдите в окно плагина Footer and Post Injection и вставьте скопированный код в окно. Сохраните изменения.

Google Analytics. Порядок подключения:

1. Авторизуйтесь и создайте аккаунт в Google Analytics по алгоритму. Поставьте галочки напротив нужных вам функций.
2. В следующем окне сервис предложит настроить ресурс — Google Аналитика 4 или Universal Analytics. Можете выбрать ресурс двух типов.
3. Откроется форма с анкетой. Заполните ее информацией о вашей компании. Затем примите условия использования сервиса.
4. Откроется экран управления потоком. Скопируйте идентификатор отслеживания (ID кабинета). Вставьте его в окне управления плагином в WordPress в строку «Google Analytics ID». Сохраните изменения.

Для определения эффективности рекламных кампаний важна качественная аналитика. Чтобы отслеживать результаты вашей маркетинговой стратегии, подключите Сквозную аналитику Calltouch. Сервис соберет данные с рекламных площадок и из CRM-системы, подсчитает количество лидов и сделок, величину прибыли — и визуализирует все в одном отчете. Вы сможете оптимизировать рекламу и вкладывать деньги только в эффективные каналы.

Сквозная аналитика
Оценивайте эффективность всех рекламных кампаний в одном окне от клика до ROI
Вкладывайте в ту рекламу, которая приводит клиентов

Создание страниц и публикаций

После настройки технических возможностей сайта займитесь его внешним видом и наполнением. Продумайте интуитивно понятную структуру и привлекательный дизайн. Рассмотрим поэтапно, как создать сайт на WordPress.

Меню

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

1. В консоли администратора выберите раздел «Внешний вид» — «Меню».
2. Воспользуйтесь опцией «Редактировать меню». Кликните на «Создать новое меню», введите его название (на сайте оно отображаться не будет).
3. Выберите элементы — рубрики, страницы, ссылки. Отметьте галочками нужное и кликните на «Добавить в меню». Скелет вы сможете увидеть в разделе «Структура меню».
4. При необходимости создайте многоуровневое меню. Для этого в «Структуре меню» зажмите мышью нужный подпункт, потяните его немного вправо и отпустите. Рядом появится надпись «Дочерний элемент». Вы можете также менять пункты местами, перетаскивая их мышью.
5. Откройте раздел «Настройки меню» и выберите нужные функции. С помощью опции «Автоматически добавлять страницы» в список будет интегрироваться каждая новая страница. В «Области темы» нужно отметить часть страницы, в которой программа выведет ваше меню.

Страницы

Вы можете создать публикацию или статическую страницу. Для оформления страницы с неизменными элементами следуйте алгоритму:

1. В панели администратора в меню «Страницы» выберите «Добавить новую».
2. Впишите заглавие страницы и внесите другие необходимые данные. Выбирайте опции из правого меню и следуйте рекомендациям редактора.
3. Чтобы внедрить новый блок контента, активируйте кнопку «+» в левом верхнем углу экрана. Через опцию вы сможете добавлять и редактировать текст, сопровождать его иллюстрациями, оформлять цитаты или таблицы, а также создавать галерею или слайд-шоу.
4. Когда страница будет готова, опубликуйте ее с помощью кнопки «Published» («Опубликовать») в правой верхней панели.

Для публикаций лучше установить плагин «Классический редактор» — встроенные инструменты недостаточно гибкие для данного формата.

Порядок добавления публикации:

1. В меню «Записи» перейдите на страницу создания публикации через кнопку «Добавить новую».
2. Выберите подходящий формат. По умолчанию сервис предложит «Базовый шаблон».
3. Через меню «Рубрики» выберите нужную тематику публикации.
4. Добавьте название публикации и ее текст, укажите Title и Description, выберите иллюстрацию.
5. Опубликуйте запись с помощью соответствующей кнопки.

Шапка

В шапке сайта, или хедере, содержатся основные атрибуты компании: логотип, название, описание. Чтобы работать с этим элементом, найдите в инструментах администратора раздел «Шапка» или «Заголовок». Выберите разметку — расположение частей шапки. Войдите в меню и добавляйте элементы хедера:

• фоновую картинку и логотип — используйте кнопки «Загрузить» в соответствующих разделах;
• фавиконку — картинку, которая будет высвечиваться в поисковике рядом с названием сайта;
• название и описание сайта.

Подвал

Футер, или подвал, — нижняя часть страницы. Туда помещают контакты компании, юридическую информацию и виджеты.

Подвал настраивают аналогично шапке: в меню администратора активируют раздел «Подвал», выбирают разметку и наполняют области содержимым.

Политика конфиденциальности и другие документы

На сайте WordPress можно сделать разделы с документацией. Более того, для ресурсов, с помощью которых проводят оплату и хранят данные пользователей, это необходимо по закону.

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

1. В панели администратора активируйте «Настройки» — «Конфиденциальность». Сервис предложит вам шаблон документа.
2. Кликните на ссылку «Изменить», чтобы внести нужные данные и отредактировать документ. Сервис предоставит вам руководство по составлению политики конфиденциальности.
3. Добавьте документ на сайт. Многие шаблоны позволяют сделать это в несколько кликов по подсказкам.

Подключение SSL-шифрования

Когда SLL-шифрование подключено, сайт работает по протоколу HTTPS, а в браузерной строке появляется символ зеленого замка — защищенного соединения. В противном случае в строке отображается знак предупреждения и надпись «Не защищено».

Хостеры предлагают платные и бесплатные SSL-сертификаты и инструкции по их настройке. Некоторые провайдеры, например Timeweb, подключают сертификат автоматически. Чтобы воспользоваться услугой, выполните простые шаги:

1. На сайте хостера найдите раздел «SSL-сертификаты» и в открывшемся меню кликните на «Заказать».
2. Выберите платный или бесплатный вариант. Сертификат начального уровня (бесплатный) предоставляется на 3 месяца. Затем его можно обновить. Активируйте кнопку с нужным вам сертификатом и при необходимости оплатите его.
3. На странице сертификата выберите домен сайта, которому нужно его присвоить.

SLL-шифрование начнет действовать автоматически через несколько часов.

Заключение

• На WordPress можно самостоятельно создать любой сайт, в том числе интернет-магазин.
• Для разработки небольшого ресурса у сервиса есть собственный хостинг. Если вы планируете создать на WordPress многостраничный сайт, приобретите место на сервере у хостинг-провайдера.
• Чтобы создать сайт на WordPress, вам не потребуются навыки программирования — все необходимые опции находятся в панели администратора.
• Чтобы сайт работал корректно и обладал необходимыми функциональными возможностями, нужно установить плагины. Выберите расширения для безопасности, конфиденциальности и SEO.
• Если вы планируете проводить транзакции и хранить личные данные пользователей, приобретите SSL-сертификат у хостера.

Как создать сайт на WordPress с нуля: пошаговая инструкция

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

Сайт на WordPress с нуля: как сделать самому в 2023

Создание сайта на WordPress проходит в несколько этапов:

1. Выбор хостинга и регистрация домена.
2. Установка CMS WordPress.
3. Создание страниц.
4. Создание рубрик.
5. Создание записей.
6. Выбор и настройка темы.
7. Установка плагинов.
8. Установка кодов счетчиков и верификации на сайт.
9. Настройка HTTPS.
10. Тестирование и открытие к индексации.

Ниже мы подробнее расскажем о каждом этапе создания сайта на WordPress.

№1. Выбор хостинга и регистрация домена

Первое, что нужно сделать при создании любого сайта — выбрать хостинг и доменное имя для него. При выборе хостинга обращайте внимание на:

• стоимость — цена не должна быть сильно завышена или занижена;
• расположение дата-центров — если ваша целевая аудитория находится в России, то рекомендуем выбирать хостинг с серверами в РФ;
• панель управления хостингом — она должна быть удобной и интуитивно понятной, например, как ispmanager или DirectAdmin;
• наличие тестового периода — так вы сможете бесплатно убедиться в качестве хостинга;
• график работы техподдержки — поддержка должна работать круглосуточно;
• автоматическую установку CMS — для экономии сил и времени.

Мы будем показывать все действия на примере виртуального хостинга RuWeb — он соответствует нашим требованиям для создания сайта на ВордПресс.

Выбираем тарифный план (нам подойдет самый дешевый тариф) и проходим простую процедуру регистрации.

После регистрации мы попадаем в биллинг-панель, из которой будем заказывать и оплачивать услуги. Зарегистрируем доменное имя для будущего сайта — для этого перейдем в раздел «Домены», вводим нужный адрес (предварительно проверив его на доступность через Whois-сервис) и нажимаем кнопку «Добавить».

Далее выбираем регистратора домена (в нашем случае — МаксНейм) и нажимаем «Дальше».

Срок регистрации — 1 год. Заполняем список DNS-серверов: мы будем заказывать хостинг одновременно с доменом в RuWeb, поэтому оставляем список DNS пустым.

Если хотим, чтобы домен продлевался автоматически — ставим галочку в соответствующее поле. Заполняем регистрационную анкету (на кого будет регистрироваться домен). Нажимаем кнопку «Готово».

Оплачиваем заказ любым удобным способом. После пополнения баланса подтверждаем заявку на регистрацию домена.

Далее переходим в раздел «Сайты» и добавляем новый сайт. В поле домен вводим доменное имя, которое регистрировали ранее. Выбираем тарифный план и срок обслуживания (мы выбрали срок в 1 месяц). Если вы впервые пользуетесь услугами хостинга, то вам доступен бесплатный пробный месяц. Выбираем условие, по которому мы можем получить тестовый период (на нашем счете есть 90 рублей), и нажимаем «Заказать».

Попадаем на страницу обработки заявок и подтверждаем наш заказ.

Обратите внимание, для регистрации домена и активации хостинга потребуется время — обновите панель чуть позже и проверьте, что все услуги активны.

Мы обновили главную страницу биллинга через 30 минут — отлично, все услуги активны!

После того, как домен зарегистрируется, необходимо в панели управления доменом прописать DNS-серверы хостинг-аккаунта. Панель управления доменом находится в биллинге в разделе «Домены» > «Управление».

Необходимые DNS-серверы нужно взять из письма с данными хостинг-аккаунта (оно придет на вашу почту после активации хостинга).

Перейдите в ​​управление доменом и нажмите «Изменение списка DNS-серверов». Укажите новые DNS из письма и сохраните изменения.

Делегирование домена у регистратора занимает некоторое время. Сайт может заработать уже через 15 минут, но среднее время распространения информации составляет от 24 до 72 часов. После того, как делегирование домена пройдет успешно, перейдем к установке CMS.

№2. Установка CMS WordPress

Следующий шаг — установка CMS WordPress на сайт. В биллинг-панели переходим в раздел «Сайты» и нажимаем «Подробно» напротив нужного. Нажимаем на кнопку «Войти в панель управления хостингом DirectAdmin».

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

Обратите внимание, перед установкой необходимо обновить версию PHP. Для этого в панели управления хостингом DirectAdmin перейдите в раздел «Настройки PHP» > «Выбор версии PHP» и выберите самую последнюю версию. В разделе «Расширения PHP» выберите все пункты.

Для автоматической установки CMS WordPress переходим в раздел «Softaculous Auto Installer».

Переходим в раздел «Блоги» > «WordPress» и нажимаем на кнопку «Установить сейчас».

Выбираем URL установки (наш домен), а также логин и пароль для входа в админку WordPress. Директорию установки оставляем пустой. Остальные детали установки можно оставить без изменений — мы сможем поменять их в процессе создания сайта.

Нажимаем кнопку «Установить» в конце страницы и ждем завершения установки.

Обратите внимание, если в процессе установки возникнет ошибка, что некоторые файлы уже созданы, просто нажмите флажок «Перезаписать» и продолжите установку. Перейдем на сайт и убедимся, что WordPress установлена верно.

Отлично, все работает. Перейдем к настройкам и наполнению сайта.

№3. Создание страниц

Перейдем в панель управления WordPress: она доступна по ссылке:

http://ваш-сайт.ру/wp-admin/

Логин и пароль для входа мы придумывали ранее при установке CMS. Для начала закроем сайт от индексации, чтобы поисковые системы не смогли добавить страницы сайта в поиск раньше времени. Перейдем в раздел «Настройки» > «Чтение» и поставим галочку напротив пункта «Видимость для поисковых систем». Сохраним изменения.

Далее сделаем так, чтобы мы могли самостоятельно выбирать URL страниц нашего сайта. Для этого переходим в «Настройки» > «Постоянные ссылки». Выбираем поле «Произвольно» и вставляем в него этот фрагмент:

/%category%/%postname%/

Теперь мы готовы создать первые страницы сайта. Переходим в раздел «Страницы» и нажимаем «Добавить новую».

Мы сделаем сайт о WordPress. Создадим страницу «О проекте». Откроется визуальный редактор, в котором можно редактировать страницу: в меню слева можно добавлять текст, видео, изображения, таблицы, сторонний код и другой контент. Справа можно изменить URL страницы (для этого сохраните черновик, а потом просто нажмите на URL), выбрать автора, добавить изображение записи и задать другие настройки. Опубликуем изменения.

По аналогии добавим страницы «Часто задаваемые вопросы» и «Связаться с нами».

№4. Создание рубрик

Рубрики в WordPress — это разделы, содержащие группы однотипных страниц. Например, создадим рубрику «Инструкции WordPress», в которой будем выкладывать обучающие материалы. Переходим в раздел «Рубрики» и добавляем новую: придумываем название, ярлык (будущий URL) и краткое описание.

По аналогии добавим рубрики «Видеоуроки» и «Частые ошибки».

№5. Создание записей

Записи — это и есть те самые «однотипные» страницы, которые будут содержаться в рубриках. Например, добавим запись «Как поменять тему на WordPress». Переходим в раздел «Все записи» и нажимаем «Добавить новую».

Добавим контент на страницу, установим изображение записи, изменим URL, а в поле «Рубрики» выберем «Инструкции WordPress».

По аналогии добавим еще несколько записей в каждую рубрику.

№6. Выбор и настройка темы

По умолчанию устанавливается стандартная тема. Чтобы ее изменить, перейдем в раздел «Внешний вид» > «Темы». Нажимаем «Добавить новую тему».

Мы попадаем в каталог со всеми темами в WordPress. Выбираем вариант, который вам нравится и подходит под нужды проекта — для примера мы выбрали тему «Blocksy». Устанавливаем ее и активируем.

Логотип и фавикон

Переходим на сайт и убедимся, что тема установлена. Нажимаем «Настроить» в верхней части экрана.

Мы попадаем в раздел с настройками темы. Для начала установим логотип и фавикон для сайта. Чтобы добавить фавикон, перейдем в раздел «Свойства сайта» (он находится снизу в левом меню).

В свойствах сайта можно загрузить иконку, которая будет отображаться в браузере.

Чтобы загрузить логотип, перейдем в раздел «Шапка».

Далее перейдем в раздел «Логотип», где загрузим лого, придумаем название и описание сайта. Опубликуем изменения.

Настройка меню

Добавим главное меню на сайт. Переходим в раздел «Меню».

Нажимаем «Создать новое меню». Придумываем ему понятное название и выбираем место, где оно будет отображаться (мы выбрали расположение в шапке сайта). Нажимаем «Далее».

Нажимаем «Добавить элементы». Выбираем элементы, которые будут отображаться в меню. Мы выбрали рубрики и страницы:

1. Инструкции WordPress.
2. Видеоуроки.
3. Частые ошибки.
4. О проекте.

Страницы «Связаться с нами» и «Часто задаваемые вопросы» будут отображаться при наведении на страницу «О проекте». Чтобы настроить выпадающее меню, просто перетащите нужные элементы чуть правее с помощью мыши. Опубликуем изменения.

Отображение записей

Следующий этап — настройка отображения записей. Переходим в раздел «Записи блога», чтобы настроить отображение на главной странице. Выберем структуру блога — стандартную (чтобы записи отображались друг под другом), ограничим количество записей на странице — максимум 5 штук — и включим сайдбар (область справа).

Перейдем в «Настройки карточки». Здесь мы изменим отображение карточек с записями: добавим отрывок, кнопку «Читать далее», уберем автора статьи. Опубликуем изменения.

Изменение сайдбара и виджетов

Чтобы изменить внешний вид сайдбара, перейдем в раздел «Сайдбар». Здесь можно установить его внешний вид, ширину, отступы и задать другие настройки.

Чтобы изменить содержимое сайдбара, перейдем в раздел «Виджеты» > «Главный сайдбар».

Здесь можно изменить название виджета, удалить его или добавить новый. Мы удалили лишние виджеты, перевели заголовки на русский язык, добавили блок «Полезные материалы» со всеми страницами сайта. Опубликуем изменения.

Настройка футера

Наш сайт практически готов. Чтобы настроить внешний вид футера, переходим в раздел «Подвал». Здесь можно настроить копирайт (например, удалить автора темы), добавить виджет с дисклеймером, добавить ссылки на важные страницы сайта. Просто выберите виджет и переместите его в нужный раздел футера.

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

№7. Установка плагинов

Плагины позволяют облегчить работу с CMS, а также расширить ее стандартный функционал. Например, плагин «Yoast SEO» позволяет прописывать title, description, добавлять микроразметку, подтверждать права на сайт и многое другое. Перейдем в раздел «Плагины» > «Добавить новый». В поиске введем слово «seo», установим и активируем нужный плагин.

После активации плагина переходим в любую запись на сайте и убедимся, что теперь мы можем прописать title и description для страницы.

Существует множество полезных плагинов, которые упрощают работу с CMS. Рекомендуем установить несколько из них:

1. File Manager. Позволит редактировать, удалять, загружать, скачивать, копировать и вставлять файлы и папки.
2. Antispam Bee. Антиспам-плагин с продуманным набором инструментов для эффективной ежедневной борьбы со спамом.
3. Jetpack. Предназначен для защиты, резервного копирования, повышения скорости работы и развития вашего сайта WordPress.

№8. Установка кодов счетчиков и верификации на сайт

Для подробной аналитики трафика и продвижения сайта в поиске зарегистрируйтесь в сервисах:

1. Яндекс.Вебмастер.
2. Яндекс.Метрика.
3. Google Search Console.
4. Google Analytics.

Подтвердите права на сайт с помощью плагинов:

1. Для Яндекс.Вебмастера и Google Search Console подойдет «Yoast SEO». В его настройках перейдите в раздел «Инструменты веб-мастеров» и введите коды верификации в соответствующие поля.
2. Для Метрики и Аналитики используйте плагин «Simple Counter».

№9. Настройка HTTPS

Чтобы установить бесплатный SSL-сертификат в RuWeb, в панели управления DirectAdmin перейдите в раздел «Установка SSL-сертификата».

Далее нажимаем «Click here to enable SSL on the domain».

Ставим галочку напротив «Поддержка SSL». Устанавливаем «Перенаправлять с www на без www». Сохраняем изменения.

Далее еще раз сохраняем изменения возле пункта «Использовать private_html как ссылку на public_html».

Снова заходим в раздел «SSL-сертификат». Выбираем пункт «Установить бесплатный сертификат от Let’s Encrypt». Выбираем домен нашего сайта. Сохраняем изменения.

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

После того как пройдет минута и сертификат будет установлен, переходим в раздел «SSL-сертификат» и внизу ставим галочку напротив «Принудительно перенаправлять все незащищенные запросы на https». Нажимаем «Сохранить».

Теперь при переходе на сайт по протоколу «http», наш веб-ресурс автоматически будет перенаправляться на «https».

Обратите внимание, в разных панелях управления установка SSL-сертификата проходит по-разному. Мы составили инструкцию на примере DirectAdmin, которая используется в RuWeb.

№10. Тестирование и открытие к индексации

Перед тем, как открывать сайт к индексации, убедитесь, что:

1. На сайте нет битых ссылок с кодом ответа 404.
2. Сайт отображается корректно на разных устройствах.
3. Скорость загрузки оптимизирована под мобильные и десктопы.
4. Все разделы и страницы наполнены контентом.
5. Отсутствуют дубли страниц, заголовков и метатегов.
6. Формы с обратной связью открываются и работают верно.
7. Присутствуют файлы robots.txt и sitemap.xml.
8. Отсутствуют другие ошибки, которые могут сказаться на ранжировании сайта.

После тестирования перейдите в раздел «Настройки» > «Чтение» и уберите галочку напротив пункта «Попросить поисковые системы не индексировать сайт». Сохраните изменения.

Заключение

Теперь вы знаете, как сделать сайт на ВордПресс самостоятельно без помощи профессиональных разработчиков. Остались вопросы? Задавайте их в службу технической поддержки на сайте, мы обязательно вам поможем с установкой движка. Если статья была полезной, сохраните ее и поделитесь с друзьями в соцсетях.

Руководство по созданию сайта на WordPress

При помощи этой инструкции вы узнаете, как сделать красивый сайт на WordPress с нуля своими руками. Без лишних затрат и специальных навыков.

Эти знания мы совершенствовали годами: создавали тестовые сайты, пробовали разные инструменты, постоянно обновляли инструкцию, чтобы у вас точно всё получилось.

Примеры сайтов на WordPress

Лучше всего WordPress подходит для малого и среднего бизнеса. На этом движке без проблем можно сделать: 1) блог, онлайн-журнал или медиа; 2) сайт-визитку для вашего бизнеса, проекта или мероприятия; 3) небольшой интернет-магазин (до 2000 товаров).

Вот сайт, который мы сделали специально для этой инструкции. В статье ещё раз по шагам пройдём этот процесс. Посмотреть сайт в деталях вы можете по адресу smartfix.vashdomen.com.

Также вот несколько реально существующих сайтов, которые сделаны на WordPress. На всякий случай мы использовали сайт isitwp.com, чтобы подтвердить, что сайт действительно использует этот движок.

Cайты на WordPress

Шаг 1. Купите хостинг и домен

Хотя само по себе создание сайта на WordPress и бесплатно, вам понадобится две вещи, чтобы сайт был доступен в интернете:

• Хостинг — место, где сайт хранится в круглосуточном доступе для посетителей.
• Домен — текстовый адрес сайта, который люди будут видеть в браузере и в ссылках.

Всё это стоит в районе 2000–3000 гривен за год ($60–80), что не так уж и много, если учесть, что за эти деньги сайт круглосуточно будет в онлайне целый год.

Купить хостинг и зарегистрировать домен вы можете у нас в HOSTiQ. Это позволит нам и дальше выпускать бесплатные обучающие материалы по созданию и продвижению сайта (вроде этой статьи).

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

Самый выгодный способ — купить хостинг сразу на год. Так стоимость каждого месяца будет ниже + вы сможете бесплатно получить домен на 1 год в одной из популярных зон: .com , .net , .org , .com.ua , или .in.ua . Полный список зон вы найдёте на странице тарифа во время оформления заказа.

Также у нас вы можете воспользоваться бесплатным тестовым периодом в 30 дней. Этого срока должно хватить, чтобы самостоятельно создать сайт на WordPress с нуля и подготовить его к запуску.

После нажатия кнопки «Купить» понадобится создать аккаунт.

Чтобы установить сертификат, нужно войти в панель управления хостингом. Для этого нажмите кнопку «Панель клиента» в правом верхнем углу. Затем найдите в списке продуктов ваш хостинг и нажмите кнопку «Контрольная панель».

В панели управления хостингом вы можете создать поддомен, отредактировать файлы сайта, настроить почту на своём домене и сделать ещё много чего полезного. У нас есть целый раздел с инструкциями по панели:

Сейчас наша задача — установить SSL-сертификат. Найдите на главной странице cPanel раздел «Безопасность» и откройте в нём приложение «Let’s Encrypt».

Дальше найдите ваш домен в списке «Issue a new certificate» и нажмите рядом с ним «Issue». Затем на следующей странице снова нажмите «Issue».

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

Адрес панели управления — это ваш домен со словами /wp-admin/ . Например, https://vashdomen.com/wp-admin/ . Запомните этот адрес или сохраните в закладки браузера, чтобы в будущем можно было быстро попасть в панель.

Панель управления WordPress ещё называют «консоль». Так короче, плюс именно так называется главная страница панели. В консоли вы будете создавать страницы сайта, менять дизайн, отвечать на комментарии, обрабатывать заказы.

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

Также в верхней части консоли есть небольшая плашка — панель быстрого доступа. С её помощью можно быстро перейти на сайт, а затем вернуться обратно в консоль. Для этого наведите курсор на название сайта и увидите выпадающий список с такой опцией.

Ещё при помощи этой плашки вы можете быстро перейти к редактированию страницы, на которой находитесь. Ну и конечно видеть плашку будете только вы.

Чтобы скрыть виджет, нажмите в верхнем правом углу «Настройки экрана». В раскрывшемся меню уберите галочки с виджетов, которые вам не нужны. Оставшиеся виджеты можно перетаскивать мышкой, чтобы расположить их в удобном порядке.

По мере развития сайта на главной странице консоли будут появляться новые виджеты. Если вам они не нужны, вы всегда можете точно также скрыть их в меню «Настройки экрана».

Также рекомендуем изменить часовой пояс и формат даты с временем чуть ниже. Это больше для вашего удобства как администратора сайта. Если вам понадобится узнать дату и время публикации, комментария или заказа, лучше чтобы эти данные были в понятном для вас формате.

Постоянные ссылки. Тут главная настройка это «Структура постоянных ссылок». Как видите, по умолчанию выбрана опция, чтобы в ссылках отображалась дата публикации записи, страницы или товара. Это снижает читабельность ссылок и не очень хорошо для ранжирования в поисковиках. Лучше выбрать вариант «Название записи».

С базовыми настройками всё. Теперь перейдём к завершающим действиям — установим инструменты, которые помогут вам создать сайт на платформе WordPress. Начнём с темы сайта.

3.4. Измените стандартную тему

Тема — это набор инструментов для создания сайта на WordPress. От неё зависит, насколько много разных деталей в дизайне вашего сайта вы сможете изменить.

Все темы разные и может быть такое, что в одной теме есть какой-то функционал, а в другой нет. Из-за этого сайт, который получилось создать при помощи одной темы, может не получиться создать при помощи другой.

У многих популярных бесплатных тем есть платные версии, которые дают больше возможностей по настройке внешнего вида. Но всё равно создать сайт на WordPress бесплатно вполне реально.

Тема, которую WordPress использует по умолчанию, нам не подойдёт. При помощи неё не получится создать сайт как в начале инструкции, поэтому давайте её изменим.

Перейдите в раздел «Внешний вид – Темы». Там уже будет три темы. Это официальные темы от разработчиков WordPress, которые они выпускают каждый год, чтобы показать, как за год изменился движок. Функционал стандартных тем довольно ограничен, поэтому в реальных проектах их почти не используют.

Кликните «Добавить новую тему» в нижней части экрана. Откроется библиотека тем, где будет тысячи, если не десятки тысяч вариантов. В правой части экрана есть поиск. Найдите в нём тему Astra. Наведите курсор на неё и кликните «Установить», а затем «Активировать».

Astra — это одна из самых популярных и продвинутых тем. У неё больше миллиона активных пользователей и средний рейтинг 4.9 из 5. Чуть подробнее про её особенности читайте в нашем обзоре:

После активации запустится экран, где вам понадобится выбрать конструктор страниц, при помощи которого вы будете делать сайт. Рекомендуем выбрать стандартный конструктор WordPress — Block Editor. Именно его мы будем использовать в этой инструкции.

Откроется библиотека шаблонов. В ней вы найдёте 150+ готовых сайтов. Некоторые из них платные, некоторые бесплатные. У платных в правом верхнем углу будет пометка «Premium», они будут доступны только после покупки платной версии темы — Astra PRO.

Но не волнуйтесь, чтобы создавать красивый сайт на WordPress при помощи Astra, покупать платную версию темы не обязательно. При создании демонстрационного сайта как в начале инструкции мы использовали только бесплатные инструменты.

Когда увидите симпатичный шаблон, кликните по нему, чтобы рассмотреть поближе и перейти на разные его страницы. Боковую панель можно скрыть. А если понадобится вернуться назад к библиотеке, нажмите крестик в верхнем углу боковой панели.

Затем превью с сайтом исчезнет и вы увидите страницу с заголовком «Okay, just one last step…» (Окей, ещё всего один шаг). На ней тоже можно ничего не заполнять и просто нажать синюю кнопку. После этого запустится импорт шаблона.

Но если вам всё же интересно, о чём идёт речь на этой странице, то здесь вас просят рассказать о себе и дают выбрать, что именно нужно импортировать:

• Import Customizer Settings — настройки темы Astra;
• Import Widgets — виджеты;
• Install Required Plugins — необходимые плагины;
• Import Content — содержимое шаблона;
• Share Non-Sensitive Data — делиться с разработчиками не конфиденциальными данными (чтобы улучшить работу плагина).

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

Ну что, вы импортировали каркас вашего сайта. Следующий шаг — научиться менять настройки темы и работать в редакторе блоков. Чтобы вы могли переделать шаблон под свой бизнес и при необходимости добавить недостающие элементы.

Шаг 5. Создайте дизайн вручную

Это самая объёмная часть работы. В процессе у вас наверняка будет возникать много вопросов. Предвидеть их все — нереально, поэтому мы рассмотрим в этом разделе самые главные из них и дадим ссылки на дополнительные статьи для более подробного изучения отдельных нюансов.

5.1. Глобальные стили

Это вещи, которые будут одинаковыми на всех страницах сайта: цвета, шрифты, стили кнопок. Лучше настроить их первым делом. Для этого перейдите в консоли в раздел «Внешний вид – Настроить». По-другому он называется «Настройщик темы».

В настройщике нельзя менять содержимое сайта, только его глобальные параметры. Слева на боковой панели будут разделы с разными настройками, а справа — ваш сайт, где вы сразу увидите результат ваших действий.

Если вы не импортировали готовый шаблон и ваш сайт пока пустой, в настройщике будет отображаться стандартная демонстрационный сайт темы Astra (как на скриншоте ниже). Когда вы создадите свою первую страницу, демонстрационный сайт исчезнет.

Теперь давайте настроим основные глобальные параметры: цвета, шрифт и кнопки.

Цвета. Перейдите в настройщике в раздел «Глобальные – Цвета». Сверху в блоке «Глобальная палитра» укажите цвета, которые будете использовать на сайте.

Шрифты. Перейдите в настройщике в раздел «Глобальные – Типографика». Сверху выберите одну из шести заготовленных шрифтовых пар, если стандартная пара вам не нравится.

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

Добавить заголовок. Впишите его там, где написано «Добавить заголовок». Он нужен, чтобы вы могли отличать страницы друг от друга в разделе «Страницы». Без него все страницы будут называться «(без названия)».

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

В итоге заголовок страницы всегда выглядит просто как текст на белом фоне. Поэтому его как правило скрывают, а вместо него делают новый при помощи блоков. В следующих подразделах мы покажем, как именно это делается.

Чтобы скрыть заголовок, выберите его и кликните по иконке с изображением глаза. Вы увидите, как после этого область заголовка станет серой.

Не обязательно публиковать страницу сразу. Вы можете сделать это, когда она будет готова. А до тех пор она будет находиться в статусе черновика и будет недоступна для посетителей сайта. В консоли возле такой страницы будет стоять пометка «Черновик».

Изменить URL-адрес. WordPress назначит странице случайный URL сразу после публикации или первого сохранения. Чтобы его изменить, найдите на боковой панели опцию «URL» и кликните по адресу. Появится всплывающее окно, где вы сможете изменить часть, которая идёт после доменного имени.

В результате на боковой панели появится опция «Редакции». Это раздел с историей сохранений, где можно откатиться к предыдущей версии, если нужно. Новые редакции будут появляться каждый раз, когда вы вручную будете сохранять изменения.

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

Чтобы восстановить нужную версию, нажмите синюю кнопку «Восстановить эту редакцию» в правой части экрана.

Открыть предварительный просмотр. Эта опция пригодится, чтобы увидеть страницу глазами посетителя до публикации. Если что-то будет выглядеть не так, как вы хотите, вы сможете это исправить и только после этого опубликовать изменения.

Чтобы открыть предпросмотр, кликните по иконке с компьютером слева от кнопки «Опубликовать» или «Обновить». Во всплывающем окне нажмите «Предпросмотр в новой вкладке».

Другой пример — блоки «Изображение», «Обложка» или «Колонки». У них опций больше, поэтому их для удобства разнесли на две вкладки: «Настройки» и «Стили».

Второй способ — добавить изображение в качестве фона для секции. Именно такой способ мы использовали на главной странице сайта. В этом случае правая колонка остаётся пустой и отыгрывает роль отступа для текста в левой колонке.

Чтобы добавить изображение в качестве фона для секции, выберите этот контейнер, затем перейдите на боковой панели на вкладку «Стиль» и найдите там раздел «Фон». В нём есть опция «Тип». По умолчанию выбран первый тип — «Цвет». Его вы указывали в начале создания секции, он подходит для большинства секций.

Третий вариант в опции «Тип» — это как раз «Изображение». Когда вы его выберите, чуть ниже появится окошко для загрузки изображения с компьютера. Вы также можете загрузить разные изображения для разных типов устройств. Для этого просто кликните по иконке с компьютером рядом с названием опции «Изображение».

Также важный нюанс — размер изображений. Он должен быть как можно меньше. В идеале — до 500 Кб. Если получится ещё меньше, вообще супер. Это нужно, чтобы страница вашего сайта не весила слишком много и не загружалась долго.

Есть бесплатные сервисы вроде TinyPNG, куда вы можете загрузить изображения и сжать их без ощутимой потери качества. С их помощью можно сократить размеры картинок иногда до 80%.

Например, на скриншоте ниже изображение, которое весило 1.3 МБ после сжатия стало весить 380 Кб — на 71% меньше, чем изначально. Это отличный результат.

На этом титульный баннер готов. Теперь точно таким же образом вам предстоит создать остальные секции на сайте. Главное — помните про «принцип 3К», о котором мы говорили в начале подраздела: контейнер, колонки, контент.

Принцип «3К»: Контейнер > Колонки > Контент

Шаг 6. Создайте шапку и подвал

Это делается в специальном конструкторе в настройщике темы. Перейдите в консоли в раздел «Внешний вид – Настроить». Для создания шапки предусмотрен раздел «Построитель заголовка», для подвала — «Построитель подвала». Функционал конструкторов одинаковый, поэтому в статье мы рассмотрим только построитель заголовка.

6.1. Обзор конструктора шапки

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

Дизайн элементов можно менять на боковой панели слева. На ней будет две вкладки: «General» и «Design». На первой можно менять содержимое, на второй — цвета, отступы, параметры текста.

6.2. Загрузите логотип и фавикон

Выберите элемент «Название и логотип сайта». На вкладке «General» загрузите изображение и задайте его ширину чуть ниже. Можете задать разную ширину для разных типов устройств.

Чтобы создать логотип, можете использовать онлайн-сервисы вроде My Free Logo Maker или Namecheap Logo Maker. Они бесплатные, понадобится только зарегистрироваться.

Либо можете пойти ещё более простым путём — просто набрать в Фотошопе название вашего бизнеса с цветами вашего сайта. При желании можете добавить к нему также бесплатную иконку с сайтов вроде Flaticon.

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

Шаг 7. Создайте блог

Кроме страниц вы также можете публиковать на вашем сайте статьи. Либо чтобы рассказать клиентам больше про свои продукты и услуги, либо чтобы привлекать трафик на сайт при помощи SEO.

7.1. Добавьте новую статью

Делается это в разделе «Записи». Принцип точно такой же как и со страницами: создаёте новую запись, затем добавляете в неё содержимое в редакторе блоков.

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

7.3. Создайте главную страницу блога

Подобно тому как вы указывали главную страницу сайта в настройках WordPress, нужно указать также страницу записей. Для этого создайте пустую страницу, измените её URL. Например, чтобы адрес был https://vashdomen/blog. Затем опубликуйте.

Дальше перейдите в консоли WordPress в раздел «Настройки – Чтение». И в самой первой опции в строке «Страница записей» выберите эту страницу, которую только что создали. После этого на ней в хронологическом порядке начнут отображаться статьи.

Чтобы изменить виджет, перейдите в раздел «Внешний вид – Виджеты». Там вы увидите что-то типа редактора блоков, где можно выбрать нужный виджет по центру и изменить его параметры на боковой панели.

Если нужно, можете добавить новые блоки и создать собственный виджет. Например, отобразить доступные метки при помощи блока «Облако меток» или сделать рекламный баннер при помощи блока «Изображение».

Чтобы долго и нудно не добавлять товары по одному, можно подготовить в Excel табличку и загрузить сразу весь каталог. Это сэкономит кучу времени и сил. Особенно, если у вас в магазине сотни разных товаров.

8.3. Настройте доставку и платежи

Это делается в разделе «WooCommerce – Настройки» на вкладках «Доставка» и «Платежи».

На вкладке «Доставка» вы можете создавать разные регионы, в каждом из которых будут действовать свои способы доставки. Например, один для Украины, а другой для доставки за рубеж. Либо общий регион для всех областей и отдельный только для вашего города (чтобы добавить туда опцию «Самовывоз»).

Также можно устанавливать плагины, чтобы добавить популярные службы доставки на свой сайт. Например, свои плагины есть у таких популярных служб: Нова Пошта, Укрпошта или Meest.

На вкладке «Платежи» вы можете включать и настраивать способы оплаты. По умолчанию это «Прямой банковский перевод», «Чековые платежи» и «Оплата при доставке».

Чтобы добавить другие оплату банковской картой, можно установить плагин популярного в вашей стране платёжного шлюза. В Украине это: LiqPay или Fondy.

8.4. Узнайте больше про создание магазина

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

Это нормально, создание магазина на WordPress — очень объёмная тема. Чтобы её раскрыть, мы выпустили ещё две статьи в дополнение к этой. Каждая из них примерно такая же по объёму, как и эта. В одной статье разбираем настройки WooCommerce и работу с товарами, а в другой более глобальные вещи, такие как письма клиентам, фильтры, акции, дизайн.

Что дальше

Если вы дочитали до сюда, значит вы зашли уже слишком далеко. На этом этапе у вас уже есть понимание как создать сайт на WordPress. Надеемся, всё получается и вы довольны результатом.

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

Оптимизировать сайт. Есть несколько нюансов, на которые стоит обратить внимание, чтобы сайт загружался быстро. Если этого не сделать, со временем он может начать тормозить.

Подключить аналитику. Этот инструмент от Google поможет вам начать отслеживать посетителей сайта: как они попали на него, на какие страницы переходили, сколько времени провели на нём, что купили.

Настроить SEO. Ещё один полезный инструмент от Google, который даст вам понять, по каким запросам в поиске люди нашли ваш сайт. Потом вы можете взять эти запросы и сделать так, чтобы в текстах на сайте были более точные совпадения с ними. Это поможет подняться выше в результатах поиска.

Оставьте комментарий, если какой-то информации не хватает или вы хотите поблагодарить за инструкцию.