Создание сайта

Создание сайта

         Пошаговая инструкция


          Содержание статьи для быстрого перехода:

  • Материал для наполнения

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


    Хостинг

    Хостинг – это услуга, которая даёт возможность размещения сайта на удалённом сервере, постоянно подключённому к интернету для бесперебойной работы. Простым языком, вам предоставляют место для хранения файлов сайта на удалённом компьютере. Рассмотрим Sprinthost.ru  – один из популярных и недорогих сервисов предоставляющий услуги хостинга.

    Сразу небольшая подсказка как можно сэкономить. До того как вы зашли на сайт Sprinthost, зарегистрируйтесь на сайте letyshops.ru (этот сервис возвращает часть денег от покупок с сайтов-партнёров).

     

    После регистрации зайдите в раздел “Расширение для браузеров” вкладка в верхней панели

     

    Внизу страница вы найдёте вкладку “Установить расширение”

    В выделенном, красным цветом, прямоугольнике указаны браузеры на которые можно установить расширение (Google Chrome, Yandex browser, Opera, Firefox, Safari)

    Теперь, когда вы зайдёте на сайт  sprinthost.ru, расширение от letyshops.ru  это увидит (так-как sprinthost является одним из партнёров letyshops) и попросит активировать кэшбэк. Нажмите на эту вкладку

    Если расширение letyshops не опознаёт сайт sprinthost, и не предлагает активировать кэшбэк (такое иногда бывает), тогда просто зайдите на сайт letyshops.ru и в поле “Поиск магазинов” введите нужное вам название, в данном случае sprinthost.

    После того как вы активировали кэшбэк, при определённых покупках у sprinthost (не менее чем на 1200 рублей) вам будет возвращено 220 рублей на счёт в letyshops. Если оплатить минимальный тариф хостинга сразу на год вперёд (это 98*12) получится 1176, плюсом будет бонус за единовременную оплату нескольких месяцев 144 рубля, получится 1176 + 144 = 1320 что больше чем 1200, соответственно 220 рублей вам вернётся на счёт в letyshops. Конечно же можно оплачивать по 98 рублей ежемесячно (по минимальному тарифу), но уже без бонусов. Тут смотрите по своим возможностям.

    Регистрируемся в sprinthost.ru

    Выбираем самый дешёвый тариф (для начала этого будет достаточно)

     

    В открывшемся окне вводим свой email и жмем “Получить аккаунт”

     

    Через некоторое время к вам на почту придёт письмо. Пройдите по ссылке в строке “Активируйте Ваш аккаунт по ссылке” (ваша ссылка будет немного отличаться!)

     

    После активации, на почту придёт письмо с данными для входа в панель управления. Рекомендуется сразу оплатить выбранный тариф (можно оплатить позже). Пройдите по ссылке в строке “оплата услуг”

     

    После оплаты придет письмо на вашу почту с подтверждением

     

     

    Далее зайдите в предыдущее письмо где вам пришли данные для входа. Пройдите по ссылке в строке “Данные для входа в панель управления” (логин и пароль будет присутствовать в вашем письме)

    Обязательно сохраните эти данные!

     

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

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


    Доменное имя

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

     

     

    Ознакомьтесь с приведённым текстом и выберите “новая персона”

     

    Заполните данные и нажмите сохранить

     

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

     

    В панели расположенной слева выбираем “сайты и домены” – “добавить сайт”

     

    Теперь нужно выбрать доменное имя и зону (RU, РФ, COM и т.п.). Самые дешёвые зоны это RU и РФ – 140 рублей за год. Более распространённый из них это зона RU. Введите доменное имя в строку “Домен нового сайта” и поставьте галочку в строке “Зарегистрировать этот домен” Пример названия – workhomenet.ru. Если такой домен уже зарегистрирован, как в нашем примере, появится ошибка как на скрине ниже. Вам придётся придумывать другое имя которое свободно

     

    Когда вы подберёте свободное доменное имя, выберите персону для регистрации домена (ту что вы уже зарегистрировали) и кликните “Добавить сайт”

     

    После загрузки придётся подождать какое то время чтобы сайт появился в поисковиках. Может доходить до 12 часов. После чего нужно установить конструктор для работы и оформления сайта.


    Конструктор WordPress

    Чтобы приступить к оформлению сайта, нужен так называемый конструктор. Один из распространённых конструкторов это WordPress — система управления содержимым сайта с открытым исходным кодом, написана на PHP.

    В панели расположенной слева выбираем вкладку “дополнительно” – “установка приложений”

     

    Находим приложение “WordPress”, в строке “Установить на сайт” выбираем свой созданный домен на сайт которого будет установлено приложение, и жмём “установить WordPress”

     

    Далее читаем и ставим галочку, жмём “начать установку”

     

    После установки должно появится окно:

     

    На почту придёт письмо с данными для входа в консоль WordPress. Пройдите по ссылке расположенной  в строке “”URL для администрирования”, и в появившемся окне введите логин и пароль из письма (в вашем письме они будут)

     

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

     

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

     

    Чтобы было удобнее работать можно убрать лишние окна (эти действия не обязательны). В консоли, справа, нажмите “закрыть”, затем “Настройки экрана”

     

    Оставьте галочку “на виду” как на рисунке



    Наполнение и редактирование сайта

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

    Как выбрать тему оформления

    Панель слева: “Внешний вид”-“Темы”

     

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

     

    Для примера выберем тему “Twenty Sixteen” из четырёх предложенных. Нажмите на “Перейти на сайт”, чтобы посмотреть как выглядит ваш сайт с новой темой


     
    Как создавать страницы

    После того как вы перешли на сайт, нажмите на вкладку в верхней панели: “+Добавить”-“Страницу”

     

     

    Введите заголовок и нужный текст

    после в правой части нажмите “Опубликовать”

     

    можно тут же добавить новую страницу, если нужно, не переходя на сайт

     

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

     

    Пишем название меню (может быть любым)

    и жмём на синюю кнопку справа “Создать меню”                                                                    

     

     

    Поставьте галочки напротив нужных страниц и нажмите “Добавить в меню”

     

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


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

    Страницы создали приступим к редактированию и наполнению, установим логотип и иконку на сайт. Зайдите на свой сайт и нажмите в верхней панели “Настроить”

     

    Откроется панель для настроек. В панели настроек имеется ряд вкладок, всё очень доступно и интуитивно понятно. Вы можете сами легко с ними поэкспериментировать пройдя по каждой из низ. Мы, в данной статье, рассмотрим основные из них. Итак,  переходим во вкладку “Свойства сайта”

     

    Нажмите “выбрать логотип”

     

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

    Картинка появится во вкладке “Библиотека файлов”

    на той-же странице, справа-внизу, нажмите “Выбрать”

     

    Далее будет предложено обрезать картинку, после она появится на сайте. На панели слева вы видите логотип, который можно изменить либо удалить. Надписи под логотипом можно так-же редактировать изменяя текст в строках “Название сайта”, “Краткое описание”, так-же можно воспользоваться галочкой в строке “Отображать название и описание”. Логотип установи, теперь нужно загрузить иконку, для этого в той-же панели, в самом низу будет надпись “Иконка сайта”, жмём на “Выбрать изображение” и проделываем всё тоже-самое что и с логотипом.

     

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


     

    Как установим изображение заголовка

    Заходим в настройки

     

    Выбираем в панели слева “Изображение заголовка”

     

    Жмём “Добавить”. Загружаем нужную картинку, “обрезаем” если нужно.

     

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

     

    Так-же можно добавить ещё несколько изображений и нажать “В случайном порядке” (вкладка внизу). После чего ваши изображения будут меняться между собой через определённое время.


     
    Как и где редактировать виджеты

    После перехода по вкладке “настройки”, расположенной в верхней панели сайта:

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

     

    Нажмите на маркер нужного виджета и слева в панели появится настройка этого виджета.

     

    Так-же можно зайти, в панели слева, во вкладку “Виджеты” – “Боковая колонка”

     

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


     

    Как создать главную страницу

    При переходе на наш сайт, встречает первая страница сайта, её можно сделать Главной. Для этого потребуются немного другие настройки чем с обычным созданием новой страницы. Делаем следующее: переходим на сайт и не переходя не по каким вкладкам копируем адрес страницы из поисковой строки, затем заходим во вкладку “Меню”

     

    Выбираем “Произвольные ссылки”

     

    Вводим в URL адрес нашей страницы которую мы скопировали ранее, пишем название страницы и жмём “Добавить в меню”

     

    Мышью переносим главную страницу на верх и жмём “Сохранить меню” – будет синяя кнопка справа. Если всё сделали правильно, Главная страница отобразится на сайте.


     

    Как добавить новую запись

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

     

    Запись создаётся аналогично тому как создаётся обычная страница – вводите название с текстом и жмёте “Опубликовать”


     
    Как вставить картинку в страницу

    Для того чтобы вставить картинку зайдите на нужную страницу. Внизу будет ссылка “Изменить”

     

    Картинка устанавливается в место установки курсора. Затем нажмите “Добавить медиафайл” и загрузите нужную картинку

     

    После загрузки картинки нажмите “Опубликовать” – будет синяя кнопка справа. Картинка появится на странице.


    Плагины
  • Плагин – это программный модуль, который можно установить на сайт для расширения возможностей.
    Плагин контактной формы для связи Contact Form 7

    Заходим в Консоль, выбираем “Плагины” – “Добавить новый”

     

    В форму поиска вводим “Contact Form 7”, жмём “Установить”

     

    Далее жмём “Активировать”

     

    Во вкладке “Плагины” находим Contact Form 7 и жмём “Настройки”

     

    Затем в колонке “Контактная форма 1” копируем Шорткод

     

    Заходим на страницу где хотим установить форму ввода для обратной связи, и жмём “Редактировать страницу”. В окне для редактирования выбираем вкладку “Текст” устанавливаем курсор в нужное место и вставляем скопированный ранее Шорткод, жмём “Обновить”

     

    Так будет выглядеть форма

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

     

     

Оставить ответ

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