SlideShare a Scribd company logo
1 of 11
Download to read offline
Курс «Профессиональная разработка электронного учебного контента II»
Практикум 7. Пошаговая инструкция
Задание практикума.
Усовершенствовать лонгрид, созданный в Теме 6, путём добавления 4−5 новых блоков. Воспользоваться
вставкой произвольного HTML-кода для помещения в лонгрид кода вставки одного из интерактивных
элементов, созданных в предыдущих темах курса.
1. Для того, чтобы вам были доступны все блоки Тильды, активируйте бесплатно тарифный план
Personal.
2. Откройте страницу, созданную в предыдущем Практикуме 6. Выберете место после которого будете
вставлять блоки. Нажмите на знак + между блоками. Появится библиотека блоков.
3. Сначала вставим заголовок. Для этого в библиотеке блоков выберем Заголовок, а в выпадающем
справа меню блок TL03.
4. В нашу страницу вставится шаблон заголовочного блока.
5. Теперь заменим шаблонный текст на необходимый нам. Для этого нажмём на кнопку Контент и
исправим тексты. Нажмём на кнопку Сохранить и закрыть.
6. Получим блок заголовка с нужным содержанием
7. Теперь ниже вставим текстовый блок, аналогично блоку заголовка. Выбираем раздел Текстовый блок
и вид текстового блока Лид (вводный текст).
8. Шаблон лида вставится в нашу страницу.
9. Заполним лид нашим текстом по аналогии с заголовком.
10. Давайте теперь вставим иллюстрацию с обтекающим текстовым блоком. Это раздел Изображения
блок IM13.
11. Вставится шаблон блока.
12. Изменим его в соответствие со своими намерениями.
13. Текстовые поля заполняются так же как в предыдущих блоках. Для загрузки изображения надо нажать
на кнопку Загрузить файл. Далее надо либо перетащить файл нужного нам изображения на
появившееся окошко (1), либо нажать на кнопку (2) и загрузить файл из стандартного окна выбора
файла ОС, либо указать ссылку на нужный вам файл в интернете (3). В последнем случае файл
автоматически скачается и загрузится на сервер данных Тильды.
14. После того как все поля будут заполнены надо нажать на кнопку Сохранить и закрыть и наш блок
наполнится нужным контентом. Блок содержит текст описания, иллюстрацию и подпись под ней.
15. Теперь попробуем добавить на нашу страничку один из интерактивных элементов контента,
созданных нами в Практикумах 1-5. Для этого нам понадобится код вставки. Как взять код вставки из
сервиса – см. в инструкциях к соответствующим Практикумам.
16. Вставим блок из раздела Другое под названием HTML-код (T123).
17. Появится шаблон вставки кода. Он выглядит вот так.
18. Заполним шаблон кодом вставки сервиса, используя кнопку Контент. Нажмём на кнопку Сохранить и
закрыть.
19. Результат будет выглядеть так. ВНИМАНИЕ! Интерактивный элемент (результат вставки кода) будет
виден только после опубликования страницы. На странице редактора код будет отображаться
символически.
20. После опубликования страницы вставленный код будет выглядеть, например, так (в приведённом
примере вставлен код сервиса TimeLineJS).
21. После того, как все блоки будут вставлены, надо опубликовать результат. Для этого в верхнем меню
сервиса надо нажать на кнопку опубликовать.
22. Работа над Практикумом 7 закончена. Скопируйте ссылку из поля адреса опубликованной страницы и
поместите ее в сообщение в группе курса в Facebook. При необходимости можно редактировать и
публиковать страницу многократно.

More Related Content

Similar to Практикум 7

Сайт на narod.ru: добавляем скрипты
Сайт на narod.ru: добавляем скриптыСайт на narod.ru: добавляем скрипты
Сайт на narod.ru: добавляем скриптыproxy-ma
 
создание сайта в_системе_ucoz(2014)
создание сайта в_системе_ucoz(2014)создание сайта в_системе_ucoz(2014)
создание сайта в_системе_ucoz(2014)MarcoFill
 
руководство Alfresco 4
руководство Alfresco 4руководство Alfresco 4
руководство Alfresco 4Andrew Galenkov
 
Разработка оптимального ПО - создание раскадровок и сбор отзывов от заинтерес...
Разработка оптимального ПО - создание раскадровок и сбор отзывов от заинтерес...Разработка оптимального ПО - создание раскадровок и сбор отзывов от заинтерес...
Разработка оптимального ПО - создание раскадровок и сбор отзывов от заинтерес...Александр Шамрай
 
lesson3_HTML_rus.pdf
lesson3_HTML_rus.pdflesson3_HTML_rus.pdf
lesson3_HTML_rus.pdfmmmitioglo
 
урок 5
урок 5урок 5
урок 5JIuc
 
создание сайта в системе Ucoz(2012)
создание сайта в системе Ucoz(2012)создание сайта в системе Ucoz(2012)
создание сайта в системе Ucoz(2012)MarcoFill
 
Trening modul2-webinar11
Trening modul2-webinar11Trening modul2-webinar11
Trening modul2-webinar11olgaoov
 
Интегратор Bitrix 4 занятие
Интегратор Bitrix 4 занятиеИнтегратор Bitrix 4 занятие
Интегратор Bitrix 4 занятиеitc73
 
работа с блогом1
работа с блогом1работа с блогом1
работа с блогом1Natalia Odegova
 
работа с блогом1
работа с блогом1работа с блогом1
работа с блогом1Nata Koinova
 
как пользоваться Base camp (для новых клиентов)
как пользоваться Base camp (для новых клиентов)как пользоваться Base camp (для новых клиентов)
как пользоваться Base camp (для новых клиентов)Михаил Парамонов
 
Переход с сайта библиотеки в электронный каталог, опубликованный в OpakGlobal
Переход с сайта библиотеки в электронный каталог, опубликованный в OpakGlobalПереход с сайта библиотеки в электронный каталог, опубликованный в OpakGlobal
Переход с сайта библиотеки в электронный каталог, опубликованный в OpakGlobalSoldatova Oksana
 
курс тви админ. день 2
курс тви админ. день 2курс тви админ. день 2
курс тви админ. день 2Nata Koinova
 
Курс "Тви-админ". день 2
Курс "Тви-админ". день 2Курс "Тви-админ". день 2
Курс "Тви-админ". день 2FrillkaCom
 

Similar to Практикум 7 (20)

Практикум 5
Практикум 5Практикум 5
Практикум 5
 
Практикум 9
Практикум 9Практикум 9
Практикум 9
 
Сайт на narod.ru: добавляем скрипты
Сайт на narod.ru: добавляем скриптыСайт на narod.ru: добавляем скрипты
Сайт на narod.ru: добавляем скрипты
 
публикация презентаций On line
публикация презентаций On lineпубликация презентаций On line
публикация презентаций On line
 
создание сайта в_системе_ucoz(2014)
создание сайта в_системе_ucoz(2014)создание сайта в_системе_ucoz(2014)
создание сайта в_системе_ucoz(2014)
 
руководство Alfresco 4
руководство Alfresco 4руководство Alfresco 4
руководство Alfresco 4
 
Разработка оптимального ПО - создание раскадровок и сбор отзывов от заинтерес...
Разработка оптимального ПО - создание раскадровок и сбор отзывов от заинтерес...Разработка оптимального ПО - создание раскадровок и сбор отзывов от заинтерес...
Разработка оптимального ПО - создание раскадровок и сбор отзывов от заинтерес...
 
lesson3_HTML_rus.pdf
lesson3_HTML_rus.pdflesson3_HTML_rus.pdf
lesson3_HTML_rus.pdf
 
урок 5
урок 5урок 5
урок 5
 
создание сайта в системе Ucoz(2012)
создание сайта в системе Ucoz(2012)создание сайта в системе Ucoz(2012)
создание сайта в системе Ucoz(2012)
 
Trening modul2-webinar11
Trening modul2-webinar11Trening modul2-webinar11
Trening modul2-webinar11
 
Интегратор Bitrix 4 занятие
Интегратор Bitrix 4 занятиеИнтегратор Bitrix 4 занятие
Интегратор Bitrix 4 занятие
 
работа с блогом1
работа с блогом1работа с блогом1
работа с блогом1
 
работа с блогом1
работа с блогом1работа с блогом1
работа с блогом1
 
Практикум 2
Практикум 2Практикум 2
Практикум 2
 
first
firstfirst
first
 
как пользоваться Base camp (для новых клиентов)
как пользоваться Base camp (для новых клиентов)как пользоваться Base camp (для новых клиентов)
как пользоваться Base camp (для новых клиентов)
 
Переход с сайта библиотеки в электронный каталог, опубликованный в OpakGlobal
Переход с сайта библиотеки в электронный каталог, опубликованный в OpakGlobalПереход с сайта библиотеки в электронный каталог, опубликованный в OpakGlobal
Переход с сайта библиотеки в электронный каталог, опубликованный в OpakGlobal
 
курс тви админ. день 2
курс тви админ. день 2курс тви админ. день 2
курс тви админ. день 2
 
Курс "Тви-админ". день 2
Курс "Тви-админ". день 2Курс "Тви-админ". день 2
Курс "Тви-админ". день 2
 

More from Pavel Kallinikov

2017-06-20 (вебинар-9)
2017-06-20 (вебинар-9)2017-06-20 (вебинар-9)
2017-06-20 (вебинар-9)Pavel Kallinikov
 
2017-06-22 (вебинар-10)
2017-06-22 (вебинар-10)2017-06-22 (вебинар-10)
2017-06-22 (вебинар-10)Pavel Kallinikov
 
2017-06-15 (вебинар-8)
2017-06-15 (вебинар-8)2017-06-15 (вебинар-8)
2017-06-15 (вебинар-8)Pavel Kallinikov
 
2017-06-13 (вебинар-7)
2017-06-13 (вебинар-7)2017-06-13 (вебинар-7)
2017-06-13 (вебинар-7)Pavel Kallinikov
 
2017-06-08 (вебинар-6)
2017-06-08 (вебинар-6)2017-06-08 (вебинар-6)
2017-06-08 (вебинар-6)Pavel Kallinikov
 
2017-06-06 (вебинар-5)
2017-06-06 (вебинар-5)2017-06-06 (вебинар-5)
2017-06-06 (вебинар-5)Pavel Kallinikov
 
2017-06-01 (вебинар-4)
2017-06-01 (вебинар-4)2017-06-01 (вебинар-4)
2017-06-01 (вебинар-4)Pavel Kallinikov
 
2017-05-30 (вебинар-3)
2017-05-30 (вебинар-3)2017-05-30 (вебинар-3)
2017-05-30 (вебинар-3)Pavel Kallinikov
 
2017-05-25 (вебинар-2)
2017-05-25 (вебинар-2)2017-05-25 (вебинар-2)
2017-05-25 (вебинар-2)Pavel Kallinikov
 
2017-05-23 (вебинар-1)
2017-05-23 (вебинар-1)2017-05-23 (вебинар-1)
2017-05-23 (вебинар-1)Pavel Kallinikov
 
2017 03-16 (вебинар 10)
2017 03-16 (вебинар 10)2017 03-16 (вебинар 10)
2017 03-16 (вебинар 10)Pavel Kallinikov
 
2017 03-14 (вебинар 9)
2017 03-14 (вебинар 9)2017 03-14 (вебинар 9)
2017 03-14 (вебинар 9)Pavel Kallinikov
 
2017 03-09 (вебинар 8)
2017 03-09 (вебинар 8)2017 03-09 (вебинар 8)
2017 03-09 (вебинар 8)Pavel Kallinikov
 

More from Pavel Kallinikov (20)

2017-06-20 (вебинар-9)
2017-06-20 (вебинар-9)2017-06-20 (вебинар-9)
2017-06-20 (вебинар-9)
 
2017-06-22 (вебинар-10)
2017-06-22 (вебинар-10)2017-06-22 (вебинар-10)
2017-06-22 (вебинар-10)
 
2017-06-15 (вебинар-8)
2017-06-15 (вебинар-8)2017-06-15 (вебинар-8)
2017-06-15 (вебинар-8)
 
2017-06-13 (вебинар-7)
2017-06-13 (вебинар-7)2017-06-13 (вебинар-7)
2017-06-13 (вебинар-7)
 
2017-06-08 (вебинар-6)
2017-06-08 (вебинар-6)2017-06-08 (вебинар-6)
2017-06-08 (вебинар-6)
 
2017-06-06 (вебинар-5)
2017-06-06 (вебинар-5)2017-06-06 (вебинар-5)
2017-06-06 (вебинар-5)
 
2017-06-01 (вебинар-4)
2017-06-01 (вебинар-4)2017-06-01 (вебинар-4)
2017-06-01 (вебинар-4)
 
Практикум 10
Практикум 10  Практикум 10
Практикум 10
 
Практикум 5
Практикум 5Практикум 5
Практикум 5
 
Практикум 3
Практикум 3Практикум 3
Практикум 3
 
2017-05-30 (вебинар-3)
2017-05-30 (вебинар-3)2017-05-30 (вебинар-3)
2017-05-30 (вебинар-3)
 
Практикум 2
Практикум 2Практикум 2
Практикум 2
 
Практикум 1
Практикум 1Практикум 1
Практикум 1
 
2017-05-25 (вебинар-2)
2017-05-25 (вебинар-2)2017-05-25 (вебинар-2)
2017-05-25 (вебинар-2)
 
2017-05-23 (вебинар-1)
2017-05-23 (вебинар-1)2017-05-23 (вебинар-1)
2017-05-23 (вебинар-1)
 
Практикум 10
Практикум 10Практикум 10
Практикум 10
 
Практикум 9
Практикум 9Практикум 9
Практикум 9
 
2017 03-16 (вебинар 10)
2017 03-16 (вебинар 10)2017 03-16 (вебинар 10)
2017 03-16 (вебинар 10)
 
2017 03-14 (вебинар 9)
2017 03-14 (вебинар 9)2017 03-14 (вебинар 9)
2017 03-14 (вебинар 9)
 
2017 03-09 (вебинар 8)
2017 03-09 (вебинар 8)2017 03-09 (вебинар 8)
2017 03-09 (вебинар 8)
 

Практикум 7

  • 1. Курс «Профессиональная разработка электронного учебного контента II» Практикум 7. Пошаговая инструкция Задание практикума. Усовершенствовать лонгрид, созданный в Теме 6, путём добавления 4−5 новых блоков. Воспользоваться вставкой произвольного HTML-кода для помещения в лонгрид кода вставки одного из интерактивных элементов, созданных в предыдущих темах курса. 1. Для того, чтобы вам были доступны все блоки Тильды, активируйте бесплатно тарифный план Personal. 2. Откройте страницу, созданную в предыдущем Практикуме 6. Выберете место после которого будете вставлять блоки. Нажмите на знак + между блоками. Появится библиотека блоков.
  • 2. 3. Сначала вставим заголовок. Для этого в библиотеке блоков выберем Заголовок, а в выпадающем справа меню блок TL03. 4. В нашу страницу вставится шаблон заголовочного блока.
  • 3. 5. Теперь заменим шаблонный текст на необходимый нам. Для этого нажмём на кнопку Контент и исправим тексты. Нажмём на кнопку Сохранить и закрыть. 6. Получим блок заголовка с нужным содержанием
  • 4. 7. Теперь ниже вставим текстовый блок, аналогично блоку заголовка. Выбираем раздел Текстовый блок и вид текстового блока Лид (вводный текст). 8. Шаблон лида вставится в нашу страницу.
  • 5. 9. Заполним лид нашим текстом по аналогии с заголовком. 10. Давайте теперь вставим иллюстрацию с обтекающим текстовым блоком. Это раздел Изображения блок IM13.
  • 7. 12. Изменим его в соответствие со своими намерениями.
  • 8. 13. Текстовые поля заполняются так же как в предыдущих блоках. Для загрузки изображения надо нажать на кнопку Загрузить файл. Далее надо либо перетащить файл нужного нам изображения на появившееся окошко (1), либо нажать на кнопку (2) и загрузить файл из стандартного окна выбора файла ОС, либо указать ссылку на нужный вам файл в интернете (3). В последнем случае файл автоматически скачается и загрузится на сервер данных Тильды. 14. После того как все поля будут заполнены надо нажать на кнопку Сохранить и закрыть и наш блок наполнится нужным контентом. Блок содержит текст описания, иллюстрацию и подпись под ней.
  • 9. 15. Теперь попробуем добавить на нашу страничку один из интерактивных элементов контента, созданных нами в Практикумах 1-5. Для этого нам понадобится код вставки. Как взять код вставки из сервиса – см. в инструкциях к соответствующим Практикумам. 16. Вставим блок из раздела Другое под названием HTML-код (T123). 17. Появится шаблон вставки кода. Он выглядит вот так.
  • 10. 18. Заполним шаблон кодом вставки сервиса, используя кнопку Контент. Нажмём на кнопку Сохранить и закрыть. 19. Результат будет выглядеть так. ВНИМАНИЕ! Интерактивный элемент (результат вставки кода) будет виден только после опубликования страницы. На странице редактора код будет отображаться символически.
  • 11. 20. После опубликования страницы вставленный код будет выглядеть, например, так (в приведённом примере вставлен код сервиса TimeLineJS). 21. После того, как все блоки будут вставлены, надо опубликовать результат. Для этого в верхнем меню сервиса надо нажать на кнопку опубликовать. 22. Работа над Практикумом 7 закончена. Скопируйте ссылку из поля адреса опубликованной страницы и поместите ее в сообщение в группе курса в Facebook. При необходимости можно редактировать и публиковать страницу многократно.