Добавить материал и получить бесплатное свидетельство о публикации в СМИ
Эл. №ФС77-60625 от 20.01.2015
Инфоурок / Информатика / Другие методич. материалы / Брошюра "Первые шаги в системе uCoz: создание сайта"

Брошюра "Первые шаги в системе uCoz: создание сайта"


  • Информатика

Поделитесь материалом с коллегами:



Муниципальное бюджетное образовательное учреждение

«Средняя общеобразовательная школа №10»










Первые шаги в системе uCoz: создание сайта


Часть 1.







Составил:

учитель информатики и ИКТ

Худякова И.Н.

















2013-2014г.


Регистрация проекта

  1. Для того чтобы сделать сайт в системе uCoz, действительно необходимо всего несколько минут.

  2. Зайдите на сайт ucoz.ru и нажмите кнопку Создать сайт.

hello_html_m5b92fe2f.gif












  1. Пройдите регистрацию в системе uNet. Введите свой e-mail и пароль.

hello_html_62e8581b.png












  1. Далее откроется окно для регистрации нового сайта. Заполним все поля таблицы.

  2. В поле Место проживания выберем пункт Другой город.

  3. Вhello_html_29ff663b.png появившемся диалоговом окне выберем свой регион, нажмем кнопку Регистрация.










  1. Регистрация считается пройденной, если напротив каждого поля стоит зеленая галочка (см. рисунок).

hello_html_m18a31de7.png













  1. Нажмите на кнопку Регистрация.

  2. Появится окно проверки e-mail адреса.

  3. Перейдем по ссылке Проверить почту

hello_html_m46d6348c.png









  1. Для окончательной регистрации, перейдем посылочке на вашей почте.

hello_html_a31c95d.png

hello_html_38e893e8.gif

  1. После перехода по ссылке появится окно с

продолжением регистрации, заполним пустые

ячейки окна.







  1. Нажмем на кнопку Приступить к созданию сайта.

  2. В появившемся диалоговом окне Создание нового проекта выберем кнопку Сделать позже.

hello_html_m131395a7.gif








  1. Регистрация закончена, приступаем к созданию сайта.



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

  1. После регистрации сайта вам будет предложено выбрать адрес вашего сайта.

hello_html_m6059b36e.png







  1. В поле Согласен с правилами хостинга, поставим галочку и кликнем по кнопке Создать сайт.


  1. Если имя сайта не повторилось в системе uCoz, то на экране появится окно, которое пригласит Вас в панель управления сайтом.

hello_html_13157a8d.png












  1. Заполним окно Мастер настройки системы, введя название нашего сайта (пример, Персональный сайт учителя информатики).

hello_html_m551798f3.gif










  1. Кликнем по кнопке Выбрать дизайн.

  2. Выберите понравившейся вам дизайн и нажмите на кнопку Выбрать.

  3. В окне Мастера настройки кликнете по кнопке Продолжить.

  4. Выберем модули для нашего сайта:

-hello_html_5458e73a.gif редактор страниц

- фотоальбом

- новости сайта

- гостевая книга

- каталог файлов

- опросы














  1. Если все нужные вам модули выбраны, кликнем по кнопке Продолжить.

  2. Появится окно Добро пожаловать в Панель управления.







  1. Поздравляю! Вы зашли в Панель управления Вашим сайтом. Именно здесь можно настроить все используемые Модули и Дизайн. И у Вас уже создан сайт!

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

hello_html_2ad0837d.gif









  1. Вы можете сразу же кликнуть по ссылке Адреса Вашего сайта, чтобы порадоваться тому, как просто и легко всё делается на uCoz! Сайт откроется в новой вкладке Вашего браузера.

hello_html_m1b27b6a1.png






















Наполнение сайта

  1. Панель администрирования сайта - основной орган управления. С ее помощью можно полностью изменить его структуру, дизайн, содержание и даже удалить его. Поэтому не стоит сообщать пароль от "админки" третьим лицам. 
    Рассмотрим панель управления детальнее. 

  2. Вhello_html_m62fe90b7.jpgизуально панель администрирования можно разбить на несколько смысловых блоков: 
    1. Админбар – горизонтальное меню, через которое можно получить доступ практически ко всем функциям. 

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

    3. Блок модулей - в нем отображены все модули сайта. Внизу две вкладки - активные и неактивные модули. Нажатие на название активного модуля вызывает переход к его настройкам. Аналогичное действие с неактивным модулем добавляет его на сайт. 

    4. Основные сведения о сайте - адрес вашего сайта, детали настройки FTP, размер файлового пространства, информация от администрации. 

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















  1. Для редактирования своего сайта перейдем по ссылке: http://адрес вашего сайта/admin


  1. Сhello_html_54ab8a64.pngправа внизу постоянно будет появляться окошко подсказки, которое Вам обязательно нужно внимательно читать – так вы постепенно начнёте учиться пользоваться системой uCoz.



Добавление информации на страницу


  1. Добавим материал на первую страницу сайта.

  2. Дhello_html_mabcf5ae.pngля этого в правом верхнем углу найдем пиктограммы: Редактировать в визуальном редакторе и Редактировать в HTML.

  3. Кликнем на пиктограмме в виде «глаза».

  4. Появится окно для добавления материала. Вам нужно просто заполнять все поля уникальным авторским контентом, что я и сделала... На панели форматирования можно добавлять или удалять данные, форматировать текст и т.д.

hello_html_43d75284.gif



















  1. Пhello_html_m6fd9892f.gifосле того, как информация вся внесена, кликнем на кнопке внизу страницы Сохранить.

  2. Всё, наша информация опубликована, о чём сообщает маленькое окошко Добавление материала. В этом окошке кликните по ссылке Перейти на страницу, чтобы увидеть, что получилось...

  3. Перейдем в пункт меню Информация о сайте.

  4. Оhello_html_mabcf5ae.pngткройте страницу для редактирования, кликнув на визуальном

редакторе( ).

  1. В строке Название страницы можем изменить информацию Информация о сайте, на строку Об авторе.

  2. В поле Содержимое страницы введите текст, который отображает информацию об авторе (не забывайте форматировать текст).

hello_html_m65c29e16.gif




hello_html_md37ee5d.gif









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


  1. После того, как редактирование страницы закончено кликните на кнопке Сохранить / Перейти на страницу сайта.








Добавление материала на страницу сайта

Каталог статей

  1. Перейдите на страницу сайта Каталог статей.

  2. В правом углу страницы выберем пункт Добавить статью.

hello_html_m48d22599.gif



  1. Откроется окно для заполнения и вставки материала:

- выберем категорию

- заполним поле Название материала

- краткое описание

- полный текст материала

hello_html_39184679.gif



















  1. В поле Загрузка изображения выберем нужный нам файл и кликнем на кнопке Открыть.

hello_html_70cad920.gifhello_html_1ac8ae1a.gif










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

  2. Кликнем на кнопке Добавить.

hello_html_849bf10.gif













  1. Если Вы сделали все правильно, появится окно, которое Вам объявит о том, что материал успешно опубликован.

  2. Кликнем на кнопке Перейти на страницу материала.

hello_html_60b41dd2.gif





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














Работа с конструктором сайта

  1. Иhello_html_m2f971c5f.pngтак, приступим к наполнению сайта. В верхнем горизонтальном меню, которое называется Админбар, кликните по вкладке Конструктор / Включить конструктор...


Важное дополнение!


Внимание, если пропала ссылка Конструктор в админ баре на сайте! 

Для того чтобы вернуть Конструктор в админ бар проделайте следующее:


  1. Панель управления пользователи группы пользователей установка прав для всех групп разное Редактировать дизайн сайта. Установите выделение в чекбокс внизу кликните Сохранить 



  1. Не пугайтесь! Вы не поломали сайт, вы перешли в потрясающий и удобный вид редактирования сайта в системе uCoz без специальных знаний. 

  2. Начнём с верхней части Вашего сайта. Вы, возможно, слышали, как верхнюю часть сайта называют «шапкой». Вот в этой самой «шапке» мы сейчас внесём очень важное для нашего сайта изменение.

  3. Кликните по заголовку Мой сайт, там появится курсор, само поле заголовка измениться для редактирования. Теперь стирайте надпись и пишите название Вашего сайта. В моём случае это Персональный сайт учителя информатики и ИКТ.

  4. После этого нужно сразу же опуститься в самый низ сайта. Здесь мы отредактируем копирайт, в котором нужно прописать обязательно того человека, или тот бренд, который обладает авторскими правами на оригинальный контент Вашего сайта. Точно так же, как мы это делали наверху сайта в «шапке», здесь мы отредактируем надпись «Copyright MyCorp © 2013», поменяв её на что-то своё.

  5. Например, я написала здесь «Copyright irina-nv.ucoz.ru © 2013».

hello_html_601ef1f8.png





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

  2. Вhello_html_6c8b6042.gif системе uCoz Конструктор создан универсальным. Тут мы видим все блоки, даже не активированные на Вашем сайте.

  3. Рядом возле каждого блока находится голубая гаечка, которая открывает окошко редактирования блока, а также морковного цвета крестик, нажав на который можно удалить блок, если он вам совсем не нужен.

  4. Давайте изменим один блок, который у Вас в данный момент активирован. 

  5. Изменим блок Друзья сайта, который находится слева внизу.

  6. Вместо ссылок, поставленных разработчиками uCoz по умолчанию, я поставлю блок Коллегам, где будут находиться полезные баннеры в виде ссылок. (Вы можете добавлять ссылки на любые странички в Интернете).

  7. Бhello_html_6c8b6042.gifлок Друзья сайта я переименовала аналогичным образом, как это мы с вами делали наверху и внизу сайта, т.е. я кликнул на строчку с названием и изменила его на Коллегам.

  8. Теперь нам нужно отредактировать содержимое этого блока.

  9. Откроем окно редактирования блока (кликните по голубой гаечке).

  10. Откроется окно Управление содержимого блока. Выберем блок Banner.

hello_html_m643ad3d0.gif






  1. После входа в управление содержимым блока на экране появится окошко, в котором сказано, что управление баннерами осуществляется в панели управления.

  2. Так и сделаем, перейдем в Панель управления.

hello_html_32f706d5.png





Пhello_html_552fecce.gifримечание: при создании сайта оставляйте открытыми окно браузера Панели управления (http://адрес сайта/admin) и сам сайт, в котором Вы редактируете информацию.

  1. В окне браузера Панель управления выберем команду Инструменты / Ротатор баннеров.




  1. В окне ротатора баннеров добавим категорию.

hello_html_74c97773.gif



hello_html_1d8372df.png

  1. Введем текст Баннеры образования, сохраним изменения.

  2. Теперь добавим сами баннеры, для этого:

- кликнем на кнопке в правом углу окна Добавить баннер

- в окне добавления баннера выполним следующие настройки (см. рисунок)

hello_html_5778c23f.gif
























- если все настройки баннера внесены, кликнем на кнопке Добавить.

  1. Аналогичным образом добавьте еще несколько ссылок (т.е. баннеров).

  2. Пhello_html_m7ce1a43b.pngосле добавления баннеров окно выглядит следующим образом:


  1. Редактирование Ротатора баннеров мы завершили, но для того, чтобы настройки вступили в силу необходимо скопировать HTML-код каждого баннера и вставить его на странице Конструктора. Для этого выполним следующие действия:

- кликнем на ссылке Интернет-портал

- появится окно скрипта, скопируем его (Ctrl+C)

hello_html_780442fe.png






- перейдем в Конструктор сайта в режим редактирования блока Коллегам, выберем блок Banner.

hello_html_m509a97c5.gifhello_html_407b1708.png





- в окне Управление содержимым блока, выберем вкладку HTML, и вставим скопированный скрипт (Ctrl+V)

hello_html_m1c9f7b93.gif




  • сразу внесем коррективы в окне скриптов. Настроим наши ссылки таким образом, чтобы каждая из них начиналась с новой строки, для этого добавим тег - <p> … </p>

hello_html_6f641de0.gif






- сохраните внесенные изменение в окне скриптов, нажав на кнопке Сохранить.

hello_html_c438243.gif

  1. Давайте посмотрим, что у нас получилось.

  2. На панели Админбар сохраним изменения

Конструктора.




  1. После внесения изменений в блок Коллегам он приобрел следующий вид

hello_html_m55d15b28.gif








  1. Аналогичным образом добавьте еще две ссылки, и в вашем блоке Коллегам будут добавлены еще несколько ссылок на порталы образования.

hello_html_40e0ba8a.gif









  1. Наверное, все. Дальше дело за вами: заполняйте сайт полезными и интересными материалами, привлекайте коллег, школьников и прочих посетителей. И тогда он обязательно поможет взглянуть на образовательный процесс по-новому. 

  2. Наш новый сайт выглядит вот так:

hello_html_m50f5bedf.png





Автор
Дата добавления 21.09.2015
Раздел Информатика
Подраздел Другие методич. материалы
Просмотров279
Номер материала ДВ-001704
Получить свидетельство о публикации

Похожие материалы

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