Свой сайт на Wordpress: легко, быстро, бесплатно

1. О книге и ее авторе.

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

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

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

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

Вот если вы держите в руках эту книгу, значит, вам тоже интересна тема создания сайта? Давайте вместе сделаем ваш первый сайт! Конечно, можно просто читать эту книгу, но, знаете, что? Ваш сайт сам себя не создаст. Это факт. Чтобы сайт появился, нужно сесть и начать делать его.

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

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

А задумывались ли вы, нужны ли на сайте маленькой фирмы игры и онлайн игрушки? А вот и да! На практике мы создадим пазл, вставим его в пост и оформим его так, чтобы было интересно читать нашей целевой аудитории.

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

2. Для кого эта книга.

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

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

Другая моя ученица создала сайт «Различные способы умножения. Применение художественных навыков в математике». Получился проект на стыке трех предметов: математики, информатики и ИЗО.

Конечно, такие индивидуальные проекты выделяются из всех остальных!

В данной книге очень подробно рассказано, как сделать качественный сайт на Wordpress, проект вашего ребенка точно получит высшую оценку!

А может, вы хотели бы создать свой творческий проект в виде сайта, но не хотите изучать программирование? Эта книга точно будет вам полезна. Чтобы создать качественный сайт творческого проекта совсем не обязательно быть прошаренным программистом, достаточно базовых знаний. В этой книге подробно рассказывается о процессе создания сайта проекта (ведь сайт рукодельницы – это тоже проект!) и способах размещения контента на нем.

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

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

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

3. Почему Wordpress?

В данной книге описан процесс создания сайта на Wordpress (WP). Выбор данной системы управления сайтом не случаен. По данным независимого агентства Web Technology Surveys за март 2022 года, около 64,8 % всех сайтов в мире использует CMS Wordpress.

Такая популярность этого движка вызвана несколькими причинами. Во-первых, он бесплатен. CMS Wordpress распространяется по открытому лицензионному соглашению (GNU GPL), так что его можно свободно использовать даже в коммерческих целях.

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

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

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

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

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

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

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

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

Итак, вы готовы приступить к процессу создания сайта фирмы или своего проекта?

Создание сайта состоит из двух частей: технической и содержательной.

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

Шаг 1. Регистрация аккаунта на бесплатном хостинге

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

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

Рисунок 1. Регистрация на бесплатном хостинге

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

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

Рис. 2 Поле для введения кода из СМС

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

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

Если вы все сделали правильно, то появится следующее окно (рис.3):

Рисунок 3. Завершение регистрации на хостинге

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

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

После этого смело жмите синюю кнопку «Войти в панель управления». Вот так выглядит панель управления хостингом (рис. 4).

Рисунок 4. Панель управления хостингом

Перейдем теперь к установке Wordpress.

Шаг 2. Установка Wordpress

Для установки WP нам не нужно ничего скачивать и грузить на хостинг программное обеспечение, данный хостинг позволяет установить Wordpress автоматически. Для этого нужно пройти по ссылке «CMS Установка систем управления», на скриншоте выше это первая иконка во втором ряду. Далее нужно выбрать Wordpress (рис.5):

Рисунок 5. Автоматическая установка Wordpress

Нажимаем на ссылку Wordpress (на рисунке 5 она выделена красным овалом) и в открывшейся таблице заполняем все поля (рис.6):

Рисунок 6. Создание сайта Wordpress

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

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

После введения всей информации, жмем кнопку «Установить».

Все, наш сайт на WP создан. Вверху страницы «CMS» появилась информация об этом (рис 7)

Рисунок 7. Созданный сайт

Чтобы попасть на сайт, нужно перейти по синей ссылке (цифра 1). Если нажать на букву i (цифра 2), откроется окно с реквизитами созданного сайта. Там можно посмотреть логин и пароль, если вдруг вы их забыли. Если возникнет необходимость удалить сайт, то есть кнопка под цифрой 3.

Есть еще один способ попасть на сайт, в панели управления хостингом в разделе «Сайты» (рис 8.)

Рисунок 8. Раздел "Сайты" в панели управления

Сайт на хостинге создан, самое время перейти к его настройке.

Шаг 3. Выбор и настройка темы (шаблона) для сайта

Так выглядит сайт сразу после установки (рис.9):

Рисунок 9. Стартовая страница сайта

Название сайта можно поменять в разделе «Настройки». Об этом мы поговорим чуть позже. Чтобы начать редактировать сайт, нам необходимо сначала попасть в консоль, панель управления сайтом. Сделать это можно двумя способами. Первый – через панель управления хостингом, раздел сайты (см. рис.7). Второй способ – выйти на сайт и в адресной строке добавить к адресу /wp-admin (рис. 10).

Рисунок 10. Вход в панель управления сайтом через адресную строку

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

Рисунок 11. Вход в панель управления сайтом

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

Рисунок 12. Панель управления сайтом

Тема в Wordpress отвечает за внешний вид сайта, его дизайн. Думаю, не нужно объяснять, насколько это важно для успеха сайта? Помните пословицу «По одежке встречают…»? Именно тема Wordpress и является той одежкой, которая встречает ваших посетителей. От того, насколько она красивая и яркая, и соответствует деятельности вашей фирмы, будет зависеть настроение посетителей вашего сайта и их желание приходить к вам еще и еще раз. А потом становиться покупателями ваших товаров и услуг.

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

Выбор, установка и активация темы производится во вкладке «Внешний вид» панели управления. Наводим мышь на эту вкладку и в появившемся меню переходим во вкладку «Темы» (рис. 13):

Рисунок 13. Переход во вкладку "Темы"

По умолчанию в этой вкладке всего три шаблона. Сейчас активна тема twenty twenty two. Рядом есть еще две. Если навести мышь на соседнюю тему, появляются две кнопки: «Посмотреть» и «Активировать». При. Нажатии на первую, откроется демо-версия этого шаблона, если тема понравится, ее можно установить на сайт, нажав кнопку «Активировать». Если не одна тема не понравится, можно добавить еще тем в консоль, для этого нужно нажать на кнопку «Добавить» в верхней части страницы с темами.

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

Рисунок 14. Поиск темы по фильтру характеристик

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

После того, как система подберет темы, можно выбрать одну из них. Для этого наводим мышь на тему и жмем на появившуюся кнопку «Установить». Затем нужно дождаться сообщения, что тема установлена, ее нужно активировать (рис. 15):

Рисунок 15. Активация выбранной темы

После того, как тема будет активирована, она появится в списке установленных тем. Ненужные темы можно удалить если они не нужны. Для этого нужно щелкнуть по теме и нажать на кнопку «Удалить», которая находится в нижнем правом углу страницы.

Чтобы посмотреть, как изменился сайт, нужно навести мышь на ссылку с названием сайта и нажать на ссылку «Перейти на сайт» (рис. 16)