Сайт на wordpress с нуля пошаговая инструкция для новичков

WordPress используют Sony Music, The New Yorker, Reuters, TechCrunch, Республиканская партия США, Fortune, многие другие крупные СМИ и организации. Даже Rolling Stones и Snoop Dogg оценили этот движок.

Значит и вам стоит! Переходим к пошаговому руководству.

Почему WordPress

WordPress – самая распространенная на сегодняшний день CMS. По данным независимого агентства Web Technology Surveys за март 2022 года, около 64,8 % всех сайтов в мире использует CMS WordPress. Вот главные причины ее успеха:

• бесплатный «движок» – CMS WordPress распространяется по открытому лицензионному соглашению (GNU GPL), так что его можно свободно использовать даже в коммерческих целях;
• неограниченные возможности – с помощью WordPress можно создать интернет-магазин, личный блог, корпоративный сайт, информационный портал, отраслевой ресурс, галерею мультимедиа;
• гибкая настройка внешнего вида и функциональности – доступны платные и бесплатные шаблоны, с помощью плагинов можно решать технические задачи, обеспечивать необходимую функциональность;
• простота администрирования – чтобы работать с WordPress, не нужны специальные знания, все интуитивно понятно;
• компании предоставляют услугу автоматической установки WordPress на хостинг – не нужно самому искать на официальном сайте дистрибутив, скачивать его и заниматься установкой. Например, Beget, предлагает установить на выбор WordPress или Joomla. Для установки CMS достаточно пары кликов. Мелочь, а приятно.

WordPress – универсальный движок для блогов и других контентных сайтов

Шаг № 1: Выбираем хостинг и регистрируем домен

Делиться фотографиями котиков или вести дневник бодибилдера можно на бесплатном хостинге wordpress.com. Но если у вас коммерческий проект и вы планируете зарабатывать с его помощью – выбирайте платный хостинг.

Чтобы выбрать хостинг-провайдера, посмотрите это видео или изучите гайд в TexTerra Daily. Если на это совсем нет времени, можете обратиться в Reg.ru, Beget, Netangels – этим провайдерам мы доверяем.

Зарегистрировать домен вам тоже поможет хостер. Достаточно придумать доменное имя, убедиться, что оно свободно, и оплатить регистрацию.

Выбирайте доменное имя, частично или полностью совпадающее с названием сайта. Например, для сайта «Одноклассники» хорошие доменные имена – odnoklassniki.ru или ok.ru. Понятно, что имя vk.com этому ресурсу не подходит.

Используйте максимально короткое доменное имя. Владельцам смартфонов сложно ввести в строку браузера длинный адрес, поэтому лучше использовать имя vk.com вместо vkontakte.ru.

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

Выбор доменной зоны не влияет на технические характеристики ресурса или позиции в поисковой выдаче. Однако теоретически этот параметр может влиять на доверие аудитории. При прочих равных пользователи охотнее верят сайтам с адресом vasya-pupkin.ru или vasya-pupkin.com, чем ресурсам типа vasya-pupkin.wordpress.com или vasya-pupkin.blogspot.com. Поэтому для коммерческих проектов старайтесь выбирать домены верхнего уровня, например, .com, .info, .org, .net, .ru, .ua, .by и т.п. Обратите внимание на появившиеся недавно домены первого уровня, например, .club, .guru, .ninja, .expert и другие.

На сайте регистратора вы можете проверить доступность любого интересующего вас домена

Шаг № 2: Устанавливаем WordPress своими руками

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

Перейдите на сайт WordPress, откройте раздел Download и найдите последнюю версию дистрибутива. Скачайте ее:

Помните, что для скачивания дистрибутива нужно зарегистрироваться на сайте WordPress

Распакуйте архив.

Распакованный архив нужно будет перенести в корень сайта

С помощью FileZilla или другого FTP-клиента загрузите файлы WordPress в корневую папку или в субдиректорию. В корневой папке находится файл index.html. Чтобы создать субдиректорию, нужно поместить папку с файлами сайта в корневой каталог. В первом случае сайт будет доступен по адресу www.vash-site.ru. Во втором случае вы установите WordPress на существующий сайт. Он будет доступен по адресу www.vash-site.ru/wordpress/.

Скопируйте разархивированный дистрибутив в корневую папку сайта

Установите WordPress. Для этого откройте ссылку на сайт в браузере. Укажите информацию для подключения к базе данных. Их должен предоставить хостинг-провайдер.

Заполните название БД, имя пользователя / пароль, укажите сервер базы данных

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

Заполните данные о сайте

Если все сделано верно, вы увидите следующее сообщение:

Мы успешно установили WordPress на свой сайт вручную

По основному URL должен открываться сайт.

Сайт открывается и теперь доступен любому пользователю

Вы только что создали сайт на WordPress. Теперь можете войти в панель администрирования и приступить к настройке.

Мы установили несколько плагинов, чтобы добавить недостающие функции

Шаг № 3: Выбираем подходящую тему для WordPress

Дизайн-шаблон, или тема WordPress отвечает за внешний вид и функциональность ресурса. С помощью темы вы можете кастомизировать сайт на стандартном движке.

Лучше выбрать бесплатную или платную тему?

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

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

Какая тема лучше: русскоязычная или англоязычная?

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

Как найти подходящий шаблон в каталоге?

Воспользуйтесь фильтром в каталоге тем. Отметьте нужные опции и примените фильтр.

Или: используйте дизайн-шаблон из подборки «Текстерры».

WordPress обладает одной из самых впечатляющих по размеру коллекцией бесплатных тем

Как установить тему WordPress?

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

Нажмите Добавить новую, чтобы установить новый дизайн сайта

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

Выбираем подходящую тему

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

Если тема подошла, нажмите Установить

Второй способ: скачайте дистрибутив выбранной темы на компьютер. Это должен быть архив в формате .zip. В разделе админки «Внешний вид – Темы – Добавить новую» загрузите и установите шаблон. После загрузки активируйте его.

Чтобы открыть меню ручной загрузки тем, намите кнопку Загрузить тему (напротив надписи Добавить темы)

Вы установили и активировали понравившийся шаблон. Теперь можно приступить к настройке.

Какую тему выбрать для нового проекта? Существуют ли какие-то существенные различия, кроме дизайна, которые влияют на работу сайта? На все эти вопросы даст ответы гайд «100 лучших бесплатных тем для WordPress».

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

Как русифицировать тему WordPress?

Русифицировать тему можно несколькими способами.

Вручную

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

С помощью плагинов

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

Например, можно использовать плагин Loco Translate. После установки и активации надстройки интерфейс для перевода шаблонов появляется в админке сайта. Он тоже работает с языковыми файлами .po и .mo вашей темы, но все делается прямо в браузере.

Loco Translate – удобное редактирование файлов локализации WordPress

С помощью сторонних компаний

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

С помощью специальных программ

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

Русифицировать тему удобнее всего с помощью бесплатной программы Poedit. Скачайте и установите ее на компьютер, а затем загрузите с вашего сайта на компьютер языковые файлы выбранного шаблона с помощью FTP-клиента, например, FileZilla. Также это можно сделать с помощью плагинов, например, File Manager. Если вы его установили, действуйте по следующему описанному ниже алгоритму.

В консоли выберите меню FileManager – Configuration. Настройте конфигурации, как указано на иллюстрации.

Отметьте эти чекбоксы

В меню FileManager – FileManager выберите папку wp-content – themes.

Найдите папку, которую нужно руссифицировать. В нашем случае – это wp-content

Выберите папку темы, которую хотите русифицировать. В ней откройте папку languages.

Нашли папку languages

Скачайте на компьютер файлы en.mo и en.po. Если таких файлов нет, скачайте на компьютер файл с расширением .pot.

Нас интересует файл выбранной темы – realistic.pot

Откройте программу Poedit и выберите опцию «Создать новый перевод».

Выберите этот пункт

Откройте файл перевода и укажите код языка.

Настраиваем язык перевода

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

Добавьте сюда текст на русском языке

Сохраните перевод. Программа загрузит на жесткий диск вашего ПК два файла: ru_Ru.mo и ru_RU.po. С помощью функции Upload files загрузите файлы в папку languages вашего шаблона.

Эти файлы мы успешно загрузили в менеджер

Вы русифицировали шаблон.

Для желающих ускорить процесс перевода, а также посредственно владеющих английским языком или не владеющих им подойдет программка Seraphinite Typing Assistant. Пользоваться ей нужно в паре с Poedit.

Как настроить тему WordPress

Каждый шаблон имеет собственные настройки. Описание настроек дефолтной темы Twenty Nineteen поможет понять закономерности и настроить выбранный шаблон.

В консоли WordPress выберите меню «Внешний вид – Настроить». Откроется страница настройки темы или кастомайзер. Доступные пункты настройки можно увидеть в меню в левой части экрана.

Здесь настраивается дизайн темы

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

Задайте название и краткое описание сайта

В разделе «Цвета» выберите цветовую схему шаблона, а также цвет фильтра закрепленного фото.

Мы задали цвет темы по умолчанию

В разделе «Меню» настройте меню сайта. Нажмите кнопку «Создать меню».

При необходимости можно добавить меню для ссылок на соцсети

Вы можете создать новое меню. Для этого нажмите одноименную кнопку (см. скриншот выше).

Создаем новое меню в теме Twenty Nineteen

Добавьте в меню нужные страницы и нажмите кнопку «Опубликовать».

Кастомизируем внешний вид меню и страницы в нем

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

Что еще важно учесть?

• Выбирайте тему с адаптивным дизайном. Адаптивный дизайн одинаково хорошо отображается на всех устройствах – десктопах, планшетах, смартфонах – и динамически подстраивается под заданные размеры окна браузера.
• Не гонитесь за функционалом. Остановите выбор на теме, которая подходит под ваши задачи. Тема, перегруженная функционалом, будет работать медленнее, что негативно скажется на поисковом ранжировании. Поисковики «любят» быстрые сайты.
• Обратите внимание на количество загрузок и частоту обновлений. Если тема обновляется редко или вообще не обновляется, лучше обойти ее стороной. Такая тема вряд ли будет соответствовать требованиям времени к дизайну, SEO, безопасности.

Шаг № 4: Настраиваем сайт на CMS WordPress

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

Настраиваем CMS WordPress

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

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

Это глобальные настройки сайта

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

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

Настраиваем рубрики, формат записей, публикацию через e-mail

Каждый раз при нажатии на кнопку «Обновить», оповещаются и выбранные сервисы. Чтобы домен не попал в списки ping-спамеров, есть плагин WordPress Ping Optimizer. Установите его и настройте частоту обмена данными об изменениях.

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

Укажите, сколько записей отображать на одной странице и в лентах RSS. Выберите отображение в ленте анонсов статей. Если по какой-то причине не хотите, чтобы поисковики начали сразу индексировать сайт, установите галочку в соответствующем поле. Позже ее можно будет убрать.

Укажите метод формования главной страниц и сопутствующие настройки

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

Уделите внимание полям «Модерация комментариев» и «Черный список». Можете указать признаки, по которым комментарии будут поставлены в очередь на модерацию перед публикацией или окажутся в списке «Спам». Эти настройки сработают, если вы пользуетесь дефолтными комментариями WordPress.

Задайте настройки по умолчанию, касающиеся секции комментариев сайта

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

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

Настраиваем вид постоянных ссылок на сайте

Шаг № 5: Решаем практические задачи с помощью плагинов для WordPress

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

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

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

Как с помощью плагинов обеспечить безопасность сайта на WordPress

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

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

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

• WP Database Backup – пока не переведен на русский;
• BackUpWordPress – есть русская версия, но реже обновляется;
• Backup and Restore WordPress – не русифицирован.

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

Кликните Установить

Нажмите кнопку «Установить». После установки активируйте плагин. Теперь настройте параметры резервного копирования. Выберите меню «Инструменты – WP DB BackUp». Нажмите Create New Database BackUp. Вы создали резервную копию по требованию.

Нажмите синюю кнопку Create New Database BackUp

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

Удобно, что бэкап будет формироваться автоматически (каждый час, дважды в день, ежедневно или реже)

На вкладке Destination включите автоматическое сохранение архива на Google Drive или отправку на электронную почту.

В строке Email ID укажите свой адрес электронной почты

Чтобы защитить сайт от несанкционированного доступа или взлома методом перебора или брутфорсинга, воспользуйтесь одним из этих плагинов:

• Loginizer Security – один из самых популярных плагинов-защитников, надежно защищает сайт от взлома методом перебора или брутфорсинга;
• Login Lockdown – можно задать максимальное количество попыток входа с одного IP в единицу времени, продолжительность такой блокировки.

Есть плагины, которые объединяют в себе сразу несколько функций защиты. Это удобно. Рекомендую обратить внимание на комплексные решения по защите сайта, например, на плагин iThemes Security. У iThemes Security широкий функционал для защиты от внешних угроз:

• создание резервных копий;
• обнаружение ошибок с кодом 404;
• блокировка отдельных пользователей;
• защита от хакерских атак;
• отслеживание изменений на сайте;
• скрытие страницы входа в административную панель;
• SSL-шифрование;
• принудительное использование надежных паролей;
• множество возможностей для тонкой настройки системы «под себя».

Главные настройки Loginizer Security

Как бороться со спамом на сайте WordPress

Плагины для борьбы со спамом актуальны, если вы пользуетесь встроенным механизмом комментариев WordPress. Сторонние системы, например, Disqus, защищаются от этого самостоятельно.

Защититься от спама можно с помощью Akismet или Antispam Bee. После установки Antispam Bee плагин работает в фоновом режиме. Обычно подходят дефолтные настройки, а если нужно что-то поменять, перейдите в меню админки «Настройки – Antispam Bee».

Antispam Bee эффективно защищает сайт от спамных комментариев

Еще один хороший плагин, который использует технологию reCaptcha компании Google, называется Advanced noCaptcha & invisible Captcha – спам фильтруется с помощью искусственного интеллекта. Для настройки необходимо зарегистрировать свой сайт в Google, выбрать версию капчи и получить два ключа – обычный и секретный, чтобы использовать их с плагином.

Пример капчи, которую добавил Advanced noCaptcha & invisible Captcha в секцию комментариев

Как обеспечить SEO сайта на WordPress

WordPress – SEO-дружественная CMS по умолчанию. Но есть задачи, без которых сайт нельзя считать полностью соответствующим требованиям поисковых систем. Вот они:

• создание и обновление карты сайта;
• канонизация URL;
• оптимизация title страниц;
• автоматическая генерация мета-данных страниц;
• блокирование индексации дублированного контента;
• создание микроразметки страниц;
• добавление файлов .htaccess и robots.txt.

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

• Google XML Sitemaps;
• Google Sitemap by BestWebSoft.

Установите и активируйте выбранный плагин, например, Google XML Sitemaps.

Страница настроек плагина-генератора карты сайта

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

Создали карту сайта, благодаря XML Sitemaps

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

Для технической оптимизации ресурса воспользуйтесь одним из следующих плагинов:

• All in One SEO Pack;
• WordPress SEO by Yoast.

Установите и активируйте выбранный плагин, например, All in One SEO Pack. Используйте настройки по умолчанию, если вы только знакомитесь с WordPress. Если считаете себя продвинутым веб-мастером, можете изменить некоторые настройки SEO-модуля. Для этого выберите меню All in One SEO в консоли движка.

Новый интерфейс All in One SEO Pack

Обратите внимание на перечисленные ниже настройки.

В разделе «Основные настройки» уберите флажок напротив пункта Use Schema.org Markup. Размечать страницу лучше с помощью отдельного плагина.

Если в качестве главной используете страницу записей, в разделе «Настройки главной страницы» укажите title, description и keywords. Если в качестве главной используется статическая страница, установите флажок в поле «Включить».

Статическую главную можно использовать (или не использовать) в качестве главной страницы

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

Скопируйте в буфер обмена этот метатег

Вставьте ее в поле «Инструменты вебмастера Google» на странице настройки плагина.

Вставьте код в строку «Инструменты вебмастера Google»

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

Для разметки страниц воспользуйтесь одним из следующих плагинов:

• Связка WPSSO и WPSSO JSON. Первый плагин базовый, а второй представляет собой расширение. С помощью базового решения на сайт можно добавить разметку Open Graph. С помощью JSON-LD реализуется разметка Schema.org.
• WP SEO Structured Data Schema. С помощью данного плагина на сайт можно добавить несколько типов разметки Schema.org, включая Article, BlogPosting и Review. Разметка реализуется с помощью JSON-LD.
• Плагин Schema App. С помощью этой программы на сайт можно добавить разные типы разметки Schema.org. Она реализуется через JSON-LD. Бесплатная версия поддерживает базовые типы разметки. Также для разметки можно использовать онлайн-генератор, если вы хорошо понимаете базовые принципы разметки Schema.org. Установите и активируйте плагины WPSSO и WPSSO JSON. В консоли на странице настроек плагинов в разделе Essential Settings укажите информацию о сайте, а также сведения для разметки Open Graph. Не меняйте другие настройки.

Заполните главные сведения о сайте

Перейдите в раздел Google and Schema. В полях Organization Logo Image URL и Organization Banner URL укажите URL логотипа и баннера сайта. Эти изображения могут использоваться на странице поисковой выдачи.

Дайте URL на изображения логотипа и баннера компании

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

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

Тип разметки BlogPosting – производное Article. Кроме BlogPosting к частностям Article относится тип разметки News Article или «Новость». То есть BlogPosting содержит все семантические данные разметки Article.

Используйте тип BlogPosting, если публикуете небольшие заметки, личные наблюдения и впечатления, как в «Живом Журнале». Тип Article больше подойдет для обзоров, аналитических статей, руководств, как в блоге «Текстерры». Для статических страниц и страниц медиафайлов нужно указывать тип WebPage.

Выберите тип данных

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

Краулер увидит тип данных BlogPosting и контент на странице будет проиндексирован корректно

Что делать, если вы публикуете материалы разного типа: лонгриды, небольшие заметки и новости? В этом случае для каждой публикации лучше выбрать подходящую разметку. Вместо надстройки WPSSO JSON воспользуйтесь плагином WP SEO Structured Data Schema.

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

Обязательные параметры для каждого типа данных будут разными

Недостаток плагина – необходимость размечать каждую публикацию вручную. А к преимуществам можно отнести поддержку дополнительных типов разметки, например, Review, Product и Aggregate Ratings. Бесплатная версия WPSSO JSON не поддерживает эти типы.

Как повысить функциональность и юзабилити ресурса

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

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

Начните улучшение юзабилити с латинизации URL сайта. Обратите внимание на ссылку, которую CMS генерирует по умолчанию. В ней есть кириллические символы.

Привет, мир!

Скопируйте URL и вставьте его в комментариях на сайте или в текстовом редакторе.

Семантический URL нужен как раз, чтобы не было такого результата

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

Эту проблему можно решить с помощью Cyrlitera – транслитерация ссылок и имен файлов или аналогичного плагина. Для этого достаточно установить и активировать выбранный модуль.

Сделали семантический URL

Добавьте на страницы кнопки шеринга социальных сетей. Эту задачу можно решить разными способами. Например, установите и активируйте плагин Head, Footer and Post Injections. Это полезная надстройка: с ее помощью можно добавлять произвольный код на все или отдельные страницы сайта.

Выберите сервис шеринга, например, Pluso. Настройте блок «Поделиться» и скопируйте предложенный системой код. В админке сайта перейдите в меню «Настройки – Header and Footer». Откройте вкладку Posts. Вставьте код после или перед публикацией.

Вставьте сюда код кнопок шеринга

Сохраните изменения, проверьте, как отображаются кнопки.

100+ бесплатных плагинов для бизнес-сайтов на WordPress

Шаг № 6: Устанавливаем коды сервисов аналитики и подключить сайт к кабинетам для веб-мастеров

При установке плагина All in One SEO Pack вы уже подключили ресурс к кабинету для вебмастеров Google. Подключить сайт к «Вебмастеру», «Метрике» и Google Analytics поможет установленный ранее плагин Head, Footer and Post Injections.

Зарегистрируйте сайт в указанных сервисах. Инструкции по регистрации можно найти в гайдах «Текстерры» по «Яндекс.Вебмастеру», «Метрике» и Google Analytics.

После регистрации в сервисах скопируйте коды отслеживания или теги верификации и вставьте их на сайт. Для этого перейдите по вкладке Head and footer на странице настроек плагина.

Сюда нужно вставить код Google Tag Manager (или другой веб-аналитики)

Подключить любой внешний сервис можно с помощью диспетчера тегов Google. Код Tag Manager нужно установить в разделы head и body каждой страницы сайта с помощью Head, Footer and Post Injections. О работе с диспетчером тегов можно прочитать в нашем руководстве.

Шаг № 7: Создаем страницы и записи на сайте под управлением WordPress

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

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

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

Как создать статическую страницу

Придерживайтесь описанного ниже алгоритма.

Выберите меню «Страницы – Добавить новую».

Чтобы создать новую страницу нажмите кнопку Добавить новую

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

Добавляем новый элемент страницы

Например, чтобы вставить фотографию, выберите соответствующий блок.

Чтобы добавить картинку кликните по этой иконке

Выберите источник фото и положение картинки на странице.

Нажмите Upload, Media Library или Insert from URL

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

После редактирования опубликуйте страницу.

Нажмите кнопку Publish, чтобы опубликовать запись

Проверьте корректность отображения контента. Если нужно, отредактируйте страницу.

Как создать публикацию

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

Чтобы добавить запись, выберите меню «Записи – добавить новую».

Большинство шаблонов поддерживает несколько форматов записи. Выберите подходящий.

По умолчанию используется базовый шаблон

Выберите подходящую рубрику для публикации. Чтобы создать рубрику, воспользуйтесь соответствующим меню.

Для любой записи можно назначить одну или несколько рублик

Классический редактор поддерживает два формата редактирования: визуальный или WYSIWIG (от англ. What You See Is What You Get, «что видишь, то и получаешь») и «Текст» с возможностью использовать HTML. Выберите подходящий. Добавьте заголовок и контент.

Укажите title и description, выберите изображение записи. Опубликуйте страницу.

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

Шаг № 8: Подключаем SSL-шифрование к сайту

Наверняка вы замечали, что у одних сайтов, работающих по протоколу HTTPS, в строке браузера перед названием домена светится зеленый замочек, а у других, работающих по HTTP, – отпугивающая надпись «Не защищено». Чтобы исчезла эта надпись нужно перевести сайт на HTTPS, подключив SSL-шифрование.

Обратите внимание на иконку «Не защищенное подключение»

Протокол SSL (от англ. Secure Sockets Layer – уровень защищенных сокетов) гарантирует безопасное соединение между браузером пользователя и сервером. Защищенное соединение необходимо в случаях, когда передается конфиденциальная информация, например, данные кредитных карт. SSL шифрует эти данные при помощи специальной цифровой подписи. Злоумышленники, перехватив защищенные данные, не смогут их декодировать.

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

Для новичков подойдет бесплатный сертификат от Let’s encrypt. Он выпускается на 3 месяца с возможностью продления. Многие хостеры, предоставляют возможность выпустить как бесплатный, так и платный SSL-сертификат.

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

Как получить SSL-сертификат: переезжаем на криптографический протокол правильно

Нужно ли знать в совершенстве HTML, PHP, CSS для работы с WordPress?

Знания не потребуются, если перед вами стоит задача только наполнять сайт на WordPress, работать с публикациями, комментариями, медиа. Если вы хотите понимать, как работает сайт, и вносить изменения в функционал и дизайн самостоятельно, то потребуются базовые знания этих дисциплин. А еще вы сможете контролировать подрядчиков.

Можно ли на WordPress создать интернет-магазин?

Да, можно. У WordPress имеется множество сторонних разработок и модулей, в том числе для электронной коммерции, например, плагин WooCommerce. Но следует понимать, что WordPress – одна из самых популярных админок в мире. Это означает, что и уязвимости в ней изучены лучше, чем в других админках. Риск взлома выше, поэтому проблеме безопасности придется уделять повышенное внимание.

Приступайте к главному

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

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

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

В конце статьи вы найдете видеоинструкцию по созданию сайта на WordPress.

Почему WordPress и Timeweb?

Это не просто реклама, а обоснованный выбор в пользу наиболее удачных продуктов. WordPress – популярная и бесплатная CMS, покрывающая задачи большинства веб-мастеров. Timeweb – недорогой, быстрый и надежный хостинг.

Вы, конечно, в праве поискать альтернативу, в том числе и бесплатную (плохая идея), но не факт, что все получится гладко и без эксцессов.

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

Настраиваем хостинг и домен

Для начала подготовим хостинг, выбрав тарифный план, установив на сервере CMS и купив свободный домен.

Регистрируем хостинг

Для начала надо обзавестись хостингом. Это вечно функционирующий сервер (компьютер), на котором будет располагаться ваш сайт. Благодаря хорошему хостингу, такому как Timeweb, ваша страница будет доступна тысячам пользователей круглосуточно.

• Заходим на официальный сайт Timeweb.
• Затем кликаем по кнопке «Хостинг» в левом верхнем углу.

• Выбираем пункт «Виртуальный хостинг». 

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

Думаю, для начала подойдет вариант с 30 гигабайтами памяти и 10 сайтами. На первое время должно хватить, а в дальнейшем дополнительное пространство можно докупить, к тому же новым клиентам дается тестовый период на 10 дней. Также отмечу, что лучше выбирать тариф с годовой оплатой: это выгоднее и не придется отдельно платить за домен.

• Потом регистрируем новую учетную запись. Указываем имя и адрес электронной почты.

Сразу после регистрации системы выполнит вход, а вы окажетесь в панели управления (то есть в «админке»).

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

Оплачиваем услуги хостинга

Несмотря на действующий тестовый период, сразу разберем процедуру пополнения баланса.

• Кликаем по иконке в виде кошелька в верхней части экрана.

• Затем указываем переиод аренды и выбираем дополнительные опции (если нужны).

• После этого выбираем удобный способ оплаты. Выбрав удобный способ, жмем на кнопку «Перейти к оплате».

• В случае с картой просто указываем свои данные…

• В случае с Apple Pay или Google Pay жмем на соответствующую клавишу и ждем инструкций от используемых браузеров.

После этого система приема платежей предложит вернуться в панель управления Timeweb, а деньги моментально поступят на счет.

Забираем бесплатный домен

Как я уже сказал ранее, при оплате сразу за год Timeweb дарит домен в зонах .ru или .рф в подарок. Правда, этот бонус нужно активировать.

• В боковой панели админки находим и открываем раздел «Бонусы и промокоды»

• Затем кликаем на кнопку «Активировать» напротив надписи «Бесплатный домен в зоне .рф…»

Тут же будет плашка для ввода промокодов со стороны.

Добавляем администратора домена

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

• Открываем меню «Домены и поддомены» в боковом меню.

• Жмем по ссылке «Администраторы доменов».

• Потом нажимаем на кнопку «Добавить администратора».

• Вводим свои данные (либо данные заказчика, который будет владеть сайтом).

• Потом нажимаем на кнопку «Создать».

Должно получиться вот так. Я вводил данные лишь для примера.

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

Регистрируем домен

Теперь нам нужно заиметь собственный домен. Это будет адрес, по которому люди будут заходить на наш ресурс.

• Опять открываем меню «Домены и поддомены».

• Кликаем по кнопке «Зарегистрировать домен».

• В появившемся текстовом поле вводим имя домена. Оно может быть любым. Главное, чтобы соответствовало нормам интернета и было свободным. Если что, Timeweb подскажет и предложит подходящие варианты. Выбрав имя и ознакомившись с ценой (даже с оплатой бонусами за первый год продление будет стоить денег), жмем на кнопку «Зарегистрировать»

• Потом нажимаем на ссылку «…к основному сайту».

• Выбираем вариант «Не привязывать».

• И сохраняем эту настройку. Полдела сделано.

• Убираем галочку с платного сертификата. Нам он пока не нужен.

Должно быть так.

• Потом нажимаем на фразу «Сумма к оплате», чтобы указать вариант оплаты бонусами (появится соответствующее всплывающее меню).

• Перед нами появится список доменов. Кликаем по вновь созданному.

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

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

Устанавливаем WordPress

Платформа для нашего сайта готова, осталось только установить систему управления WordPress.

• Сначала открываем вкладку «Каталог CMS» в боковом меню.

• Выбираем там WordPress.

• Потом нажимаем на кнопку «Установить приложение».

• В появившемся окошке выбираем домен, на который хотим установить WordPress (в моем случае будет тестовый).

• Затем жмем по кнопке «Начать установку». Процесс займет несколько секунд.

• Фиксируем логин и пароль.

Их, если что, отправят на указанный при регистрации адрес.

• Потом открываем меню «Сайты» в боковой панели.

• Ищем там вновь созданный ресурс на базе WordPress и заходим в него.

Собственно, вот и сайт. Совсем простенький и не самый красивый, но рабочий. Теперь переходим к творческому процессу. Будем превращать безликий WordPress-ресурс во что-то свое.
 

Настраиваем сайт на WordPress

Теперь из административной панели Timeweb мы переползаем в админку WordPress и начинаем работать с ней.

Как зайти в админку WordPress

Тут все просто. Чтобы попасть в админку:

• Надо в адресную строку браузера ввести *название сайта без домена*/wp-admin. Такого рода ссылка приведет в админку WordPress.

• Потом вводим реквизиты админки, которые нам отправили по почте.

Настраиваем внешний вид админки

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

• Заходим и начинаем отключать все, что на текущий момент является лишним и отвлекает. Для этого сначала нажимаем на кнопку «Закрыть» в блоке «Добро пожаловать».

• Потом открываем настройки экрана.

• Убираем галочки везде, кроме пункта «На виду». Он пригодится.

Будет как-то так. Чистенько и не слишком пугающе.

Устанавливаем свежую версию WordPress

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

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

• Потом ищем большую синюю кнопку «Обновить сейчас» и кликаем по ней.

• Через несколько секунд, когда на экране загорится стартовая страница WP, переходим в меню «Консоль» в левом верхнем углу.

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

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

• Выбираем плагины и темы, которые хотим обновить, поставив напротив них галочки.

• Потом нажимаем на кнопку «Обновить…»

Больше никакие обновления не нужны. Теперь вы знаете, как установить свежие версии дополнений в свою CMS.

Удаляем ненужные темы

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

• Сначала наводим курсор на меню «Внешний вид».

• Потом переходим в подменю «Темы».

• Кликаем по теме, которую хотим стереть.

• Нажимаем на кнопку «Удалить» в правом нижнем углу.

• И еще раз подтверждаем, что хотим это сделать, но уже в браузере.

Повторяем это, пока не сотрем все ненужные темы (по сути, все, кроме одной).

Заказываем SSL-сертификат

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

• Возвращаемся в панель управления Timeweb и открываем меню «SSL-сертификаты».

• Затем кликаем по ссылке «Заказать».

• Выбираем бесплатный сертификат.

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

• А потом выбираем домен, которому он достанется.

Уже через несколько часов сертификат будет готов и начнет действовать. А мы в это время продолжим заниматься доработкой сайта. Работы еще полно.

Устанавливаем тему 

Раз уж мы удалили ранее все темы, надо их чем-то заменить. Тем очень много, вы сами это увидите. Исключительно для примера я буду использовать Astra. Она минималистичная и приятная в целом.

• Переходим в раздел с темами, как мы это уже делали ранее.

• Кликаем по кнопке «Добавить».

• Оказавшись в библиотеке тем, ищем поисковую строку.

• Вводим в нее слово Astra.

• Ищем ту самую тему и нажимаем на кнопку «Установить».

• А потом еще и активируем.

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

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

Устанавливаем плагин Really Simple SSL

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

• Жмем на кнопку WordPress в панели управления CMS.

• Переходим в консоль.

• Выбираем подпункт «Добавить новый» в меню «Плагины».

• Ищем в открывшемся окне поисковое поле и вводим туда название плагина Really Simple SSL.

Вот так он называется.

• Потом нажимаем на кнопку «Установить».

• Активируем.

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

Как работать с сайтом

Теперь перейдем к наполнению нашего потенциального блога. Все-таки решающую роль играет контент, а не техническая составляющая.

Добавляем статью в свой блог

Для начала разместим новую статью в блоге, дадим ей название и напишем что-нибудь в редакторе.

• Сначала наводим курсор на кнопку «Добавить» в верхней части экрана и выбираем опцию «Запись».

• Закрываем обучалку с основной информацией о редакторе WordPress (мы все сейчас будем подробно разбирать).

• Тут все интуитивно понятно, прописываем заголовок вверху и основной текст внизу.

Вот как это может выглядеть.

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

Все опции можно посмотреть, нажав на вот эту стрелочку.

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

Добавляем фото на сайт

Теперь разберемся с другой важной визуальной составляющей. Статьи нужно приправить изображениями. Сейчас покажу как.

• Снова нажимаем на плюсик.

• Среди предложенных вариантов выбираем «Изображение».

• В появившемся окошке нажимаем на кнопку «Загрузить».

• Выделяем картинку и нажимаем «Выбрать» (ОК).

Готово. Теперь справа появится блок с настройками изображения. Можно поменять разрешение, например. Или подписать альтернативный текст с ключевыми словами и пояснениями.

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

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

Добавляем другие виды контента

Процедура почти такая же. Я просто пробегусь по некоторым типам контента.

Галерея

Галерея – серия картинок, объединенных в один блок.

• Выбираем соответствующий пункт в меню.

• Потом выбираем изображения, которые нужно объединить в галерею.

Обложка

Обложка – это фон для текста. 

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

• Нажимаем кнопку «Загрузить», чтобы сделать обложку уникальной.

• Выбираем картинку, которая станет обложкой.

Цитата

Цитата – в контексте блога и веб-сайта иногда используется для выделения какого-то участка текста и привлечения внимания. Для настоящих цитат тоже подходит, конечно.

• Кликаем по плюсу и добавляем блок «Цитата».

• Вписываем текст, который будет выделен цитатой.

Заглавное изображение

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

• Открываем пункт меню «Изображение записи» в правой части экрана.

• Потом нажимаем на кнопку «Установить изображение записи».

• Загружаем подходящую картинку.

• Потом выбираем ее в библиотеке WordPress и устанавливаем в качестве основной.

При желании ее можно отредактировать. Уменьшить размер или перевернуть прямо в CMS.

• Снова открываем то же меню и кликаем по нашей обложке.

• Выбираем пункт «Редактировать».

• Редактируем картинку с помощью инструментов, доступных выше.

• А потом сохраняем.

Это все, что я хочу сказать по контенту. Понятное дело, типов контента десятки, а с плагинами их становится еще больше, но эта тема тянет на отдельную статью. Так что разберем ее как-нибудь в другой раз. 

Публикуем нашу статью

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

• В редакторе статьи нажимаем на кнопку «Опубликовать».

• Потом кликаем по ссылку «Посмотреть запись».

И на этом все. Статья опубликована. Теперь ее смогут увидеть все посетители сайта.

А вот так она будет выглядеть на главной странице сайта. В одном списке со всеми остальными материалами.

Редактируем разметку

Теперь покажу, как можно изменить внешний вид сайта. Покажу это на примере изменения разметки.

• Для начала нажимаем на кнопку «Настроить» в верхнем левом углу. Она отправит нас в режим редактирования внешнего вида страницы.

• Выбираем вкладку «Общие» в боковой панели.

• Потом вкладку «Контейнер».

• Затем кликаем по блоку под словом «Разметка».

• Выбираем третий вариант, чтобы контент на сайте занял больше пространства, но без перебора.

Так сайт будет выглядеть более симпатично.

Ищем и обрабатываем изображения

Мы уже работали с изображениями и знаем, как загрузить их на сайт, но не знаем, где их взять и как обрабатывать. Дело в том, что далеко не все из нас фотографы, а просто так тащить фотки из Гугла опасно. Это чревато реальным наказанием в виде большого штрафа. Поэтому нужен легальный способ добывать красивые изображения. Например, использовать бесплатный фотосток Unsplash.

• Заходим на сайт Unsplash.

• Вводим в поиск любой запрос. В моем случае было слово «cats», просто потому что мне захотелось на них полюбоваться. В вашем случае запрос будет соответствовать тематике статьи.

• Находим понравившееся изображение, наводим на него курсор и жмем по специальной кнопке для загрузки.

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

• Заходим на сайт Tinypng и на главную страницу перетаскиваем картинки, которые хотим использовать в статье.

• Ждем, пока завершится процесс компрессии, и нажимаем на кнопку Download All.

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

Настраиваем рубрики, страницы и меню WP

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

Создаем статичные страницы

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

• Сначала возвращаемся в консоль WordPress, находим там вкладку «Страницы» и выбираем пункт «Добавить новую».

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

• Придумываем заголовок и пишем текст.

• И потом жмем «Опубликовать».

После этого мы получим ссылку на новую страницу. 

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

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

Создаем рубрики

Рубрики – это категории статей, созданные для ориентирования на сайте. Объясню на примере: представьте, что ваш блог посвящен разного рода электронике. Вы пишете буквально обо всем. Но люди к вам приходят читать не обо всем, а, например, только об Айфонах. Тогда можно создать рубрику Apple. А внутри нее еще и рубрику «Айфон». Получится, что человек, посетивший страницу, сможет сразу перейти к статьям, посвященным этому гаджету. 

• Наводим курсор на пункт «Записи», потом выбираем подпункт «Рубрики».

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

1. Даем любое имя (зависит от того, о чем пишете у себя в блоге).

2. Указываем ярлык (это текст для ссылок).

3. Выбираем родительскую рубрику (это пригодится, когда будем создавать подрубрики).

4. Коротенькое описание, чтобы понимать, о чем тут вообще идет речь.

5. Пишем описание и нажимаем на кнопку «Добавить новую рубрику».

Все рубрики появятся справа.

Их можно менять и удалять так же, как статьи и другие материалы. Интерфейс в WordPress вообще мало где меняется.

Давайте сделаем подрубрику iPhone, чтобы было понятно, как это работает.

• Вводим название, ярлык и указываем родительскую рубрику (у нас это Apple, естественно).

Затем можно изменить ярлык и название.

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

• Открываем список записей.

• Кликаем по кнопке «Свойства» под статьей, рубрику которой хотим поменять.

• Ставим галочку напротив нужной рубрики.

• Потом нажимаем «Обновить».

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

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

Создаем меню

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

• Наводим курсор на пункт «Внешний вид» и выбираем подпункт «Меню».

• Вводим название будущего меню и создаем его.

• Ставим галочку напротив страниц, которые хотим добавить в меню, и напротив пункта «Основное меню».

• Потом то же самое делаем с рубриками.

• Не забываем это все добавить во вновь созданное меню.

• А потом нажимаем «Сохранить меню».

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

• Снова идем в настройки нашего меню и слегка сдвигаем рубрику iPhone под рубрику Apple (тянем мышью). 

Логично и красиво. А еще куча свободного места появилась на главной странице.

Итак, на этом этапе мы разобрались со структурой. С тем, как ее можно менять, и с тем, какой примерно она должна быть. Теперь серьезнее поработаем над визуальной составляющей. Сделаем сайт еще красивее, чем он есть сейчас. А также скорректируем основные настройки CMS.

Меняем параметры WordPress

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

Сначала открываем основные параметры WordPress, зайдя в соответствующее меню.

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

1. Поменять название.
2. Сделать уникальное описание.
3. Указать корректный адрес электронной почты.
4. Указать язык.
5. Выставить часовой пояс.
6. Настроить формат времени.

Многие параметры выставляются автоматически в соответствии с вашим регионом. То есть в России, например, формат времени 24-часовой. Но если у вас будет много посетителей из других стран, то стоит задуматься о смене формата на западный.

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

Сохраняем изменения и переходим к теме.

Настраиваем тему Astra

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

Переходим к настройкам.

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

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

Общие настройки

Сначала откроем общие настройки. Внутри есть еще четыре вкладки, в которые можно зайти. Рассмотрим все. 

Типографика

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

Для заголовков во второй типографике есть точно такие же настройки. Причем для каждого типа заголовка и подзаголовка (а их много) свои.

На скриншоте видны «Подзаголовок 2» и «Подзаголовок 4».

Цвета

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

Если что, WordPress предупредит, когда вы переборщите и текст на вашем сайте станет откровенно нечитаемым (а люди придут его читать). Ориентируйтесь на мнение WP, если хотите, чтобы посетителям было приятно находиться на странице.

Можно сделать так, если хотите погубить визитеров.

Контейнер

В контейнере уже были. Там можно изменить тип разметки страницы. Лучшее мы уже не сделаем. Другие варианты только ухудшают внешний вид страницы.

Кнопки

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

Шапка

Выходим из подраздела и возвращаемся на уровень выше. Теперь нам нужна категория «Шапка». Мы будем править тут только основную. Тут есть пара важных вещей, на которые стоит обратить внимание.

Айдентика сайта

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

• Просто нажимаем «Выбрать логотип» и загружаем подходящую картинку.

• Нажимаем «Загрузить файлы».

• А потом «Выберите файлы».

И все. Потом можно подкрутить ширину.

Кошка с копибарой тоже подойдут, если их красиво нарисовать.

Во-вторых, фавиконка. Это значок сайта, который видно в поисковике и на вкладках браузера.

• Создаем себе фавиконку.
• Потом нажимаем на кнопку «Выберите иконку сайта».

• Нажимаем «Загрузить файлы».

• Потом «Выберите файлы».

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

Основные шапка и меню

Тут все понятно даже по картинкам. Можно выбрать, как будут располагаться элементы в верхней части страницы и в главном меню (то, что мы недавно сделали).

У меня параметров побольше. Можно тонко настроить визуальную репрезентацию меню, так сказать.

Хлебные крошки

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

Блог

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

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

А что касается меты (короткого описания), то лучше предложить посетителям сначала взглянуть на комментарии, а уж потом на все остальное. Ну и ни в коем случае нельзя вставлять полный текст статьи в сам блог. Это не самая удачная практика. Лучше оставить небольшой отрывок.

Аналогичные настройки есть и для тела статьи. Причем находятся они в том же разделе. Вы легко их найдете.

Сайдбар

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

Можно вставить туда любое меню (мы уже создавали одно, можете повторить или создать новое и встроить его в боковую панель).

Футер

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

Но чаще там оказывается какая-то юридическая информация, на которую 99% посетителей даже не обращает внимания, что неудивительно – нудятина же.

Вы можете поступить иначе и встроить туда виджеты. Причем виджетом может выступать что угодно: контент с других сайтов, картинки, видео, песни, мини-приложения, ссылки, куски других страниц. Если ввести в Google что-то вроде «Виджеты для WordPress», то получите выдачу с сотнями сторонних виджетов. Многие могут оказаться действительно полезными, но настраиваются они не здесь. Тут только включаются.

Для этого надо сделать следующее:

• Выбрать разметку справа.

И внизу тут же появится намек на виджеты. Пока без них, правда.

Еще там есть нижний колонтитул. Туда можно вписать любой текст. Ну или как раз вставить ссылку на свою политику конфиденциальности.

А можно просто написать «Привет».

Меню

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

Виджеты

Вот и виджеты. Мы только что о них говорили. Сейчас быстро разберемся, как их добавлять.

• Выбираем область для виджетов. Можно любую.

• Потом нажимаем на кнопку «Добавить виджет».

• Выбираем виджет, который хотим добавить.

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

Настройки главной страницы

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

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

Дополнительные стили

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

Настройки страниц с помощью плагина Elementor

Собственно, вся возня выше была для установки базиса. Это такой стандартный сайт, на котором можно размещать статьи и другие материалы. Вполне рабочий вариант, даже приятный визуально. Но можно пойти дальше и без знаний кода наворотить себе сайт гораздо красивее. Для этого есть отличный плагин Elementor.

• Открываем меню плагинов в боковой панели и выбираем пункт «Добавить новый».

• Ищем плагин Elementor, устанавливаем и активируем.

• Потом нажимаем на кнопку «Добавить» и выбираем вариант «Страницу».

• Ищем вверху синюю кнопку «Редактировать в Elementor» и нажимаем на нее.

• Кликаем на «Начать».

• Пропускаем обучение и переходим к регистрации в сервисе Elementor, чтобы подключить свой WordPress к нему.

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

• Кликаем по иконке в виде папки в правой части окна.

• Выбираем шаблон. Можно любой доступный в бесплатной версии.

• Потом нажимаем на кнопку «Вставить».

Ваш сайт преображается. На нем появляется страница с готовым дизайном. Вставляем свой текст с картинками и поехали дальше.

Можно добавить не целую страницу, а отдельные куски. Допустим, если вам нужна FAQ-секция или кусок с информацией о команде, работающей над сайтом.

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

На этом все. Так работает Elementor. При желании можно купить Pro-подписку и получить доступ к сотням профессиональных, красиво оформленных тем. Это в разы упростит создание сайта и сделает его довольно серьезным на вид.

Подключаем к своему сайту рекламу

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

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

Находим партнерскую программу

Это первая и, на самом деле, самая сложная часть подключения рекламы. Нужно найти партнерскую программу. Для этого придется зарегистрироваться в сервисе наподобие AdSense или Admitad. Второй вариант вполне ничего. Там есть партнерские программы от М-Видео, Wargaming, Связного и Timeweb. Можно подключить их баннеры. Главное, пройти модерацию. Ваш сайт проверят и дадут возможность сотрудничать с компаниями. Вы начнете приводить к ним новых посетителей, а они вам за это предложат небольшое (или очень большое) вознаграждение.

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

Устанавливаем Ad Inserter

Чтобы встроить код в свой блог, скачаем специальный плагин для WordPress.

• Открываем меню плагины и выбираем пункт «Добавить новый».

• Вписываем в поисковое поле слово Ad Inserter.
• Потом нажимаем «Установить» рядом с названием плагина.

• Потом нажимаем на кнопку «Активировать».

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

Подключаем рекламу к сайту

Начинаем встраивание баннеров.

• Открываем настройки WordPress и выбираем там Ad Inserter.

• Выбираем один из доступных 16 блоков с будущей рекламой.

Вот как можно выглядеть код с рекламой.

• Ставим галочки на тех секциях сайта, в которые мы хотим встроить рекламу.

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

Здесь будет три секции:

1. Установленные виджеты.
2. Элементы сайдбара.
3. Виджеты в футере.

• Мы перетаскиваем виджет Ad Inserter в панель «Основной сайдбар».

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

Вот так будет выглядеть баннер. В моем случае – это выдуманная акция. У большинства компаний реклама сейчас более привлекательная.

Так как я еще в настройках самого плагина выставил позиционирование рекламы, то она появилась и в статьях. Прямо перед изображениями.

Не используйте такую гигантскую рекламу никогда. Это кошмар.

• Еще закинем рекламу в футер. Пусть будет.

• Укажем расположение рекламы в других участках сайта.

• Привяжем рекламный баннер к потолку сайта, чтобы он не исчезал при скроллинге. Поставим для этого галочку Sticky.

Вот как это выглядит в динамике.

Чтобы было удобнее настраивать расположение рекламы, можно нажать на кнопку Ad Inserter. Она сразу же проявит все возможные позиции и предложит установить там рекламу.

Вот одна из возможных позиций.

Оно настраивается вот в этом меню.

Вот какие варианты доступны при настройке в Ad Inserter

Реклама не просто готова, мы еще и распихали ее по всему сайту. Можно спокойно наполнять сайт и получать деньги. 

Разыскиваем контент для сайта

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

Такой можно писать самому. Или можно воспользоваться услугами копирайтеров.

Где искать статьи для блога WordPress?

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

Text.ru – относительно популярная площадка. Тут много людей и бесплатные инструменты для проверки текстов.

Вот как выглядит список востребованных авторов на Text.ru.

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

eTXT – наверное, самая масштабная площадка в РФ. Можно найти сотрудников по самым разным критериям. Пользовательская база реально очень большая.

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

Настраиваем аналитику

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

Подключаем Яндекс.Метрику

Нам понадобится очередной плагин.

• Открываем меню «Плагины» и нажимаем на «Добавить новый».

• Ищем Яндекс.Метрику и скачиваем соответствующий счетчик.

• Потом открываем настройки установленного плагина.

• Видим пустое поле. Заходим на сайт Яндекс.Метрики, регистрируем аккаунт.

Где взять счетчик Метрики?

Теперь нам нужен код для сбора информации о посетителях.

• Затем нажимаем на кнопку «Добавить счетчик».

• Вводим название сайта, указываем его адрес, врубаем «Вебвизор» и соглашаемся с условиями использования.

• Потом создаем счетчик.

• Копируем код со страницы Яндекс.Метрики.
• Вставляем его в пустое окно плагина и сохраняем.

Готово. Теперь на сайте Яндекс.Метрики можно посмотреть всю информацию о вашей аудитории. Очень полезно для внесения изменений в работу сайта и адаптации под нужды клиентов. Это позволит нарастить прибыль.

Заключение

На этом, пожалуй, все. Мы сделали сайт на Worpress, оформили его. Все проверили. Сделали безопасным. Настроили аналитику. Подключили рекламу, чтобы получать деньги. Что еще нужно? Получше разобраться в SEO и нанять хороших копирайтеров. Тогда успех обеспечен. 

Видеоинструкция

Темы

• Я сделал 5-минутную установку. И что теперь?
  • Вход в консоль
  • Начнем с самого верха
• Протестируйте свой сайт WordPress
  • Продолжим нашу экскурсию
• Протестируйте консоль администрирования WordPress
  • Начнем с раздела пользователя
  • Изменение внешнего вида
  • Создание записи
  • Комментарии
  • Предотвращение спама
  • Создание рубрик
• Настройка вашего сайта
  • Поместите ваши записи в рубрики
  • Что дальше?
• Использование тем WordPress
  • Создание собственной темы
• Использование плагинов WordPress
  • Создание собственного плагина
• За пределами основ

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

Я сделал 5-минутную установку. И что теперь?

Вы только что завершили 5-минутную установку WordPress или установку в один клик с вашего веб-хостинга. Итак, каков ваш следующий шаг?

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

Наверх ↑

Вход в консоль

Начните со входа в административную часть или консоль своего веб-сайта. Посетите страницу входа на свой сайт, написав wp-admin после имени домена (например, http://example.com/wp-admin). Некоторые темы также предоставляют ссылку для входа или форму на публичной части сайта. Теперь войдите в WordPress, используя имя пользователя и пароль, которые вы создали во время 5-минутной установки.

Наверх ↑

Начнем с самого верха

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

Вверху экрана находится область, называемая панелью инструментов. Нажмите на название вашего сайта — это ссылка на главную страницу вашего нового сайта WordPress. Нравится? Не нравится? Неважно, просто посмотрите на это. Здесь вы будете проводить много времени!

Наверх ↑

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

Макет, который вы смотрите, определяется темой WordPress. Это внешний вид вашего веб-сайта, стилизация внешнего вида сайта и оформление содержимого. Тема WordPress Twenty Twenty имеет верхнюю часть с заголовком и слоганом для вашего сайта. Справа находится ваше меню, если оно у вас есть. Основная средняя часть страницы — это область содержимого.

Прокрутите страницу вниз и обратите внимание на заголовки и ссылки. Это «подвал». Различные элементы на нем называются виджетами. Так же виджеты могут распологаться на боковой панели (если тема ее поддерживает). В самом низу написано: «Сайт работает на WordPress».

Наверх ↑

Продолжим нашу экскурсию

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

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

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

Наверх ↑

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

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

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

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

Пункты меню следующие:

• Консоль
• Записи
• Медиафайлы
• Страницы
• Комментарии
• Внешний вид
• Плагины
• Пользователи
• Инструменты
• Настройки

Наверх ↑

Начнем с раздела пользователя

Кликните на пункт меню Пользователи. Экран изменится, и вы увидите раздел «Все пользователи», на котором отображается список всех ваших пользователей; отсюда вы можете добавлять или изменять существующие учетные записи пользователей и авторов. В меню навигации кликните на пункт меню «Ваш профиль». Здесь вы вводите информацию о себе, как об авторе и администраторе сайта. Измените информацию при необходимости и нажмите «Обновить профиль», когда закончите.

Теперь давайте посмотрим на некоторые другие функции администратора WordPress.

Наверх ↑

Изменение внешнего вида

Раздел «Внешний вид > темы» позволяет вам изменять внешний вид вашего сайта с помощью различных тем. Темы — это стили представления, которые полностью меняют внешний вид вашего сайта (не путайте с шаблонами!). Созданные разработчиками и пользователями, вам доступны тысячи тем на выбор. На экране внешнего вида вы увидите список установленных в настоящее время тем, включая тему WordPress Twenty Twenty. Чтобы быстро изменить тему, просто нажмите кнопку «Активировать» под одной из перечисленных тем, затем кликните на название своего сайта на верхней панели инструментов, чтобы посмотреть, как он теперь выглядит. Это так просто. Вернитесь к теме оформления и нажмите кнопку «Активировать» под темой WordPress Twenty Twenty, чтобы вернуть дизайн к тому, что было у вас. Для проверки кликните по названию своего сайта на панели инструментов, и вот все стало, как и было.

Наверх ↑

Создание записи

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

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

Наверх ↑

Комментарии

Приятная функция WordPress — это возможность посетителей сайта оставлять свои комментарии под вашими записями. Это создает обратную связь между вами и посетителями. Вы хотите разрешить комментарии к своим сообщениям? Комментарии к записям бывают самых разных форм: от простого (Хорошая работа! Нравится пост!), до обширных обсуждений. Или, может быть, вы ищете комментарии, которые дополняют опубликованную вами информацию. Ответ на комментарии и их модерирование также может занять много времени. Если они важны для вашего сайта, включите их и подумайте, как вы хотите, чтобы они выглядели, чтобы они вписывались в дизайн и макет вашего сайта. Когда вы приняли решение о том, как вы хотите обрабатывать комментарии, найдите время, чтобы прочитать статью о комментариях и вариантах обсуждения WordPress, которая поможет вам настроить эти функции.

Наверх ↑

Предотвращение спама

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

Наверх ↑

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

Сообщения обычно хранятся в рубриках и/или метках, поэтому вы можете хранить связанные темы вместе. Прямо сейчас у вас есть только одна рубрика, но скоро потребуется больше. На вкладке «Записи > Рубрики» в области «Добавить новую рубрику» введите информацию о ней. Продолжайте добавлять свои родительские рубрики вниз по списку. Отложите ввод подрубрик до тех пор, пока не будут введены все основные.

ВНИМАНИЕ: Вы можете добавить любую новую рубрику в любое время, но обратите внимание на тот факт, что их можно сортировать в WordPress двумя способами: по имени (в алфавитном порядке) или по идентификационному номеру. Когда вы создаете новую рубрику, ей присваивается идентификационный номер. Это сложно изменить, поэтому, если вы не хотите, чтобы ваши рубрики были отсортированы по алфавиту, введите их в том порядке, в котором они должны отображаться на экране.

Наверх ↑

Настройка вашего сайта

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

Наверх ↑

Поместите ваши записи в рубрики

Давайте разберем несколько ваших тестовых записей по рубрикам, чтобы вы могли увидеть, как это работает. В разделе Записи > Рубрики кликните вкладку «Все записи». Вы должны увидеть все свои тестовые записи. Когда вы наводите указатель мыши на заголовок любой записи, под заголовком вы должны увидеть ссылки Изменить | Свойства | Удалить | Перейти. Нажмите «Изменить», чтобы отредактировать одну из публикаций. В правой части экрана редактирования записи вы увидите свои рубрики. Выберите одну из них, отметив поле рядом с ним. Затем выше нажмите кнопку «Обновить». Повторите это для других ваших тестовых записей. Теперь просмотрите свою страницу, кликнув на название своего сайта на панели инструментов в верхней части экрана. Вы сейчас видите рубрики, перечисленные на боковой панели? Отлично. Если там не все рубрики, это обычно означает, что в ней нет записей. Это функция WordPress по умолчанию, так что не беспокойтесь. Когда вы добавите в них новые записи, они появяться на ваших веб-страницах. Кликнув на одну из рубрик, и вы попадете на страницу именно этой рубрики. Вы должны увидеть записи, которые попали в эту рубрику. Это сгенерированная страница рубрики.

Наверх ↑

Что дальше?

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

Наверх ↑

Использование тем WordPress

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

• Каталог тем WordPress
• Использование тем WordPress

Наверх ↑

Создание собственной темы

Если вы знакомы с CSS, HTML и даже с PHP и MySQL, рассмотрите возможность изменения темы в соответствии с вашими потребностями или создания собственной темы.

• Справочник разработчика тем WordPress

Наверх ↑

Использование плагинов WordPress

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

• Каталог плагинов WordPress
• Использование плагинов

Наверх ↑

Создание собственного плагина

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

• Руководство разработчика плагинов WordPress

Наверх ↑

За пределами основ

Самое интересное в WordPress то, что здесь есть несколько ограничений. Тысячи людей используют WordPress для ведения блогов и ведения своих веб-сайтов. Например, посмотрите некоторые записи в разделе Витрина тем WordPress.org. Все они имеют разный вид и разный функционал на своих сайтах. Что вы будете делать дальше, зависит от вас, но вот несколько мест, где можно сделать первый шаг, помимо основ:

• Возможности WordPress
• Работа с WordPress
• Семантика WordPress
• Использование страниц
• Исправление проблем
• Использование постоянных ссылок
• Получение дополнительной помощи
• Использование форумов поддержки

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

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

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

1. Блог
2. Новостной сайт
3. Лендинг (мой гайд про лендинг)
4. Сайт визитка
5. Интернет магазин (мой гайд про разработку магазина)
6. Портфолио
7. Онлайн школа (мой гайд про школу)

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

Пошаговое руководство по созданию сайта на CMS WordPress для новичков

Определяемся с тематикой

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

Для вдохновения и поиска идей вы можете посмотреть каталоги сайтов, рейтинги:

1. Рейтинг сайтов от LiveInternet — liveinternet.ru/rating/ru
2. Рейтинг сайтов от Rambler (с разбивкой по тематикам) — top100.rambler.ru

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

Выбрали тематику? Отлично, идем дальше.

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

Домен

Домен (доменное имя) — это имя сайта, то название, по которому посетители будут попадать на ваш блог. У моего сайта домен ichigarev.ru, у вас будет свой.

Как выбрать домен? 3 рекомендации

1. Чем короче слово, тем лучше;
2. Если нужный домен занят, попробуйте добавить цифры или тире, если подходит по логике и продолжает понятно читаться;
3. Если домен на английском, то желательно без использования шипящих букв, иначе это выглядит так (ч — ch, ж — zh и пр.).

Хотите научиться зарабатывать в интернете? Написал большой гайд, где показал 41 метод заработка через интернет — статья по ссылке.

Проверка на занятость

Сервис для проверки занятости домена — timeweb.com/ru/services/domains

Впишите интересующий вариант и нажмите «Проверить домены».

Проверка истории

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

У меня раньше был другой сайт по адресу http://ilyachigarev.ru, давайте сделаем проверку на его примере.

Для проверки предлагаю использовать два метода:

1. Проверка через сервис web.archive.org

Впишите домен и посмотрите покажет какую-либо историю домена или нет. Можно даже увидеть как выглядел сайт и какие были публикации.

Давайте выберем например 26 августа 2013 года и увидим как в это время выглядел сайт

2. Впишите интересующий домен в поисковик

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

Как выберите домен, не спешите его регистрировать, сначала давайте купим хостинг.

Хостинг

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

Обычный хостинг

Его еще называют share (виртуальный) хостинг, это самый дешевый вариант хостинга, отлично подходит для новых проектов, потому что:

• сайт пока что мало весит, то есть нужно мало места;
• и пока что маленькая посещаемость, нужно немного ресурсов для обработки запросов.

Но когда посещаемость сайта перевалит за 1000 посетителей в сутки, вам придется или покупать тариф подороже или переезжать на VDS хостинг. Я так и сделал, когда трафик на моем блоге вырос. Вы же можете сразу купить VDS, если в дальнейшем не хотите заморочек с переносом сайта. Средняя цена обычного хостинга 150 руб./мес.

Я всем советую хостинг Timeweb.

Видеоинструкция

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

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

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

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

VDS/VPS

Если в двух словах, то VDS хостинг выдерживает больше нагрузки и трафика, а еще у ваших сайтов будет выделенный ip адрес. На обычном хостинге тоже можно купить отдельный ip, но за это нужно доплатить, в среднем 100 руб./мес. Средняя цена VDS хостинга 500 руб./мес.

Заметка: VDS и VPS это одно и тоже.

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

Пример регистрации хостинга на примере Timeweb:

1. Выберите вкладку Хостинг;
2. Выберите тариф. Для начала можно выбрать самый простой, если планируете размещать только один сайт;
3. Впишите свой емейл и ФИО, которые требуются при регистрации;
4. После успешной регистрации вам на почту придут данные для входа, логин и пароль;
5. Зайдите с помощью них в панель управления хостингом и пополните баланс. Оплатить можно 1 месяц, можно сразу на год вперед. Лучше платить на год, так получается экономнее;
6. Хостинг готов к работе.

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

1. На главном экране в панеле управления хостингом выберите Домены и поддомены > Зарегистрировать домен;
2. Впишите нужный домен, после проверки на занятость появится зеленая галочка, домен свободен, нажимаем Зарегистрировать:
3. Далее нужно нажать Создать нового администратора и вписать свои правдивые данные, чтобы домен был закреплен за вами, за настоящим человеком. Если вы делаете сайт для кого-то, то вписывайте данные владельца;
4. После всех настроек оплачиваем домен и ждем его активации.

Бонус. Если вы оплатите любой тариф хостинга сразу на 1 год, то вам дадут домен в зоне .ru в подарок! И еще тариф выйдет дешевле, имейте ввиду

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

Установка SSL-сертификата

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

В итоге ваш проект будет доступен по ссылке https://, а не просто http://.

Сертификат я устанавливаю перед установкой WordPress, чтобы в последствии не появилась проблема «смешанный контент», это некоторые файлы сайта открываются по http:// и если есть хотя бы один такой файл, то браузер будет ругаться, пока мы это не исправим.

Для новичков я рекомендую устанавливать бесплатный сертификат Let’s encrypt. Сегодня он почти ничем не отличается от платного. Установили один раз и хостер сам будет его обновлять. Но если все же хотите установить платный, то обойдется он примерно в 1000 руб./ год. Его нужно будет обновлять, либо же сразу купить на 2-3 года и забыть на это время.

Купить платный SSL можно сразу на хостинге.

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

Смотрите также: Как создать онлайн-школу с нуля в 2023 году — подробный гайд (+ мой пример).

Установка движка WordPress

Есть два метода установить WordPress.

1 — вручную
2 — с помощью инструментов хостинга (если такая функция есть у хостера)

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

Видеоинструкция по созданию базы данных (видео с моего курса)

Видеоинструкция по установке WordPress (видео с моего курса)

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

Базовые настройки

Переходим в раздел Настройки и по очереди настраиваем:

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

Общие

• Название сайта — пишем как будет называться ваш проект.
• Краткое описание — пишем 1-2 предложения с использованием ключевых слов по вашей тематике, о чем ваш сайт.

Остальные настройки как правило автоматически сделаны правильно. Сохраняемся и идем дальше.

Написание

• Форматирование — здесь я убираю галочки
• Сервисы обновления — тут вставляю такие значения (можете также скопировать и вставить на своем сайте):

https://blogsearch.google.ru/ping/RPC2
https://blogsearch.google.com/ping/RPC2
https://ping.blogs.yandex.ru/RPC2

Больше ничего не меняю. Сохраняемся.

Чтение

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

Обсуждение

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

Медиафайлы

Я ставлю все значения на 0. Потому что мне не нужна автоматическая обрезка картинки, я ее сам изменяю через редактор Photoshop, и если оставить цифры, то с каждой загруженной картинкой, WordPress будет создавать еще три копии с разными размерами, будет занято больше места на хостинге, а это нам не нужно.

Постоянные ссылки

Ставим чекбокс на «Произвольно» и добавляем запись в строку: /%category%/%postname%.html

Либо просто выбираем пункт «Название записи», это тоже достойный вариант.

Сохраняемся!

Выбор шаблона оформления для сайта

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

Где вообще искать шаблоны и какой выбрать платный или бесплатный?

Я всем рекомендую использовать платные шаблоны и сам на своих сайтах использую только покупные шаблоны. Как правило, в платных шаблонах больше функций, больше настроек, чтобы сделать сайт максимально удобным. Средняя цена за шаблон ≈4000 руб.

Почти все последние проекты я сделал на шаблоне Reboot и конструкторе Elementor. Это лучшая связка для создания любого формата сайта.

Но если вы новичок и/или не хотите тратить деньги, то выбирайте для начала бесплатный вариант. Большая галерея шаблонов находится на официальном сайте https://ru.wordpress.org/themes/

Для удобства я собрал список из 30+ неплохих бесплатных шаблонов на WordPress, можете там поискать вариант для себя.

Когда меня спрашивают порекомендовать хороший платный шаблон для блога, я всегда даю ссылку либо на

• Reboot — универсальный шаблон
• Root — для блога
• JournalX — для новостного сайта
• CookIt — если блог на кулинарную тематику

Эти шаблоны разработали русскоязычные ребята из компании WPShop и на сегодня это лучшее решение для быстрого старта сайта на WordPress.

Шаблоны идеальные, подробнее о них я говорил в этой статье, если интересно почитайте.

Помимо многих преимуществ, одно из главных это админ панель на русском языке. То, что многих тормозит в начале пути создания сайта.

Второй сайт, где я рекомендую покупать шаблоны это ThemeForest. Это уже англоязычный магазин, где продаются тысячи шаблонов. Чтобы не блуждать среди них, посмотрите подборку про 45+ лучших шаблонов для блога на WP.

Подборки шаблонов Вордпресс:

• 40 landing page шаблонов
• 40+ тем для портфолио
• 40+ шаблонов для новостного журнала
• 40+ вариантов для интернет магазина
• 100 шаблонов для сайта визитки
• Онлайн школу я делаю с помощью плагина Memberlux

Остальные подборки на разные тематики ищите тут.

Когда я выбирал, еще не знал про шаблоны от WPShop, иначе сразу выбрал бы Reboot и сэкономил 2 месяца жизни

Советы по выбору шаблона

1. Смотрите как отображается лента статей;
2. Смотрите как выглядит отдельная статья, есть сайдбар (боковая колонка или нет), если вы решите использовать его на блоге;
3. Если есть документация или описание к шаблону, прочитайте какие настройки вы сможете делать после его установки;
4. Если решите использовать бесплатный шаблон, то устанавливайте его через админ панель Внешний вид — Темы. Если скачать со стороннего ресурса, велик шанс словить вирус;
5. Если устанавливаете платный шаблон, то читайте отзывы которые пишут те кто купил тему;
6. Посмотрите когда было последнее обновление шаблона, если больше года назад, то я бы подумал насчет такого варианта. WordPress постоянно обновляется и шаблонам периодически требуются обновления.

Я подготовил отдельную статью с частыми ответами на вопросы по премиум шаблонам, также там есть видео, в котором я рассказываю как правильно выбрать и купить шаблон на ThemeForest — FAQ по премиум шаблонам.

Установка и настройка шаблона

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

1. Настройки темы находятся во вкладке «Внешний вид» — «Настроить», либо «Внешний вид» — [Название темы], либо отдельной вкладкой с названием темы;
2. Настройте заголовок и описание сайта в левом верхнем углу, либо загрузите логотип;
3. Выберите размер и семейство для шрифтов (заголовков и наборного текста);
4. Выберите основные цвета сайта для элементов и шрифта;
5. Сделайте настройки нижней части сайта (подвала).

Примеры панели настроек у шаблонов:

Плагины

Плагины это дополнения для сайта.

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

Как установить плагин

В админке сайта выберите Плагины » Добавить новый » Выберите из каталога WordPress или загрузите свой.

Плагины, которые я рекомендую для каждого сайта:

1. Clearfy Pro
2. Yoast SEO
3. WP Super Cache
4. Antispam Bee
5. All In One WP Security

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

Настройки для улучшения СЕО

Подготовить сайт для СЕО продвижения важно, посетители из поисковых систем это основной источник трафика.

Плагин Clearfy Pro — мега плагин для сайта

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

Это все те же WPShop, чьи шаблоны я рекомендовал выше.

Если не ставить Clearfy Pro, взамен тогда нужно установить:

• Cyr to Lat enhanced — делает транслитерацию символов с русских на латиницу, ссылка на плагин.
• С другими плагинами для чистки кода от мусора я не работал, поэтому информацию можете поискать самостоятельно.

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

Плагин Yoast SEO — улучшаем СЕО

Основной плагин для СЕО. С помощью него мы будем прописывать Заголовок и Описание для каждой статьи, страницы, рубрики. Это мега важно для продвижения.

Также с помощью плагина мы создадим карту сайта XML, которая важна для ПС (поисковых систем).

Ссылка на плагин Yoast SEO

Плагин кэширования (WP Super Cache)

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

Ссылка на плагин WP Super Cache

Файл robots.txt

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

Ссылка на архив с файлом robots.txt. Файл нужно сначала извлечь из архива, откройте его через блокнот и отредактируйте в двух местах, там где site.ru замените на свой домен, а затем сохраните файл и закачайте в корень сайта.

Настройка защиты на сайте

Защищать сайт нужно от двух бед, это спам и взлом.

Antispam Bee — плагин для борьбы со спамом

Для борьбы со спамом я использую плагин Antispam Bee.

All In One WP Security — плагин для борьбы со злоумышленниками

Основной плагин для защиты от взлома. Имеет множество полезных функций. Ссылка на плагин All In One WP Security.

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

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

Дополнения для сайта

Итак, сайт мы создали, настроили шаблон, СЕО и защиту. Теперь давайте посмотрим какие дополнительные элементы мы можем поставить на наш проект, чтобы он был еще более эффективным.

Наиболее популярные дополнения:

Приём оплаты

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

Контактная форма

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

Форма подписки на рассылку

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

• MailChimp
• SendPulse
• Getresponse
• MailerLite
• Unisender

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

Модальное окно (попап)

В данном окне вы можете что-то предложить или перенаправить посетителя на нужную вам страницу, например страницу с акцией или интересной свежей статьей. Также можно добавить форму заявки /подписки в модальное окно. Наиболее популярный плагин из бесплатных это Popup Maker.

Картинки в модальном окне

Частая ошибка на блогах когда при клике на картинку она открывается в новой вкладке, тем самым посетитель уходит со статьи. Чтобы этого не допустить нужно поставить плагин, который будет открывать картинки в попап окне, на случай если этой функции нет в выбранном шаблоне. Ссылка на плагин Easy FancyBox.

Похожие записи

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

Этот элемент есть почти в каждом шаблоне.

Кнопки соцсетей

Связь с соцсетями тоже важный пункт для продвижения блога. Вы можете добавить два вида кнопок:

1. Кнопки соцсетей, которые будут вести на ваши профили/группы, канал на Ютубе. Можно также использовать виджеты.
2. Кнопки, с помощью которых можно поделиться в соцсетях статьей с вашего сайта.

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

• Виджет социальных иконок — плагин для вывода иконок ваших страничек в соцсетях
• Sassy Social Share — плагин для репостов в соцсети.

Рекламные баннеры можно добавлять в сайдбар или в тело статьи: до, в середине или после статьи.

Онлайн чат

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

Могу посоветовать сервис JivoSite. У него есть как бесплатная версия, так и платная версия, которую вы можете в течении двух недель протестировать. Подробный гайд по Живосайту я сделал в отдельной статье — Обзор сервиса Jivosite.

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

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

Делаем начальное наполнение сайта

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

Меню (структура сайта)

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

• Главная — ведет на главную страницу сайта. Можно такой пункт меню не делать, т.к. пользователи привыкли что при клике на логотип попадаем на главную;
• Обо мне / О сайте — страница на которой рассказываете о себе или проекте;
• Блог / Новости — отдельный пункт в меню стоит делать если у вас на главной не лента статей. а например лендинг;
• Контакты — страница с информацией как с вами связаться.

Это база, дополнительно можно придумать миллион других вариантов, например:

• Кейсы / Примеры работ / Портфолио — страница с вашими работами, например у меня так;
• Услуги — описываете свои услуги, у меня так;
• Реклама — тут расскажите какие варианты рекламы у вас есть, у меня так;
• Бесплатно — материалы, которые посетители могут получить/скачать бесплатно, возможно подписавшись на рассылку;
• Курсы / Обучение / Магазин — страница где показываете свой товар, у меня так;
• Полезные ссылки — любые полезные ссылки по теме, я сделал так;
• Видео — страница с видео;
• Инфографика — страница или рубрика с какой-то инфографикой;
• и пр.

Добавляйте пункты в меню в зависимости от ваших целей.

Меню настраивается во вкладке Внешний вид » Меню.

Задайте название для меню и выберите страницы, которые будут в меню. Помимо страниц можно также добавлять Записи, Произвольные ссылки или Рубрики.

Страницы

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

По аналогии создайте и остальные страницы.

Политика конфиденциальности

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

Когда страница будет готова добавьте ссылку на нее в нижнюю часть сайта (подвал).

Записи (статьи)

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

Подробнее про написание статей можете почитать тут:

Как писать СЕО статьи

Как написать популярную статью

Рубрики

Чтобы не запутаться в десятках и сотнях статей, в Вордпресс вы можете из разбить на категории (рубрики). Создать их можете в панели Записи » Рубрики. Когда их создадите и по новой зайдете в редактор статьи, то справа можете выбрать рубрику за которой статья будет закреплена.

Метки

Еще один вариант чтобы объединять статьи по ключевым словам, это метки. Метки можете указывать при редактировании статьи или в панели Записи » Метки. Метки, как правило, отображаются после статьи и при клике на метку открывается список статей в которых также была указана эта метка.

Пример работы рубрик и меток

Разберем пример. У нас есть статья на кулинарном блоге «Как правильно сварить манную кашу на завтрак». Статья будет находится в рубрике «Каши», а метки можем задать «Завтрак», «Детское меню».

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

Заключение

Давайте в заключении я еще раз напишу весь план разработки сайта в краткой форме:

1. Выбираем тематику для сайта, можно подсмотреть варианты в каталогах;
2. Подбираем домен, проверяем его историю, чтобы ранее он не был регистрирован;
3. Регистрируем хостинг и домен;
4. Устанавливаем SSL сертификат, платный или бесплатный;
5. Устанавливаем CMS WordPress;
6. Делаем базовые настройки: Общие, Написание, Чтение, Обсуждение, Медиафайлы, Постоянные ссылки;
7. Выбираем шаблон оформления для сайта, покупаем или качаем бесплатный;
8. Устанавливаем и настраиваем шаблон;
9. Устанавливаем необходимые плагины для СЕО, Защиты, Дополнений;
10. Выбираем какие фишки будут на сайте и настраиваем их;
11. Делаем начальное наполнение, создаем страницы;
12. Создаем политику конфиденциальности;
13. Добавляем меню;
14. Добавляем рубрики;
15. Продумываем будущие метки для статей;
16. Пишем первую статью;
17. Урааа! Мы сделали сайт на WordPress.

Дорогой читатель, вот такой получился подробный гайд по созданию сайта на CMS WordPress, будь другом напиши в комментариях было ли полезно, остались какие-то вопросы, с чем нужна помощь, что подсказать по этой теме? Пиши, не стесняйся

Также читайте статью по теме: Как сделать лендинг за 9 шагов в 2023 году

Гайд написал автор блога Чигарев Илья. Успехов.

09 января 2023

Время чтения: 16 минут

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. Отсутствуют другие ошибки, которые могут сказаться на ранжировании сайта.

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

Заключение

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

09 января 2023

Автор: RuWeb

Время чтения: 16 минут

WordPress – это самая крутая CMS-система для установки на ваш хостинг. Для работы требует практически «дефолтное» окружение, то есть связку PHP+MySQL, плюс, процесс установки сильно упрощен, так что с ним справится любой желающий. Более того, многие хостеры обеспечивают установку этого движка в один клик, поэтому можно сконцентрироваться на самом главном –наполнении сайта.

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

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

Руководство ниже рассчитано на общие типы сайтов – на инфопорталы. Но у нас есть и другие мануалы по ВордПрессу:

Начнём с общего алгоритма, дающего базовое понимание предстоящих действий.

Общий алгоритм создания сайта на WordPress

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

Выбор хостинга и настройка домена

WordPress совместим практически с любым типом хостинга. Под типом хостинга подразумевается shared (он же виртуальный или общий) хостинг, dedicated (выделенный) сервер, виртуальный (VDS или VPS) сервер и готовая облачная инфраструктура.

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

Другие провайдеры предлагают готовые сборки VPS с предустановленным движком, кто-то обеспечивает работу специального серверного кэширования (+набор плагинов для управления) и т.д.

С одной стороны, это очень хорошо, но с другой, сильно усложняет выбор.

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

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

Окончательный выбор провайдера должен учитывать географию вашей аудитории (только для российской аудитории логично выбирать российских провайдеров, а для большего масштаба – лучше крупных западных хостеров), создаваемую нагрузку (по количеству ресурсоёмких плагинов и в зависимости от посещаемости ресурса) и набор вспомогательных услуг (техподдержка, консультации, помощь с дизайном, CDN, защита от вирусов, бэкапы и т.п.).

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

• Стартовое предложение – от 2,75 $/месяц, один сайт в аккаунте, неограниченный диск (без явных лимитов) и трафик, на первый год домен в подарок, SSL-сертификаты от Let’s Encrypt с автоматическим перевыпуском бесплатно, круглосуточная техподдержка, бесплатный перенос, web-почта на своём домене.
• Специальные тарифы для WordPress (в 2,5 раза быстрее стандартного хостинга) – от 5,95 $/месяц, 1 сайт, до 100 тыс. посетителей в месяц, бесплатные бэкапы и системы защиты от атак (CodeGuard и SiteLock).
• VPS-серверы – от 23,95 $/месяц (с предустановленной хостинг-панелью cPanel).
• Выделенные серверы – от 89,98 $/месяц (тоже в комплекте с cPanel).

Во всех случаях, если в комплекте с хостингом вы получаете панель cPanel, установка WordPress выполняется в один клик. Тот же скрипт автоустановки обеспечивает ряд дополнительных функций по обслуживанию движка (обновление, бэкапы и др.).

Если вам нужен RU-домен, то его лучше приобрести через официальных регистраторов национальных доменов. Цены – от 150 до 1500 руб., продление через год может стоить дороже.

Регистрация доменного имени и перенаправление его на хостинг

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

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

Например, для HostGator они будут выглядеть примерно так:

• NS1 – ns1234.hostgator.com
• NS2 – ns2345.hostgator.com

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

У других хостеров NS-записи будут своими.

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

На примере регистратора Reg.ru:

Актуализация данных в DNS-системе может занять до нескольких часов или даже суток (не более 2-х дней).

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

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

С их помощью вы сможете получить доступ к сайту и предварительно настроить движок.

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

Установка WordPress на хостинг

Процедура установки этого движка — одна из самых простых на рынке. Это так называемая пятиминутная установка WordPress.

Фактически нужно только указать параметры доступа к базе данных, придумать название сайта и пароль администратора.

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

Итак, установка WordPress может быть двух видов:

• ручная,
• автоматическая.

Начнём с последней.

Автоустановка (из хостинг-панели)

Самый популярный скрипт-автоустановщик, который используется во многих хостинг-панелях – это Softaculous. Но в некоторых панелях применяются альтернативные решения – Installatron, Fantastico, APS (для панелей Plesk). Могут быть и самописные варианты от хостеров.

В любом случае, установка WordPress будет выглядеть следующим образом:

• Вы нажимаете кнопку установки WordPress.
• При необходимости редактируете отдельные параметры (версию движка, директорию установки, название сайта и его описание, язык и контактные данные администратора) или просто выбираете быструю установку (все значения будут использованы по умолчанию).
• По желанию можно отметить некоторые важные плагины к предустановке (такая опция есть, например, в Softaculous).
• Дожидаетесь окончания установки.
• Готово.

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

Есть даже возможность выбора тем оформления, которые следует добавить к вашему новому движку.

Всё это сконцентрировано на одном экране. Хотите добавляйте и настраивайте, а хотите – нет.

Все данные об установочном профиле (с паролем администратора) будут отправлены на указанный в установщике email-адрес.

У Softaculous есть даже функция импорта сайта, работающего на WordPress по FTP. С ней процесс переезда будет максимально простым, и никакие услуги техподдержки не понадобятся.

Чем интересно предложение от Softaculous (кстати, именно оно применяется в паре с cPanel у HostGator), так это специальный WordPress-менеджер. Он облегчает работу с сайтом даже после установки движка:

• работа с резервными копиями (есть возможность сохранения бэкапов на внешние облачные хранилища),
• клонирование сайтов и версионирование (staging, разбивка на стадии, опция очень интересна для web-разработчиков),
• сброс/смена пароля администратора,
• отслеживание обновлений движка, плагинов и тем оформления.

Ручная установка (для профи)

Классический вариант, который будет доступен даже тогда, когда у хостера нет никаких автоустановщиков.

Настройка сайта WordPress (общие пункты)

WordPress – это универсальный движок. На нём можно сделать всё, что угодно. Но для этого его нужно правильно «приготовить»: установить недостающие плагины и темы, настроить их и сам движок. Очень здорово, что практически все действия в WordPress выполняются в несколько кликов из админ-панели.

Ниже мы разнесём настройки, относящиеся просто к сайту, и техническое SEO (плагины и опции, способствующие лучшему продвижению в поисковых системах).

Установка и настройка темы (шаблона)

Шаблон в WordPress – это не просто стиль оформления. В него могут быть вынесены многие важные функции. Именно поэтому общую настройку сайта нужно начинать с шаблона.

Дело в том, что многие премиум-темы для WordPress поставляются с набором плагинов, которые существенно расширяют и дополняют функционал шаблона. Таким образом, на выходе вы получаете готовый тематический сайт по принципу «всё в одном»: форум, доску объявлений, сайт туристического агентства, сайт школы и т.п.

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

Всё очень индивидуально.

Если вам нужны «просто темы» – используйте для поиска штатный магазин дополнений WordPress. Хотя и здесь слово «просто» будет весьма условным.

Настройки шаблонов можно разнести на два типа:

• Системные настройки (базовые опции, которые обязательно должны быть во всех темах) – за них отвечает WordPress.
• Опции самого шаблона (есть не во всех темах, обычно реализуются в виде дополнительного пункта админ-панели WordPress) – это всё то, что посчитали нужным вынести для настройки разработчики темы.

К системным настройкам обычно относятся:

• Свойства сайта (название, краткое описание, иконка, логотип).
• Цвета (общий фон, фон заголовков, подвала, главный цвет темы и т.п.).
• Меню.
• Виджеты.
• Настройки главной страницы (например, можно организовать вывод ленты материалов из блога или отображение статичной страницы).
• Дополнительные CSS-стили.

В опции самой темы может быть вынесено гораздо больше настроек:

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

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

Начиная с WordPress 5.9 был добавлен новый инструмент работы с внешним видом тем – Редактор сайта.

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

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

Единственный нюанс – для работы с редактором сайта требуется совместимая тема (пока такой функционал обеспечивают не все шаблоны). Такие темы называются блочными.

Как устанавливается шаблон WordPress:

• Из официального каталога. В админ-панели переходите в раздел «Внешний вид» -> «Темы» -> «Добавить»… и ищите нужную тему. Есть разные критерии фильтрации и функция предпросмотра. Когда вы нашли то, что искали, просто нажмите кнопку «Установить».
• Из архива на ПК. Предполагается, что вы нашли тему на любой внешней площадке или вообще создали свою с нуля. «Внешний вид» -> «Темы» -> «Добавить» -> кнопка «Загрузить тему».
• Через сервер/хостинг. Подключаетесь к серверу по FTP/SFTP или открываете каталог в web-интерфейсе файлового менеджера – wp-contentthemes. Сюда загружаете файлы темы (уже в распакованном виде или в виде архива, и затем распаковываете на сервере как вам удобно). После этого шаблон отобразится в списке установленных в разделе «Темы».

Так как тем может быть установлено очень много, вам нужно выбрать ту, что будет работать по умолчанию – для этого нажмите кнопку «Активировать». Активной может быть только одна тема.

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

На крайний случай всегда можно воспользоваться встроенным редактором шаблонов. «Инструменты» -> «Редактор тем». Он позволяет править исходный код тем WordPress прямо на лету. Есть подсветка синтаксиса и разбивка на отдельные файлы (в соответствии с макетом).

Как русифицировать тему WordPress

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

• Вручную заменить строки перевода внутри шаблона на русский язык (будет работать в любых темах, но потеряется возможность быстрого переключения языка для мультиязычных сайтов).
• Использовать плагины, такие как Loco Translate. Вся работа с переводом будет осуществляться в админ-панели WordPress.
• С помощью бесплатной программы PoEdit. В файлах шаблона нужно найти файлы перевода, например, En_en.po, скопировать их и переназвать в соответствии с русской локалью (Ru_ru.po). Затем открыть в программе PoEdit и добавить свои строки перевода на русском. Сохранить. Скопировать в каталог темы полученные на выходе файлы «ru_RU.po» и «ru_RU.mo». Последний наиболее важен, так как именно он будет считываться CMS-системой.

У каждого из подходов есть свои особенности и недостатки.

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

Обратите внимание, необязательно переводить абсолютно все строки. Вы можете ограничиться только теми, что используются в видимой для пользователей части сайта. Например, многие темы поставляют файлы перевода «с запасом» на случай, если вы активируете плагин интернет-магазина, форума и т.п., 90% файла с переводом может относиться к административной части.

Правила реагирования на комментарии, защита от спама

Сразу после установки в общих настройках сайта отключите галочки:

• Пытаться оповестить блоги, упоминаемые в статье.
• Разрешить оповещения с других блогов (уведомления и обратные ссылки) для новых записей.

Обе могут использоваться для бомбардировки спамом.

Наоборот, нужно поставить галочку к пункту:

• Комментарий должен быть одобрен вручную.

Так вы сможете эффективно отсечь весь поток спама, который потечёт на ваш сайт в исполнении различных ботов.

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

Лучшие плагины для защиты WordPress от спама:

• Advanced noCaptcha & invisible Captcha (визуально для конечных пользователей ничего не меняется, даже капча никакая не показывается, но все комментарии ботов автоматически блокируются или удаляются, в зависимости от настроек).
• Akismet Spam Protection (это предустановленный плагин от крупнейших вендоров, компании Automattic, которая создала и поддерживает лучший плагин магазина WooCommerce и бесплатные мобильные приложения для WordPress, Akismet проверяет ссылки и контактные данные комментатора в специальной спам-базе, если находятся проблемы, то комментарий блокируется; для подключения к этой базе нужно получить API-ключ, у Akismet есть платные подписки).
• reCaptcha by BestWebSoft (плагин, который добавляет интеграцию с бесплатным и невероятно надёжным сервисом от Google, поддерживает работу со всеми формами ввода, не только с комментариями, умеет делать реКапчу невидимой, часть функций вынесено в платную подписку).

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

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

Кэширование

Чтобы снизить нагрузку на сервер и не генерировать web-страницы каждый раз при новом заходе пользователя, можно создать их статичную HTML-копию и отдавать клиентам в готовом виде, без работы препроцессора PHP.

В этом случае не только снижается нагрузка, но и повышается скорость загрузки, экономится трафик (медиаконтент может храниться на стороне браузера) и появляется возможность использования CDN-сервисов (сети доставки контента), ведь HTML – это тоже статичный контент.

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

• WP Super Cache – номер один в кэширующих плагинах, полностью бесплатный, много важных опций, из недостатков – отсутствует поддержка GET-запросов и все страницы с UTM-метками сохраняются как самостоятельные варианты (не подходит для работы с большим количеством рекламных объявлений).
• W3 Total Cache – умеет обрабатывать GET-запросы, поддерживает большое количество технологий серверного кэширования (Memcached, Redis, OPcache) и минификацию кода (сжатие HTML, CSS и JavaScript).

Если вы планируете рекламировать сайт в сетях контекстных объявлений, то предпочтительнее использовать расширение W3 Total Cache.

Сжатие (оптимизация) изображений

WordPress добавил поддержку lazy-load по умолчанию, но этого недостаточно, чтобы повысить скорость загрузки страниц и улучшить техническую SEO-оптимизацию.

Лучший выход – сжатие всех изображений без потери качества (оптимизация). Это тоже делается с помощью плагинов. Лучшие реализации:

• Optimole (самый высокий процент сжатия при сравнении с конкурентами, поддерживает WebP, совместим с разными редакторами страниц, картинки могут выноситься на хранение на внешние CDN-серверы, базовый функционал бесплатный, но есть и платные подписки).
• Imagify (есть массовая оптимизация изображений со всего сайта, сжатие картинок на лету при загрузке, поддержка конвертации в WebP, но бесплатное использование предполагает не более 20 Мб преобразований в месяц, а это всего 10-20 картинок).
• Robin imagе optimizer (тоже популярный скрипт для сжатия картинок в WordPress, распространяется бесплатно, к платным опциям относится только CLI-интерфейс).

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

Базовая защита от взлома

Злоумышленники могут получить доступ к отдельным директориям сервера и поместить туда свой код/скрипты. Для исключения такого варианта нужно, чтобы хостинг был правильно настроен и защищён от такого типа атак. Если не хотите проблем – выбирайте правильного хостера. А ещё лучше – подключайте дополнительные опции защиты:

• Бэкапы (по расписанию и вручную, хранение файлов должно осуществляется на серверах, которые не относятся к текущему хостеру, периодически нужно проверять работоспособность резервных копий в виртуальной среде, например, на локальном сервере, бэкапы можно реализовывать силами хостера или на стороне CMS с помощью плагинов, таких как BackWPup, All-in-One WP Migration и т.п.).
• Антивирус (отдельная услуга хостера или специальные решения для самостоятельной установки и запуска, есть и реализации в виде плагинов).
• Защита кодовой базы (сервис CodeBlock сверяет правки системных файлов с официальной кодовой базой WordPress, у сервиса могут быть аналоги).
• Автоматическое обновление движка (силами хостера на случай, если вы не смогли настроить автообновление WordPress силами CMS) и плагинов.
• Установка сложных паролей (касается всех пользователей с правами администратора) и нестандартных логинов (не стоит использовать admin, root и т.п.).
• Использование сложных префиксов таблиц в базе данных (почти все скрипты SQL-атак нацелены на префикс «wp_»).

К более кардинальным мерам защиты можно отнести:

• Смена адреса авторизации администратора со штатного /wp-admin, на который ломятся все боты и скрипты для брутфорса (может помочь такой плагин, как Hide My WP Ghost).
• Ограничение попыток авторизации (IP-пользователя заносится в чёрный список, если он не смог авторизоваться за 2-3 попытки).
• Использование комплексных плагинов защиты.

К таким комплексным плагинам можно отнести следующие:

• All-In-One Security (AIOS).
• Wordfence Security – Firewall & Malware Scan.
• Jetpack.
• И др.

Включение HTTPS-версии сайта

Для перевода сайта на защищённый HTTPS-протокол сначала нужно получить SSL-сертификат. Они бывают платными и бесплатными. Первые предполагают официальные юридические гарантии в случае взлома. Вторые нужны только для шифрования трафика между браузером и вашим сервером.

Многие хостинги интегрируют генерацию бесплатных SSL-сертификатов от Let’s Encrypt или от аналогичных сервисов в хостинг-панель.

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

Когда сертификат настроен (добавлен к сайту), остаётся включить поддержку HTTPS в CMS-системе.

Раньше для этого в WordPress требовались специальные плагины или ручная правка таблиц с базой данных. Сейчас для перехода на HTTPS нужно нажать всего одну ссылку в админ-панели (в разделе «Здоровье сайта»).

При желании вы можете сделать принудительный редирект с HTTP на HTTPS-версию через .htaccess-файл в корне сайта (актуально для web-сервера Apache, у других web-серверов могут быть свои настройки).

Как убрать надпись «Сайт работает на WordPress»

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

Обычно надпись размещается в футере сайта (в подвале).

Процесс отключения на примере темы Twenty Twenty-Two:

Готово, на всех страницах сайта, где использовалась часть шаблона «Подвал», теперь не будет копирайта.

Подготовка к продвижению сайта (SEO для WordPress)

Ниже опишем преимущественно техническое SEO-продвижение.

Многие начинающие web-мастера настороженно относятся к поисковой оптимизации, но без неё современным сайтам никак не обойтись. И поверьте, SEO – это не просто прописывание ключей в тексте. Это комплексная работа, результатом которой должно быть создание сайта, полезного пользователям.

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

SEO должно быть только «белым».

Проработка семантического ядра (СЯ)

Чрезмерное использование ключевых запросов в статьях – это попытка переспама, наказывается баном. Существует большое количество метрик, способных оценить качество текста: уникальность, тошнотность, заспамленность, объём «воды» (водность) и т.п.

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

У разных тематик сайтов, в разных сферах деятельности могут быть свои критерии оценки качества. Например, на страницах интернет-магазина вполне логично употреблять слова «купить», «цена», «стоимость» и т.п. Но если те же ключи будут в инфотексте, то это уже с большой вероятностью будет реклама чего-либо. А рекламный материал – не равно информационный. Какой смысл его двигать в поиске по соответствующему запросу?

Ключевые фразы в тексте должны задавать тему.

Также с помощью анализа основных и сопутствующих запросов вы можете понять интересы своей аудитории – что она ищет (что хотят получить пользователи в итоге).

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

Схема примерно такая:

Зачем это нужно? Если вы напишите/создадите контент, который не востребован вашей целевой аудиторией, пусть даже и качественный, но никому нужный, то поисковики не смогут никого к вам привести, так как таких клиентов просто нет.

Для анализа ключевых запросов и составления семантического ядра можно использовать профильный софт или специальные сервисы: Яндекс.Вордстат, KeyCollector, Serpstat, Google Keyword Planner, SemRush и т.п.

Ключевые запросы можно подсмотреть и у конкурентов. Для этого нужно использовать специальные парсеры.

Название сайта и метатеги для главной

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

«Консоль» → «Настройки» → «Общие».

Краткое описание может выводиться в разных темах в качестве слогана или для более понятного и ёмкого описания проекта.

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

Каждый сам решает, как будет назваться его сайт. Но так как название часто участвует в формирование остальных тайтлов (по принципу «Тема статьи – Название сайта») и фактически является важным SEO-элементом, мы рекомендуем здесь использовать название бренда и главные ключевые слова, описывающие вашу деятельность.

Например, «uGuide.ru | Ваш Гид по Самостоятельному Созданию Сайтов».

Для более плодотворной работы с мета-тегами Title и Description в WordPress требуется установка сторонних плагинов. О них расскажем ниже.

Формирование ЧПУ (алиасы, человекопонятные УРЛ)

Одно дело, когда человек видит ссылку вида «сайт.ру/?p=1254», а другое дело – «сайт.ру/information.html».

Сейчас WordPress по умолчанию использует схему /год/месяц/число/заголовок.

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

Например, схема /%postname%.html будет выводить только название материала и добавлять в конце «.html».

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

Пример: текст «https://site.ru/url-новостной статьи/» будет выглядеть после копирования/вставки так:

https://site.ru/url-%D0%BD%D0%BE%D0%B2%D0%BE%D1%81%D1%82%D0%BD%D0%BE%D0%B9-%D1%81%D1%82%D0%B0%D1%82%D1%8C%D0%B8/

Чтобы получить вместо кириллицы латиницу, нужны плагины:

• Cyr-To-Lat
• Cyr to Lat reloaded
• Cyrlitera
• И т.п.

Robots.txt и sitemap.xml для WordPress

Встроенных инструментов для формирования карты сайта у WordPress нет, но для этих задач есть масса готовых плагинов. Это могут быть отдельные специфические решения или комплексные расширения для SEO. Лучшие SEO-плагины для WordPress по принципу «всё в одном» (здесь же можно получить доступ к управлению файлами robots.txt):

• Yoast SEO,
• All in One SEO.

У обоих несколько миллионов активных установок. Многие важные функции доступны бесплатно.

Профильные плагины, только для работы с xml-картой:

• XML Sitemaps,
• XML Sitemap & Google News,
• Simple Sitemap
• И т.п.

Нужно включить плагин и убедиться в том, что он сгенерировал нужную вам XML-карту записей и страниц. Если нет, нужно запустить генерацию вручную (если того требуют настройки плагина).

Ссылки на карты нужно добавить в панелях вебмастера, чтобы ускорить процедуру индексирования сайта и в файле robots.txt.

Файл robots.txt нужен для управления правилами индексации сайта. Здесь вы можете запретить обход внутренних каталогов движка, убрать из поиска «мусор» в виде проиндексированных страниц с результатами поиска и т.п.

Каждый вебмастер сам определяет правила индексирования, поэтому в комплекте с CMS такой файл вы не найдёте.

Документация поисковиков по файлам robots.txt:

• Google
• Яндекс

Пример универсального файла robots.txt для WordPress:

 User-agent: *
 Disallow: /cgi-bin
 Disallow: /wp-admin/
 Allow: /wp-admin/admin-ajax.php
 Disallow: /?
 Disallow: *?s=
 Disallow: *&s=
 Disallow: /search
 Disallow: */embed$
 Disallow: */xmlrpc.php
 Disallow: *utm*=

 Sitemap: https://ВАШ-САЙТ.РУ/sitemap1.xml
 Sitemap: https://ВАШ-САЙТ.РУ/sitemap2.xml

Файл удобнее всего хранить в корневой директории сайта.

SEO-теги для записей и страниц

Как говорилось выше, Title и Description – это важные мета-теги, которые используются поисковыми системами при индексировании и при показе в результатах выдачи.

Из коробки WordPress не имеет отдельных полей, в которых можно прописать свои мета-теги. Чтобы получить доступ к правке мета-тегов, нужны специальные SEO-плагины:

• Yoast SEO,
• All in One SEO.

После установки и активации любого из плагинов в интерфейсе публикации материала (в редакторе) появится специальный блок с полями для ввода Title/Description и с формой предпросмотра результатов поиска.

В качестве альтернативы можно рассмотреть механизм работы с дополнительными полями. Такие поля можно объявить в функциях темы, а можно получить после установки специальных плагинов, таких как Advanced Custom Fields или Advanced Custom Fields: Extended. После этого нужно организовать вывод полей внутри шаблона (для этого нужно отредактировать его код). Способ подходит преимущественно для продвинутых пользователей.

Вывод похожих записей (для перелинковки)

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

Похожие материалы можно выводить с помощью таких плагинов, как:

• Contextual Related Posts
• Yet Another Related Posts Plugin (YARPP)
• Inline Related Posts

Добавление сайта в панели вебмастеров

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

Специальные кабинеты предоставляются многими поисковыми системами. Но для владельцев сайтов из РФ наиболее востребованными будут панели поисковиков Google и Яндекс.

Нужно создать здесь аккаунты и подключить свои сайты. Обратите внимание, HTTP и HTTPS-версия сайта для поисковиков – разные сайты, поэтому если вы не хотите проблем с индексацией контента, сделайте 301 редирект HTTP на HTTPS (в этом случае они будут восприниматься как зеркала).

Для подтверждения прав владения сайтов поисковики обычно предлагают следующие варианты:

• Загрузка в корень сайта специального HTML-файла.
• Внедрение мета-тега (на главной странице).
• Добавление TXT-записи в DNS-систему (будет дольше и тяжелее без опыта).

После того, как сайт добавлен в систему, поисковик поставит его на индексацию (если это не было сделано ранее).

Тут же в панели нужно добавить ссылки на файл robots.txt и на карты сайта (xml-карты), при желании можно воспользоваться другими инструментами: проверка кодов ответов сервера, анализ скорости загрузки страниц, выявление проблем при отображении на мобильных устройствах, валидация микроразметки и т.п.

Подключение систем аналитики и статистики

По аналогии с панелями вебмастера нужно создать личные кабинеты в Яндекс.Метрике и/или в Google Аналитике. Затем в интерфейсе сервисов нужно добавить новый счётчик и получить код для вставки на страницы сайта.

Вставка кода может осуществляться:

• вручную в редакторе тем напрямую в коде шаблона, например, в файле header.php, внутри тега <head> </head>;
• через специальные поля в настройках шаблона (при наличии);
• с помощью специальных плагинов (например, Site Kit by Google, GA Google Analytics, Yandex Metrika и т.п.).

Дальнейшие работы по продвижению

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

Поэтому:

• Изучайте данные систем метрики.
• Мониторьте ошибки и проблемы в панелях вебмастера.
• Запускайте рекламные кампании.
• Используйте силу социальных сетей (заведите там свои страницы и активно привлекайте клиентов на основной сайт).
• Добавляйте новые функции и разделы.
• Тестируйте гипотезы.
• И т.д.

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

Наполнение сайта на WordPress

Немного сориентируем по таким шагам, как создание контента и настройка элементов навигации.

Начнём со структуры сайта.

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

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

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

Пример хлебных крошек крупного СМИ-портала:

• Новости → Политика → Актуальные темы

Пример категорий интернет-магазина:

• Электроника → Смартфоны → Конкретный бренд

И так далее.

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

В качестве средств таксономии в WordPress есть система рубрик и тегов. Причём теги при необходимости можно оперативно конвертировать в рубрики.

Для создания новой рубрики (категории материалов) нужно:

• Перейти в консоль сайта.
• Открыть раздел с записями.
• В боковом меню (слева) выбрать пункт «Рубрики».
• Откроется специальный интерфейс. По умолчанию в WordPress уже есть базовая категория материалов/записей – «Без рубрики». Сюда будут попадать любые записи, которые вы забыли соотнести с какой-либо конкретной категорией.
• В форме создания новой рубрики нужно указать её название, ярлык (алиас, то есть ЧПУ, поэтому для ярлыка лучше использовать латиницу), родительскую рубрику и описание.

Многие темы WordPress не отображают описание категорий, но есть такие, которые умеют это делать.

Если вы ранее установили плагины транслитерации, то можете не заполнять поле с ярлыком, система автоматически будет конвертировать название в ЧПУ.

Не все SEO-плагины добавляют возможность управления мета-тегами рубрик. Такой функционал точно есть в плагине Yoast SEO. Для этого нужно выбрать пункт «Редактировать» у конкретной категории.

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

Чтобы исправить такую ситуацию, нужно будет править код движка. Ранее был плагин Rich Text Tags, но сейчас он заброшен и признан несовместимым с актуальной версией движка.

Уровень вложенности рубрик может быть любым.

Интересная особенность WordPress – вы можете создавать рубрики практически на лету, прямо в интерфейсе публикации нового материала. То есть вам не обязательно создавать отдельно категории, а потом наполнять их записями, всё можно делать одновременно. Единственно неудобство – потом нужно будет отдельно добавлять описания рубрик и при желании править их URL (ярлыки).

Создание (редактирование) меню

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

Внешний вид → Меню → Добавьте элемент меню

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

В качестве отдельных пунктов можно использовать:

• Страницы,
• Записи,
• Произвольные ссылки (в том числе, ведущие на внешние сайты),
• Рубрики.

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

Для новых тем, которые рассчитаны на редактор сайта, меню создаются и настраивается как один из блоков интерфейса:

• Редактор → Добавить → Блоки → Тема → Навигация → Выбрать меню → Управление меню

Дальнейшая работа аналогична стандартному конструктору меню.

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

Страницы в WordPress – это такой вид материалов, который предназначен для описания каких-либо статичных материалов. Например, для описания компании, для размещения правил пользования ресурса, политики конфиденциальности и т.п.

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

Хотя чисто технически страницы мало чем отличаются от записей. И там, и там можно создавать иерархическую структуру (за счёт выбора родительских страниц), разрешать комментарии, добавлять изображения, пользоваться блочным редактором Gutenberg и т.п. Ссылки на них можно выносить в меню.

Из отличий: у страниц нет тегов (меток) и нет деления на категории (рубрики). Хотя и это может быть исправлено за счёт установки специальных плагинов.

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

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

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

Из предустановленных страниц WordPress предлагает использовать готовую политику конфиденциальности (полностью переведена на русский язык).

Создание записей

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

Как должен выглядеть процесс размещения новых записей в WordPress:

Что относится к дополнительным настройкам:

• Управление видимостью записи – доступна всем, личная и защищена паролем.
• Время публикации – немедленно или в запланированную дату/время (управление датой публикации работает и в обратном направлении, вы можете выбрать любое прошедшее время).
• Выбор автора публикации (при наличии соответствующих прав).
• Необходимость согласования (если у вас большой коллектив авторов и есть редакторы/корректоры).
• Выбор рубрики – запись может соотноситься одновременно с несколькими категориями, новую рубрику можно создать, не покидая страницу редактора.
• Добавление меток (ранее теги) – можно вводить текстом, и тогда соответствующие страницы создадутся автоматически, а можно выбирать из уже имеющихся.
• Установка изображения записи – может использоваться для разных технических задач, например, вывод в ленте записей, работа в качестве элемента микроразметки и т.п.
• Указание отрывка записи – минианонс, который тоже удобно выводить в ленте или в качестве описания в микроразметке.
• Управление обсуждением – можно разрешить или запретить комментарии к статье.
• Выбор шаблона – на случай, если у вас используется разное оформление для отдельных типов материалов, например, для рекламных статей.
• Управление постоянной ссылкой – вообще URL формируется автоматически исходя из заголовка записи + этот процесс может корректироваться плагинами, о которых мы упоминали выше, но вы всегда можете отредактировать ссылку вручную.
• Сохранение черновика – чтобы можно было вернуться к процессу редактирования позже.

Отдельными плагинами могут предоставляться дополнительные поля и элементы управления:

• Мета-тег Title,
• Мета-тег Description,
• Похожие записи
• И т.п.

Но как же с основной работой, с наполнением контентом? О том, как работать с телом статьи – ниже, в возможностях Гутенберга.

Возможности редактора Gutenberg

Начиная с 5 версии WordPress взял курс на более гибкий процесс редактирования контента. Используя за основу принципы популярных блочных конструкторов страниц, таких как Elementor или Visual Composer, было разработано собственное абсолютно бесплатное решение – Gutenberg.

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

Процесс работы в Gutenberg одновременно и прост, и сложен.

Чтобы собрать в нём новую запись или страницу, нужно:

• Выбрать нужный блок из списка доступных и переместить в тело записи.
• Нажать на блок и приступить к его редактированию/наполнению.
• Во всплывающем меню и в боковой панели доступны опции тонкой настройки внешнего вида и поведения блока. Они зависят от конкретного типа блока.
• Блоки можно перемещать по странице в произвольном порядке, при этом их содержимое будет оставаться неизменным.
• Для создания более сложных комплексных элементов блоки можно группировать или сохранять в виде частей шаблона.
• Вместо стандартных блоков, которые ещё нужно настраивать под себя, можно использовать готовые паттерны (их выбор просто огромный, они поставляются пополняемой онлайн-библиотекой).
• Если набора предустановленных блоков недостаточно, вы можете расширить их за счёт специальных плагинов.
• Когда структура статьи/страницы готова, и вы изменили содержимое блоков на нужное вам (+ актуализировали параметры внешнего вида блоков), материал можно публиковать.
• Если вы хотите убедиться в том, что всё работает и выглядит так, как вы задумали, воспользуйтесь предпросмотром страницы/записи без публикации.

Что есть в базовом наборе блоков редактора Gutenberg:

• Все самые востребованные текстовые блоки – списки, цитаты, абзацы, таблицы, блоки кода и т.п. Для особых случаев есть блок «Классический», который представляет собой поле ввода с привычными органами управления и редактирования, как в старой версии редактора на основе TinyMCE (из WordPress 4 и ниже).
• Блоки для работы с медиаконтентом – изображения, галереи, обложки, блоки для вставки файлов, видео- и аудиозаписей, готовые карточки с секциями описаний. Тут стоит отметить, что возможности встроенного редактора изображений WordPress тоже стали заметно шире – есть накладываемые фильтры, кадрирование, появились текстовые надписи и т.п.
• Элементы дизайна – секции для разделения на колонки и группы, разделители, пробелы, строки, кнопки и др.
• Готовые виджеты – блоки для вставки произвольного HTML-кода, для вывода комментариев, списков страниц, категорий, шорткодов, облака меток и т.п. Есть готовые значки соцсетей и формы поиска.
• Отдельные элементы темы – списки статей, циклы запросов, меню навигации, отрывки записей, формы комментирования и т.д.
• Элементы (виджеты) внешних сервисов.

Список блоков, как и было упомянуто выше, может быть расширен с помощью плагинов.

В паттернах можно найти готовые реализации:

• заголовков (шапок сайта),
• подвалов (футеров),
• сеток записей/страниц,
• кнопок и призывов к действию (таблицы цен, блоки ссылок и т.п.),
• галерей,
• блоков текстового контента (колонки, секции и т.п.).

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

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

FAQ

Как зайти в админку WordPress

Дефолтный адрес админ-панели – ваш-сайт.ру/wp-admin/. Но вы можете написать в адресе просто /admin, редирект на wp-admin сработает автоматически. Этот адрес может быть изменён плагинами или вручную (после правки исходного кода движка) в целях безопасности. В этом случае, если вы не знаете актуальный адрес админки, нужно будет проверить редиректы в файле .htaccess и настройки плагинов безопасности в базе данных сайта.

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

Если вы удалили всю почту или не можете найти письмо, посмотрите таблицу «ваш_префикс_users» через веб-интерфейс PhpMyAdmin. Здесь хранятся данные обо всех пользователях сайта. А актуальный email-адрес администратора записан в таблице «ваш_префикс_options» в строке опции «admin_email».

Как вернуть старый, классический редактор от WordPress 4

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

Достаточно единственным блоком материала добавить элемент «Классический» из раздела «Текст».

Готово, вам доступны все те же функции, что и раньше. Можно вставлять текст из буфера, очищать форматирование, добавлять своё и т.п.

Но если такой вариант вам не подходит, вы хотите видеть привычное окно по умолчанию, то можно скачать и установить плагин Classic Editor. Он автоматически будет установлен вместо блочного конструктора (опция выбирается здесь – «Настройки» –> «Написание» –> «Редактор по умолчанию для всех пользователей»).

Как работать с виджетами WordPress

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

Если тема устаревшая (не работает с блочным редактором), то внутри шаблона предопределены места вывода виджетов. Например, это может быть боковая панель или футер сайта.

Настройка производится следующим образом:

• Переходите в раздел «Внешний вид» –> «Виджеты».
• Выбираете область вывода. Например, «Боковая панель» или «Футер #1» и т.п.
• Перетаскиваете сюда нужный вам виджет или блок.
• Настраиваете параметры его отображения и другие опции (при наличии).

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

Как делать бэкапы WordPress

Лучший и самый надёжный способ создания резервных копий сайта на WordPress – специальные инструменты хостинг-панели. В 99% случаев вам будут доступны ручные бэкапы, которые сводятся к тому, чтобы создать архив со всеми файлами сайта и выгрузить базу данных в сжатом или в несжатом виде.

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

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

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

Но все они имеют один явный недостаток – повышают нагрузку на хостинг, когда работают внутри CMS.

Простейший способ создания бэкапов, актуальный для всех типов хостинга:

• Войти в web-интерфейс файлового менеджера или подключиться в консоли ssh (если нет указанных инструментов, всегда есть FTP-доступ).
• Создать архив со всеми файлами сайта.
• Скачать его на ПК.
• Войти в интерфейс работы с базами данных (обычно это PhpMyAdmin).
• Выбрать базу данных вашего сайта и экспортировать её (для удобства и экономии трафика можно использовать сжатие).
• У вас на руках актуальный бэкап сайта.
• Для большей надёжности добавьте в именах архивов дату создания и скопируйте в доступные облачные хранилища (OneDrive, Google Drive, Яндекс.Диск и т.п.).

Если у вас VPS-сервер, то можно написать небольшой shell-скрипт, создающий архив файлов и дамп БД, который будет выгружать бэкап на удалённый FTP-сервер по расписанию через планировщика cron.

Желательно в расписании использовать время наименьшей посещаемости сайта (обычно это глубокая ночь).

Выводы

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

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

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

Единственный нюанс – вам нужен качественный и надёжный хостинг. Мы рекомендуем HostGator.

Если WordPress всё равно кажется сложным и слабо коррелирует с вашими задачами, попробуйте использовать онлайн-конструкторы. Здесь многие технические вопросы находятся в сфере ответственности провайдера услуги. А процесс сборки страниц ещё проще и удобнее.