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

Вот несколько причин почему:

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

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

И последнее, но не менее важное: подход «сделай сам» (без навыков кодирования), который я здесь представлю, невероятно экономичный. Фактически, вы можете создавать и запустить свой веб-сайт всего за $35 в год.

Вот как сделать сайт самостоятельно, шаг за шагом:
В спешке, опишу? Пошаговые действия как создать сайт на WordPress менее чем за час:

  • Используйте Reg.ru, чтобы найти идеальное доменное имя для вашего сайта. (5% скидка по коду 1278-FD50-2DA6-15AC)
  • Купите хостинг вашему сайту в Beget.com (от $ 3,5 / месяц) и получите доменное имя бесплатно.
  • Установите WordPress через интерфейс Beget.
  • Здесь все что вам нужно знать о WordPress.
  • Выбрать тему WordPress.
  • Установить обязательные плагины WordPress.
  • Начать создавать свои страницы и записи в блоге.
  • Хорошо, а теперь разберем поэтапно то, что мы собираемся сделать в следующих шагах. Важно отметить, что все это можно сделать самостоятельно и при этом минимизируем расходы, где это возможно.

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

    Выводы

    Несмотря на универсальность, WordPress всё же больше подходит для создания блогов и информационных порталов. Да, запустить интернет-магазин на этом движке тоже можно, но в базовой комплектации нет e-commerce инструментов. Их добавление возможно только через плагины, что повышает нагрузку на сервер. Это не мешает разработчикам использовать WP для создания самых разных проектов, но для начинающих веб-мастеров может стать серьёзной проблемой, способной разочаровать в возможностях популярной CMS.

    Создать сайт на WordPress+Bluehost

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

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

    Оптимизация (SEO) и продвижение

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

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

    Первый шаг к оптимизации сайта – выбор SEO-дружественной темы. Чтобы шаблон считался таковым, он должен отвечать ряду требований, среди которых вёрстка по стандартам CSS3 и HTML5, а также быстрая загрузка страниц. Если вы покупаете или скачиваете бесплатную тему на стороннем сайте, обратите внимание на её описание – в нём должно быть указание на SEO friendly или SEO Optimized.

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

  • В общих настройках укажите адрес сайта в одном стиле – с WWW или без WWW. Чтобы поисковики точно определяли сайт по указанному адресу, добавьте его в Яндекс.Вебмастер и Google Search Console.
  • Установите формат ссылок вида «сайт/категория/название поста». Зайдите в раздел «Постоянные ссылки» в настройках, выберите опцию «Произвольно» и вставьте в поле значение /%category%/%postname%.html.
  • Дальнейшая оптимизация движка возможна только с помощью плагинов. Первое расширение, которое необходимо установить, – Cyr to Lat. Этот плагин будет автоматически транслитерировать названия страниц и постов на кириллице в латиницу. Это позволит избежать сложностей с кодировкой, которые возникают у поисковиков из-за адресов с кириллическими символами.

    Для оптимизации также потребуется установка одного их мощных плагинов – All in One Seo Pack или Yoast SEO. После их добавления в редакторе появится новый раздел, в котором можно указать заголовок, описание и ключевые слова записи. Но этим влияние SEO-плагинов на WordPress не ограничивается: в их настройках очень много опций, для работы с которыми есть отдельные руководства. All in One Seo Pack закрывает все потребности в оптимизации, начиная от мета-тегов для поисковых роботов до создания XML-карты сайта. Yoast SEO предлагает ничуть не меньшую функциональность, поэтому выбор будет сделать сложно, но в любом случае вы получите очень мощные инструменты продвижения сайта на WordPress.

    Для улучшения поведенческих факторов не помешает подключить виджет онлайн-консультанта и установить онлайн калькулятор для расчета чего либо прямо на сайте. Для работы с клиентами и обработкой заказов/заявок можно использовать CRM-систему. Само-собой рекомендуем добавить кнопки для социальных сетей. Подобного рода инструменты положительно влияют на продвижение сайта в поисковиках Яндекс и Google, добавляют веса восприятию сайта и способны приводить клиентов.

    Делаем начальное наполнение сайта

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

    Меню (структура сайта)

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

    • Главная — ведет на главную страницу сайта. Можно такой пункт меню не делать, т.к. пользователи привыкли что при клике на логотип попадаем на главную;
    • Обо мне / О сайте — страница на которой рассказываете о себе или проекте;
    • Блог / Новости — отдельный пункт в меню стоит делать если у вас на главной не лента статей. а например лендинг;
    • Контакты — страница с информацией как с вами связаться.

    Это база, дополнительно можно придумать миллион других вариантов, например:

    • Кейсы / Примеры работ / Портфолио — страница с вашими работами, например у меня так;
    • Услуги — описываете свои услуги, у меня так;
    • — тут расскажите какие варианты рекламы у вас есть, у меня так;
    • Бесплатно — материалы, которые посетители могут получить/скачать бесплатно, возможно подписавшись на рассылку;
    • Курсы / Обучение / Магазин — страница где показываете свой товар, у меня так;
    • Полезные ссылки — любые полезные ссылки по теме, я сделал так;
    • Видео — страница с видео;
    • Инфографика — страница или рубрика с какой-то инфографикой;
    • и пр.

    Пример меню на сайте
    Добавляйте пункты в меню в зависимости от ваших целей.

    Меню настраивается во вкладке Внешний вид » Меню.

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

    Страницы

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

    Пример создания страницы

    По аналогии создайте и остальные страницы.

    Политика конфиденциальности

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

    Записи (статьи)

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

    Подробнее про написание статей можете почитать тут:

    • Как писать СЕО статьи
    • Как написать популярную статью

    Выбор редактора

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

    Рубрики

    Чтобы не запутаться в десятках и сотнях статей, в Вордпресс вы можете из разбить на категории (рубрики). Создать их можете в панели Записи » Рубрики. Когда их создадите и по новой зайдете в редактор статьи, то справа можете выбрать рубрику за которой статья будет закреплена.

    Пример раздела Рубрики

    Метки

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

    Пример работы рубрик и меток

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

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

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

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

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

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

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

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

    WordPress «из коробки» предлагает мало возможностей — нет даже полноценного инструменты для SEO-оптимизации. Тем не менее, у него есть встроенный менеджер медиа-файлов, удобный редактор текста в визуальном режиме и HTML, специальный раздел для управления комментариями, настройки внешнего вида и структуры сайта. С помощью плагинов приходится решать следующие задачи:

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

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

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

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

    Начиная с пятой версии, в WordPress появился блочный редактор Gutenberg. Он заменил стандартный текстовый/HTML-редактор движка и фактически добавил инструменты для визуального управления внешним видом страниц — как на конструкторах сайтов. Стандартный редактор теперь доступен только в виде бесплатного плагина Classic Editor, который нужно устанавливать отдельно из каталога WordPress. Разработчики обещают его поддержку в ближайшие годы, чтобы переход к новому формату редактирования прошёл для пользователей как можно более гладко.

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

    • Элементы для оформления текстовых фрагментов: заголовки, абзацы, цитаты, списки.
    • Блоки для мультимедийного контента: изображений, галереи, видео и аудио, файлов другого типа.
    • Вставка коды и элементы разметки для вёрстки записей/страниц.
    • Виджеты популярных сервисов для быстрой вставки контента — например, постов из соцсетей.

    У каждого блока есть настройки, которые позволяют управлять его внешним видом и содержимым. Это делает редактор Gutenberg ещё более гибким. Для глубокой кастомизации шаблона на WordPress всё ещё требуются навыки вёрстки, а иногда и знание PHP. Но направление на упрощение задано чётко. По крайней мере, теперь каждый пользователь может красиво оформить страницу, используя только инструменты визуального редактирования.

    Ценовая политика

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

    Если вы всё же хотите установить премиальную тему, то приготовьте от 50 до 100 долларов. В этом ценовом диапазоне огромное количество вариантов на разных площадках по продаже тем, например TemplateMonster. Стоимость зависит от функциональности темы, её распространённости и степени известности продавца. На популярных магазинах шаблонов средняя цена — 75 долларов, однако можно найти варианты и за 45 долларов, и за 600 долларов.

    Посмотреть премиум-шаблоны

    С плагинами ситуация аналогичная. Цена обычно привязана к тому, какие возможности они предлагают. Часто в каталоге WordPress доступна бесплатная лайт-версия плагина. Если вы пользуетесь ей, но в какой-то момент понимаете, что инструментов не хватает, то можете без проблем перейти на версию Pro. Расширенная функциональность — не единственное достоинство платных плагинов. Вы отдаёте деньги ещё и за поддержку от разработчиков, которая обеспечивает совместимость с новыми версиями WordPress.