Top.Mail.Ru

Как создать бесплатный сайт на wordpress (вордпресс) | Руководство к действиям и видео урок, в наличии (Сайт с нуля — часть 1)

Доброго времени суток.
Я решил сделать целый цикл статей и видеоматериалов, на тему сайтостроения. Ведь при наличии определенных знаний и небольшого количества времени, можно сделать сайт самому, с нуля и совершенно бесплатно. Встает вопрос: “Где взять эти знания и как их применить?”, если вы новичок, а то и вовсе, в этом вопросе, чайник.
Ответ прост, читать дальше и смотреть видео урок. Я подготовил для вас пошаговую инструкцию.
Самостоятельно создать можно не только обычный сайт, но и, к примеру, лендинг (Landing page), или вовсе, целый интернет — магазин. Понятно что по временным затратам и возможным трудностям, задачи сильно различаются, но все реально и все достижимо.
Руководство к действиям.
Начнем, конечно же, с азов. В начале нужно выбрать себе хостинг. Выбирайте какой хотите, у всех свои предпочтения. Я покажу, на примере beget, на всякий случай оставлю на него ссылку. (ссылка на хостинг).
Дальше определимся с движком (cms) будущего сайта. Сегодня я возьму за основу wordpress (вордпресс). Потому что он бесплатен, под него идет куча плагинов и он интуитивно понятен для начинающих.
Переходим на главную страницу хостинга. Жмем “Заказать”

Выбираем самый дешевый тариф “Blog” — 140 рублей в месяц. И заполняем данные для регистрации. Самый сок в том, что первый месяц обслуживания, бесплатно.


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

Начинаем работу. До блокировки 29 дней и можно успеть насладиться функционалом.
По логике вещей, наш будущий проект должен открываться по какому то адресу. То есть нужно доменное имя. Чтобы зарегистрировать новый домен, жмем в панели управления, на “Домены и поддомены” — “Зарегистрировать домен” и вписываем его имя.

 


Дальше идет заполнение паспортных данных и списание с баланса 180 рублей, если зона ru. В общем все ваши затраты — это 180 рублей в год — за доменное имя. И 140 рублей ежемесячно, со второго месяца, за хостинг.
Я, пока, обойдусь временным доменом, поэтому перехожу во вкладку CMS, выбираю wordpress, там указываю домен, на который вешать будущий ресурс и придумываю логин, и пароль. Происходит установка и теперь у нас есть доступ к панели управления сайта
+
Настало время залогиниться в админке вордпресса. Тут и начинается творческий процесс создания. Но в начале необходимо запретить поисковым системам индексировать сайт. Для этого переходим “Настройки” — “Чтение” и в самом низу ставим галочку “Попросить не индексировать сайт”. Сохраняем изменения.
+
Теперь визуальная составляющая. Нужно выбрать подходящий шаблон для сайта. По структуре и расположению элементов, по наличию встроенных плагинов, или по зрительным предпочтениям. Не суть, любой шаблон можно переделать до неузнаваемости. Главное за основу взять то, что примерно отвечает вашим требованиям. Идем по пути: “Внешний вид” — “Темы” — “добавить новую”. Применяем фильтрацию по параметрам и выбираем что душе угодно.
+
Я остановил свой выбор на шаблоне Blogside. Нажимаю “Установить” и за несколько секунд все, нужные, файлы распаковываются и шаблон готов к работе. Завершающий клик на “Активировать”
+
А вот и сам сайт. Да, он пока пустой и не красивый, зато имеет каркас и полностью функционален.
+
Прежде чем настраивать тему, нужно создать пару записей и поставить на них превьюшки, дабы визуально понимать при редактировании, как отображаются те, или иные элементы. А также несколько рубрик (категорий).
Это раздел “Записи” — “Добавить новую”
И раздел “Рубрики” — “Добавить новую рубрику”
+
При создании записи пишем название статьи.
+
И подгружаем изображение записи.
+
В идеале, стоит использовать для превью изображения одинакового размера, чтобы все выглядело красиво и не обрезано.
Выбираем рубрику для будущей статьи. Рубрики нужно предварительно создать.
+
Этого пока хватит, публикуем заготовку статьи и смотрим как это выглядит на самом сайте
+
По этому же принципу, закидываем остальное чтиво. 5 записей хватит для визуального редактирования. После публикации смотрим результат. Понятно что необходима точечная настройка, все это подогнать по размерам, увеличить, убрать лишнее. Этим и займемся.
+

Шаблон Blogside для WordPress — установка и настройка (видео урок и текстовое описание)
Переходим по пути “Внешний вид” — “Настроить”. Открывается редактор шаблона.
+
Раздел -1. Theme Options (Опции темы). Подраздел “Layout” (макет). Во вкладке “Глобальные”, то есть для всех страниц, выбираем нужную структуру макета, по расположению элементов. Не забываем опубликовать.
+
Тут же в опциях, находим подраздел “Styling”. Ползунок “Website Max-width” — увеличит размер верхних превьюшек. А “Image Border Radius” — отвечает за скругление уголков.
+
Теперь, Раздел -2. Свойства сайта. Вписываем название и краткое описание. Понятно что с точки зрения seo, получается полная дичь, битая структура и нагромождение мета — тегов, но вопросами оптимизации займемся позже.
+
Далее — “Выбрать логотип”. Подгружаем свое лого и задаем ему площадь отображения. Или полностью, или какой-либо участок.
Скриншоты
Теперь название сайта выводиться лишь в одном месте и его можно удлинить. Но напоминаю что структура битая и все это нужно будет исправлять.
+
Подгружаем иконку сайта (фавикон).
+
Раздел под номером 5 — фоновое изображение. Выбираем в качестве изображения нужный фон и получаем плюс к индивидуальности. Да и там куча фоновых настроек — изучите. К примеру позиция картинки или размер.
+
Не забываем публиковать, после каждого действия. А теперь выведем картинки нижним записям
+
Опять раздел -1. Theme Options (Опции темы). Подраздел “Blog”. Вкладка “Blog Layout” (макет блога), параметр — “Grid” (сетка). Получаем вот такой результат:
+
Закрываем редактор и возвращаемся в панель управления вордпресс, самое время создать меню. Проходим по пути “Внешний вид” — “Меню”. Указываем название и жмем “создать”. Отмечаем область отображения и добавляем в меню все наши рубрики.
+
Сохраняем и смотрим что получилось.
+
Все. Каркас сайта готов. Страницы уже имеют более-менее приемлемый вид.
+
Теперь в дело вступает seo оптимизация. Необходимо полностью подготовить сайт для поисковых систем. Так же внести пакет визуальных правок, для удобства пользователей. И конечно же загрузить текстами. Но об этом в следующих статьях.
Напоминаю, что мы, поэтапно, пройдемся по всем, необходимым ключевым моментам сайтостроения и оптимизации, чтобы в итоге получить качественный и доходный продукт.
Продолжение. Часть 2. Начало оптимизации. Структура, замена h1, h2, h3. Вывод текста на главную. Убираем ссылки из подвала.

You may also like...

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *