Полезные материалы:
Вот мы с вами разработали свой первый веб-сайт и возникает резонный вопрос – а как теперь этим добром хвастаться перед своими друзьями? Как другой человек может увидеть мой сайт?
Если максимально упростить ответ – для того, чтобы другие люди могли увидеть твой сайт потребуется 2 вещи:
- Хостинг, это место, где к файлам сайта сможет получить доступ любой желающий
- Домен, — это уникальный адрес вашего веб-сайта в интернете
Сейчас вам нужно морально подготовиться, потому что сегодня мы будем тратить немалую сумму – целых 300 рублей. Мы купим свой первый хостинг и первый домен.
Переходим на сайт reg.linkodium.com, открываем раздел «Хостинг» и приобретаем тариф «Host-A» — это самый дешевый тариф, поддерживающий технологии PHP и MySQL, позже, они там тоже понадобятся.
Нажимаем «Купить», выбираем «Зарегистрировать домен с помесячным тарифом хостинга», чтобы сразу зарегистрировать и доменное имя. Выбираем свободный адрес для вашего веб-сайта. Например, вы можете использовать своё имя или псевдоним. Оплачиваем.
Переходим в панель управления и проведем небольшую подготовку к запуску нашего будущего веб-сайта.
Сначала скачаем бесплатный архиватор 7-ZIP, который на поможет быстро и удобно загрузить исходные файлы сайта на хостинг.
Далее нам нужно открыть архив Boostrap, который мы качали на первом уроке, найти в нём папку «assets». Не заходя в эту папку, кликаем по ней правой кнопкой мыши и выбираем в контекстном меню «7-zip», а потом «добавить к assets.zip».
Теперь переходим в панель управления хостингом, выбираем Сайты, выделяем наше доменное имя и нажимаем Файлы сайта. Удаляем все файлы, которые находятся в этой директории и нажимаем Загрузить.
В этом архиве находятся каскадные таблицы стилей и другие файлы, необходимые для корректной работы шаблона Bootstrap, который мы используем. Распаковываем архив и удаляем сам архив с хостинга.
Далее в панели управления хостингом, в корневой директории сайта создадим файл index.html. Большинство хостингов настроены так, чтобы при заходе на сайт, открывалась именно страница с именем index и расширением html или php. В адресной строке браузера, после доменного имени посетитель может ввести название того или иного файла, который хранится на хостинге и увидеть его содержимое. Но если имя файла в адресной строке не задано, по умолчанию, будет открываться главная страница (т.е. индексная), которую мы сейчас и создали.
Теперь не на хостинге, а на нашем ПК перейдем к папке jubmotron, которая хранится в папке Bootstrap. Откроем HTML-документ с которым мы работали ранее в текстовым редакторе, выделим весь исходный код, нажмем Копировать и вставим его во встроенном редакторе панели управления хостингом.
Также, мы ранее создавали свою собственную таблицу стилей, под названием my.css — загрузим и этот файл на хостинг в корневой каталог.
Теперь еще раз в панели управления хостингом откроем файл index.html и немного его отредактируем. Ранее, файлы необходимые для шаблона находились в каталоге по иерархии выше, чем HTML-документ с которым мы работали, поэтому в адресе подключаемой каскадной таблицы стилей от шаблона в начале адреса шли специальные символы («../»). Эти специальные символы означают переход на каталог уровнем выше. Теперь же, наш HTML-документ на хостинге располагается на одном уровне с каталогом «assets«, поэтому две точки и косую черту («../») необходимо удалить.
Сохраняем файл и идем отдыхать, потому что процесс активации доменного имени и привязка его к хостингу занимают несколько часов. Завтра можно будет попробовать ввести в адресную строку браузера доменное имя, которое вы для себя зарегистрировали и если вы всё сделали правильно — ваш сайт откроется по указанному адресу, и открывать его теперь сможет любой желающий.
Если же, что-то пошло не так (сайт не открывается, сайт выглядит не так как должен) — вы можете обратиться в службу технической поддержки хостинга на сайте провайдера.