Бесплатный курс: уроки по созданию сайта самому
В рамках данных уроков вы сможете самостоятельно собрать сайт либо магазин для своих задач на самой популярной платформе WordPress (Вордпресс). При этом у вас будет на 100% свой сайт, т.е. никакой аренды и облачного размещение не будет (это как право собственности, не зависящее ни от каких внешних факторов). Каждый урок содержит только важную и нужную информацию и совершенно не сложен в освоении.
Уроки объединены в ПЛАН СБОРКИ, где в любой момент можно перейти на нужный урок, если это необходимо. Если сами не справитесь - зовите нас, поможем. Для этого есть коммерческие тарифы.
Шаблон как есть: https://wp.sborkatest.ru 
. Полученный результат уроков: https://sborkatest.ru
Введение в сборку
Итак, мы все подготовили:
- У нас есть хостинг.
- Есть доменное имя (свое или зарегистрированное здесь).
- Выполнены все подключения и установлена чистая версия последней системы управления Вордпресс
И сейчас мы можем приступать непосредственно к созданию своего сайта на шаблоне – установка и настройка выбранной темы.
Выбранный шаблон: мы выбрали шаблон “OwlPress” , вы можете открыть его для ознакомления
Выбранная ниша: мы будем собирать сайт “Ремонт компьютеров” , как пример.
Тестовый домен для этого сайта: http://sborkatest.ru
Важный момент
В инструкции мы показываем только основные принципы и последовательность действий, однако мы не будем выполнять тонкую настройку, чтобы довести шаблон до идеального рабочего сайта, наполненного материалами, т.к. это более долгий путь, но раз вы здесь и уже смогли дойти до этого шага, значит у вас всё получилось, и вам будет достаточно понять суть, а остальное приложится.
Наша задача – описать базовые принципы самостоятельного создания собственного на 100% сайта, никакие облачные технологии здесь не используются. Вы можете скачивать регулярно актуальный архив сайта, тем самым обезопасив себя от серьезных сбоев у хостинга, как вариант. И конечно, если так вам будет спокойнее.
Статья “Как скачать архив сайта?”
Итак, переходим к установке.
Установка шаблона
Для начала заходим в панель управления Вордпресс. Панель Вордпресс всегда доступна по ссылке: http://mydomain.ru/wp-admin, (где mydomain.ru – ваш домен).
Откройте письмо, которое пришло вам после создания сайта оболочки, там есть прямая ссылка на админку с логином и паролем, перейдите по ней и введите данные. Пример нашего письма:
После ввода откроется панель управления вашего пока пустого сайта (оболочка):
В столбце слева вертикально расположилась основная навигация панели управления (через нее вы будет осуществлять абсолютно все действия, связанные с работой вашего сайта, контента, функционала, различные настройки), справа – основной инфо блок, в котором в зависимости от выбранного слева раздела будет отображаться различная информация – настройки, записи, редакторы, категории, товары, плагины и так далее. Именно в этом основном поле вы и будете работать со своим сайтом.
Мы не будем углубляться в описание функционала Вордпресс – вы можете это сделать самостоятельно методом клика по каждой рубрике и изучение функционала ЛИБО зайдите на официальный сайт Вордпресс, где подробно описан функционал панели управления, к примеру, эта статья “Первые шаги с WordPress” .
Ну а теперь переходим к установке выбранной ранее темы “OwlPress” .
Переходим во Внешний вид 
Темы и видим нашу активную тему (она всегда слева в верху, есть надпись “Активна”), а так же несколько неактивных:
Их мы удаляем, чтобы не было “дыр” в оболочке, превентивные меры.
Для этого кликаем на плашку неактивной темы:
И в раскрывшемся окне справа внизу ищем надпись Удалить, нажимаем и удаляем неактивные темы:
Таким образом у нас остается наша активная тема по умолчанию.
Теперь, здесь же, слева в углу нажимаем на кнопку “Добавить“:
И попадаем во встроенный в платформу каталог шаблонов Вордпресс, тот же самый, что мы ранее с вами смотрели по внешней ссылке.
Вбиваем в поле поиска ключевое слово “OwlPress” и находим нашу тему в окне результатов поиска:
Наводим мышку и нажимаем на кнопку “Установить“:
Запускается процесс установки темы, он достаточно быстрый, и затем видим новую кнопку – “Активировать“. Нажав на кнопку мы даем указание системе Вордпресс о замене ранее активной темы на новую, только что установленную:
В результате этого действия мы получаем новый экран, а именно сообщение об успешной активации темы и предложение “Перейти на сайт” .
Переходим по ссылке и… то, что мы видим, совершенно не похоже на ту тему, что мы выбрали:
Есть нюанс: чтобы установить шаблон, мало его “установить механически“, нужно еще и подгрузить и активировать плагины, которые идут в составе выбранной темы. Есть темы, где сразу после установки появляется кнопка установки плагинов, но не во всех случаях. Суть доп.установки в том, чтобы загрузить еще и демо контент.
Подобные решения в темах являются правилом хорошего тона, когда можно не искать в навигации админки пункт по установке демо контента, а здесь и сейчас сразу все и загрузить. Демо контент позволяет взглянуть на сайт по другому, а именно так, как он и задумывался разработчиком.
Как это сделать?
После активации видим следующий экран:
Нажимаем на кнопку и запускается процесс загрузки необходимых плагинов и их активация, а так же загружается демо-контент, все достаточно быстро. После попадаем в настройки темы.
Можно в любой момент зайти в настройки темы, используя следующий путь: Внешний вид Настроить
Если зайти на наш сайт НЕ из админки, а как посетитель, то видим, что сайт преобразился:
Вот теперь это означает, что тема полностью установлена, теперь начинаются работы по функционалу и превращению пустой темы в полноценный сайт компании (!).
Кстати, чтобы посмотреть, на что способен данный шаблона в PRO версии, достаточно перейти по ссылке автора на сайт разработчика. Вы увидите, насколько может быть богатым наполнение платной версии!
ВАЖНО: в блоге мы покажем и другие варианты по установке тем, чтобы у вас было понимание и представление, как это сделать, если явно вы не нашли после активации кнопку установки демо контента.
После завершения импорта демо-контента мы попадаем в настройки темы, находятся они здесь:
Внешний вид Настроить
Запомните это место, т.к. вам придется в него наведываться неоднократно.
В настройках темы вы можете менять ВСЮ информацию, которую видите в отображении сайта.
Для проверки шаблона, запустите в браузере свой сайт, введя его адрес в адресную строку. В нашем случае, это адрес http://sborkatest.ru (наш тестовый адрес)
На этом установка шаблона завершена!
Сейчас нам предстоит выполнить все необходимые действия для настройки шаблона, включая установку всех необходимых плагинов, которые добавят на сайт новый функционал.
Блокируем индексацию поисковиками
Для начала нам нужно заблокировать сайт от возможной индексации поисковыми роботами. Это необходимо выполнить в любом случае, иначе недоделанный сайт может попасть в поиск Яндекс или Гугл и подпортить вашу репутацию.
Это делается здесь:
Настройки Чтение
Ставим галочку напротив пункта “Попросить поисковые системы не индексировать сайт“.
Сохраняем.
Удаляем ненужные плагины
По умолчанию, Вордпресс устанавливаем 2 плагина, которыми в РФ не пользуются (большинство). Соответственно, на не нужно держать на сайте те плагины, которые занимают место и могут послужить входом для взлома сайта, поэтому удаляем их:
Плагины Установленные
Настраиваем вид ссылок
P.S. Показываем на примере нашего домена http://sborkatest.ru
По умолчанию, все наши ссылки на сайте (а это разделы, пункты меню, навигация и т.п.) будут иметь вид:
http://sborkatest.ru/?p=123
А нам нужно, чтобы у страниц была ЧПУ адрес, т.е. Человеко-Понятный Урл (адрес).
Для этого переходим в этот раздел и указываем нужный нам формат:
Настройки Постоянные ссылки
Сохраняем.
Запрещаем комментарии
По умолчанию комментарии разрешены, однако в большинстве случаев они не нужны, т.к. через них сыплется приличное количество спама и его сложно остановить бесплатными методами.
Настройки Обсуждение
Снимаем галочки:
Сохраняем.
Иногда, вы начинаете получать комментарии и не можете понять, откуда они взялись. А они берутся со страниц записей блога, в которых ранее были разрешены комментарии, отключить их можно в самой выбранной записи.
Записи Все записи
Далее выбираете запись и открываете ее:
Видим, что комментарии разрешены. Отключаем и сохраняем.
Добавляем плагин транслитерации
Транслитерация – это перевод кириллицы в латиницу.
Если сейчас создать любую запись в блоге, то наш адрес будет выглядеть смешанно, а именно латинская часть + кириллическая:
http://sborkatest.ru/тестовая-запись/
Такой формат хоть и будет индексироваться поисковиками, но возможны сбои и проблемы в сервисах, т.е. могут быть осложнения в продвижении сайта, поэтому надежнее и правильнее – перевод всего адреса в единый формат – латинский.
Для этого нужно установить бесплатный плагин “Cyr-To-Lat”
Как установить данный плагин – рассказываем в этой статье.
Меняем Gutenberg редактор
Уже некоторое время Вордпресс перешел на новый вид редактора, который предназначен для формирования и управления контента – редактор блоков “Gutenberg“. Этот редактор по умолчанию встроен в оболочку и при создании любого контента, например, записи, загружается именно он. В свою очередь, редактор достаточно специфический и не всем нравится. На сайте плагина виден его рейтинг, он отрицательный. Однако, кому как. Тем не менее, мы показываем, на что можно его заменить.
Меняем на классический редактор, который чем-то напоминает MS Word.
Как выглядит Gutenberg – посмотрите чуть выше, речь про отключение комментариев, скрин мы приводим.
А заменяем следующим плагином – “Classic Editor” .
В дополнение к этому плагину, ставим плагин “Advanced Editor Tools“, который расширят возможности “Classic Editor” , а именно добавляет ему новый удобный функционал. Фактически, после установки этого дополнения, ваш редактор будет напоминать Ворд, что позволяет работать и создавать даже сложный контент.
Как установить данный плагин – рассказываем в этой статье.
Меняем вид отображения виджетов
Виджет (англ. widget – приспособление, безделушка) – это небольшое приложение, которое показывает некоторую информацию или выполняет несложное действие, а то и просто украшает экран пользователя.
Виджеты находятся вот здесь:
В Вордпресс виджеты активно используются. Так, например, на некоторых блогах на Вордпресс рядом с текстом записи вы могли видеть вывод дополнительной информации, как Поиск, Разделы, Метки и так далее. Это все и есть – виджеты.
Вот пример виджета на нашем сайте, выводятся РЯДОМ со статьей в блоге и магазине:
В этом виджете выводится мини функционал: Поиск, Рубрики, Свежие записи, Облако меток.
Это удобно, чтобы здесь и сейчас можно было что-либо найти, быстро перейти на другую запись или нажать на тег в облаке меток.
Поэтому виджеты очень полезны и являются неотъемлемой частью экосистемы Вордпресс.
А вот как виджеты выглядят в админке сайта:
Как раз под №2 и выводятся виджеты, что на скрине выше (отметили зеленой галочкой).
И это как раз классически вид отображения.
По умолчанию, виджеты выглядят так, как в редакторе блоков “Gutenberg” , поэтому мы советуем обновить их на классический вид, так удобнее, по нашему мнению. Однако, вы можете отключить плагин (дезактивировать) и виджеты вернуться в ранее предустановленный вид, поэкспериментируйте.
А заменяем следующим плагином – “Classic Widgets” .
Найти виджеты можно по следующему пути:
Внешний вид Виджеты
Как установить данный плагин – рассказываем в этой статье.
Добавляем плагин для дублирования
Плагин обеспечивает быстрое и комфортное добавление (дублирование созданного) поста. Это особенно удобно, когда вы ведете свой блог, когда настроили одну запись и чтобы не создавать заново все в новой записи – просто дублируете и вносите необходимые правки.
Плагин называется “Yoast Duplicate Post” .
После добавления и активации в Записях (Посты) и Страницах появится следующий пункт меню:
Как установить данный плагин – рассказываем в этой статье.
Добавляем плагин шрифтов
Плагин позволяет быстро сменить шрифт на любой из коллекции Google Fonts. Дело в том, что почти все шаблоны – зарубежные, поэтому используются шрифты, которые часто НЕ поддерживают кириллицу, т.е. русский алфавит.
Плагин называется “Google Fonts Typography” .
После добавления в настройках появляется возможно быстрого выбора любого шрифта, при чем, эта возможность разбита по блокам, т.е. можно по отдельности назначить шрифт для Заголовка, для Описания, отдельно для Навигации и так далее, пример:
P.S. Если вам требуется добавить какой-то уникальный, специфический шрифт, то советуем присмотреться к плагину “Use Any Font” , который позволяет загрузить в Вордпресс файл шрифта и установить его. В бесплатной лицензии возможно установить только 1 шрифт.
Как установить данный плагин – рассказываем в этой статье.
Делитесь, сохраняйте, чтобы не забыть:
Итак, мы закончили с 1 частью запуска своего сайта/магазина на шаблоне.
Мы выполнили установку самого шаблона/темы, добавили необходимые плагины для работы, удалили лишние. Сейчас пора переходить непосредственно к работе с самим шаблоном, чтобы из обычного демо примера получился сайт компании.
Во второй части мы расскажем, как настроить сам шаблон, русифицировать функционал.
Запускаем сайт ( Часть 2 )