Как облегчить создание сайта на бесплатном хостинге и повысить эффективность работы в разы?

Опубликовал 19 февраля 2012 в рубрике Практика. Комментарии: Комментариев нет

На хостинге типа narod.yandex.ru, при разработке сайта в ручном режиме возникает затруднение. В случае когда есть несколько страниц или десяток. Сменить например ссылку или отредактировать, которая проставлена на большом количестве страниц.
Обычный способ, это садишься и редактируешь все страницы. Занимает время. Этот процес можно облегчить и сделать проще с помощью программы Dreamweaver.
В ней есть одна замечательная функция которая упрощает это занятие. Функция называется «библиотеки» или «Librari». Здесь дано описание как это сделать пошагово?

1. Создаем в Dreamweaver «сайт» и настраиваем, что бы выводился в браузер.

Как настроить Dreamweaver ? Скачиваем этот курс, в нем есть подробные и толковые видеоуроки, где подробно все рассказано, плюс есть сам Denwer.

Как сделать реестрацию на хостинге сервиса narod.ru? Забираем этот курс. Также есть видеоуроки где пошагово все описано и показано.

настройка сайта в dremweawer

Так выглядит сайт после настройки в Dreamweaver для показа в браузере.

2. Создаем страницу и наполняем ее содержимым.

визуальный вид страницы в dremweawer

Так выглядит визуально страница.

код страницы в Dreamweaver

Это код элемента меню, который будем выводить в «библиотеку».

3. Переходим на вкладку «активы «библиотека»,  слева значек развернутой книжечки и создаем новый файл, называем его, например «meny».

работа с функцией библиотека в Dreamweaver

В самом низу вкладки «активы», четыре иконки есть

меню Dreamweaver  на вкладке активы

Нажимаем второй значок с меткой «+» для создания файла.

Открываем только что созданный файл в библиотеке для редактирования «meny» нажимая на третий значек с карандашем.

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

4. Сохраняем.

5. Переходим на вкладку” файлы” и перетаскиваем файлы, которые выделены красным в папку «Web-сайт», на которую показывает стрелка.

Делаем это следующим образом. Ставим стрелку мышки на файл, например папку «img» , зажимем левую кнопку мыши и тащим файл на папку «Web-сайт». Выпригивает такое окошко как внизу, где Dreamweaver спрашивает можно ли обновить ссылки в файлах? Нажимаем обновить.

перемещение файлов в рассположении Dreamweaver сайта

6. Так проделываем со всеми файлами, чтобы сайт имел вот такой вид.

вид сайта в  Dreamweaver после перетаскивания файлов

Папку «www» уже можно удалить.

Важно!!!
Страницы в основном окне Dreamweaver необходимо закрыть. Тогда корректно обновляются ссылки.

7. После этого открываем страницу сайта, выбираем место куда будем вставлять «элемент библиотеки».

8. Открываем вкладку «Активы» и нажимаем на файл библиотеки «meny». И в самом низу вкладки «Активы» есть кнопка «вставить», вот по ней и щелкаем мышкой. На странице должен появится код библиотеки, окрашен в желтый цвет.

Или способом описанным выше когда перетаскивали файлы зажимая левую кнопку мыши. Только этот элемент библиотеки перетаскиваем в то место страницы куда надо.

Сохраняем страницу и просматриваем в браузере.

вставленный файл элемента библиотеки на страницу

Важно!!! Ссылки в элементе библиотеки должны быть полными и иметь вид http://succers.chromavideo.biz/succers_subscrabe/index.php такой или такой http://www.succers.chromavideo.biz/succers_subscrabe/index.php

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

В случае когда работаете на локальном то ссылка должна быть вида http://localhost/libreri/index.html.

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

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

9. Такими способами вставляем этот элемент библиотеки или файл «meny» на всех последующих страницах вновь созданных в то место где необходимо.

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

запрос на обновление файлов после редактирования элементов библиотеки

Нажимаем «обновить». В случае если страницы открыты в основном окне Dreamweaver то пересохраняем их. И если сайт уже на хостинге , то после редактирования перезаливаем файлы поддавшиеся редактированию.
Сайт на хостинг заливаю по FTP-клиенту.
Описанный способ создания меню применяю на бесплатном хостинге типа narod.ru или где нету поддержки php. Применение в практике вот на этом сайте смотрим.

На хостинге с поддержкой php есть другая фишка для проделывания подобной процедуры.

Затруднения в работе с кодом? Знакомимся с описанием курса по html, скачиваем и применяем в работе. Отзыв авторский, сам по нем учился.

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

Получать новые статьи блога

Обновления на свой email получить:




Комментарии