Блог як ефективний засіб для навчання

«Блог як ефективний засіб для навчання»
3
МІНІСТЕРСТВО ОСВІТИ І НАУКИ УКРАЇНИ
ДЕРЖАВНИЙ НАВЧАЛЬНИЙ ЗАКЛАД «МИХАЙЛІВСЬКЕ ВИЩЕ
ПРОФЕСІЙНЕ УЧИЛИЩЕ»
БЛОГ ЯК ЕФЕКТИВНИЙ ЗАСІБ ДЛЯ НАВЧАННЯ
МЕТОДИЧНІ РЕКОМЕНДАЦІЇ
Білоцерковець Марина
Володимирівна,
майстер виробничого
навчання
ДНЗ «Михайлівське вище
професійне училище»
смт Михайлівка
2017

4
РЕКОМЕНДОВАНО:
Науково-методичною радою
НМЦ ПТО у Запорізькій області
як інформаційно-методичний
матеріал для педагогічних
працівників ПТНЗ
Протокол№_2_від 19.04.2017р.
Укладач:
Білоцерковець М.В., майстер виробничого навчання
ДНЗ «Михайлівське вище професійне училище»
Комп'ютерний набір, верстка, редагування та коректура:
Білоцерковець М.В., майстер виробничого навчання
ДНЗ «Михайлівське вище професійне училище»
Рецензент:
Таран М.В., методистНМЦ ПТО у Запорізькій області

5
ВСТУП.........................................................................................................................7
1. КОРОТКО ПРО БЛОГИ.........................................................................................8
1.1 Історія розвитку і створення блогів........................................................................8
1.2 Чому слід створювати навчальний блог.................................................................9
1.3 Види навчальних блогів ....................................................................................... 10
2. СТВОРЕННЯ БЛОГУ............................................................................................ 12
2.1 Розробка концепції блогу..................................................................................... 12
2.2 Створення нового блогу....................................................................................... 14
3. ОБЛІКОВИЙ ЗАПИС GOOGLE.......................................................................... 18
3.1 Створення акаунту Google ................................................................................... 18
3.2 Додавання файлів до сховища Google Диск......................................................... 20
4. СТВОРЕННЯ ПОВІДОМЛЕНЬ БЛОГУ.............................................................. 23
4.1 Створення нової публікації .................................................................................. 23
4.2 Додавання спеціальних символів у повідомлення блогу ..................................... 26
4.3 Додавання посилань у повідомлення блогу ......................................................... 27
4.4 Додавання зображень у повідомлення блогу ....................................................... 30
4.5 Додавання відео до повідомлення блогу.............................................................. 32
4.6 Додавання Google Форми в повідомлення блогу................................................. 34
4.7 Додавання презентації в повідомлення блогу...................................................... 37
4.8 Додавання розриву в повідомлення блогу ........................................................... 40
4.9 Додавання анімованого тексту заголовку ............................................................ 41
4.10 Як «оживити» текст на блозі.............................................................................. 43
4.11 Додавання електронного підпису....................................................................... 45
5. НАЛАШТУВАННЯ ШАБЛОНУ ТА МАКЕТУ БЛОГУ ..................................... 48
5.1 Налаштування «реакцій» на повідомлення блогу................................................ 48

6
5.2 Налаштування шаблону блогу ............................................................................. 50
5.3 Додавання піктограми блогу................................................................................ 51
5.4 Налаштування шапки блогу ................................................................................. 54
5.5 Додавання сторінок до блогу ............................................................................... 57
6. ДОДАВАННЯ ҐАДЖЕТІВ ДО БЛОГУ............................................................... 62
6.1 Додавання ґаджета «Мітки» ................................................................................. 62
6.2 Додавання ґаджета «Архів блогу» ....................................................................... 63
6.3 Додавання ґаджета «Опитувальник».................................................................... 65
6.4 Додавання ґаджета «Статистика блогу»............................................................... 67
6.5 Додавання ґаджета «Панель відео»...................................................................... 69
7. РОБОТА З ҐАДЖЕТОМ HTML/JAVASCRIPT..................................................... 71
7.1 Додавання ґаджета «HTML/JavaScript»................................................................ 71
7.2 Додавання інформера погоди............................................................................... 72
7.3 Додавання ґаджета «рухомий рядок»................................................................... 76
7.4 Додавання посилання або зображення в «рухомий рядок».................................. 78
7.5 Додавання годинника........................................................................................... 81
7.6 Додавання ґаджета-лічильника ............................................................................ 84
7.7 Як прикрасити блог до Нового року.................................................................... 86
ВИСНОВКИ............................................................................................................... 89
ЛІТЕРАТУРА............................................................................................................. 90

7
ВСТУП
Не секрет, що кожний викладач вважає свій предмет найважливішим і
найцікавішим. Важливим є той факт, що учні можуть вважати інакше. Так чому ж не
спробувати підвищити інтерес до свого навчального предмета?
Наразі Інтернет надає безліч таких можливостей. Мені подобається ідея
використання блогу як навчального майданчика. Розміщуйте в своєму блозі цікаві
матеріали, корисні посилання, інтерактивні вправи та тести; колекцію навчальних
матеріалів, розв’язаних завдань, відео-уроків або відео-інструкцій; організуйте
онлайн-роботу; спілкуйтесь з учнями!
Якщо подумати, жоден статичний сайт (із найбагатшим архівом матеріалів) і
жодна книга не зрівняється із хорошим блогом. Статичному сайту не вистачає
зворотнього зв’язку та «близькості» до аудиторії. А книзі не вистачає не тільки
зворотнього зв’язку, але й можливості зробити навчання більш візуалізованим
(додати звук, анімацію чи повноцінний фільм).
Певна річ, існують ще й форуми, які пропонують усі необхідні можливості для
спілкування та візуалізації. Але навіть їх важко назвати ідеальним майданчиком для
навчання. Адже форум – це насамперед комунікаційний, а не навчальний
інструмент. Його важко замінити чимось іншим, коли йдеться про спілкування та
обмін досвідом між професіоналами. Але коли на такий форум потрапляє
абсолютний новачок – він майже гарантовано не знаходить там зручної організації
матеріалів, яка б дозволила ефективно засвоювати знання.
Існує багато причин для використання блогів у навчанні. Наприклад, для того,
щоб забезпечити учнів реальною аудиторією, зацікавленою в тому, що вони пишуть;
для того, щоб забезпечити учнів додатковою практикою в читанні; збільшити їх
згуртованість, заохочувати їх до участі в створенні певних проектів; створити
онлайн- портфель учнівських робіт. Блог викладача ідеально підходить для
реалізації цих задач.

8
1. КОРОТКО ПРО БЛОГИ
1.1 Історія розвитку і створення блогів
Термін «веблог» був уперше вжитий Джорном Баргером (Jorn Barger)
17 грудня 1997-го року. Так він назвав перелік посилань, автоматично згенерованих
сайтом Robot Wisdom, що «логував» всі інтернет-сторінки, на які заходив Джорн.
Таким чином, перший блог був не чим іншим, ніж збірником посилань.
Короткаформатерміну «блог» (blog) була вперше вжита Пітером Мерхольцем
(PeterMerholz), який жартомав сайдбарівласного інтернет-щоденника Peterme.com
«роз’єднав» термін Джорна Баргера «weblog» на два слова «we blog». Це трапилося
в квітні чи травні 1999-го.
А вже через дуже короткий період Еван Вільямс (Evan Williams – один із
засновників сервісу Blogger.com) використовував слово «блог» у двох значеннях –
як іменник та дієслово. «To blog» – означало «вести блог». Саме Еван, до речі,
вперше використав слово блогер (blogger), маючи на увазі людину, яка є автором
блогу. Не дивно, що йому вдалося легко зареєструватидоволірідкісний домен у зоні
.com – blogger.com.
А далі кількість дрібних подій та персон, пов’язанихз блогами, почала зростати
в геометричній прогресії. Тому, щоб не перетворити коротку і приємну історію
блогів на «світову історію» з безліччю дат та «важливих особистостей» я зупинюся
на тому, що вже сказано. Додам лише, що по-справжньому вибуховим і масовим
блогінг став у 2003-му, коли на світ з’явилися такі блогерські платформи, як
TypePad та WordPress.

9
1.2 Чому слід створювати навчальний блог
Є десять причин, які переконують у необхідності ведення викладачем
навчального інтернет-блогу:
-за допомогою навчального блогу можна доповнювати викладений на уроці
матеріал цікавими фактами, відеоекспериментами, якісними задачами та
необхідними коментарями;
-за допомогою повідомлення в блозі можна дати довільне оголошення, анонс,
нагадування, котре обов’язково буде прочитане;
-за допомогою інтернет-блогу можна займатись з учнями додатково, готуючи
їх до найрізноманітніших конкурсів, розв’язувати задачі підвищеної складності,
звичайно, за умови, якщо учні проявляють до цього інтерес;
-за допомогою навчального блогу можна вести дискусії з учнями та батьками
на будь-які теми; проводити опитування;
-за допомогою блогу можна проводити різні домашні дослідження, результати
яких учні мають можливість презентувати у блозі викладача-предметника;
-навчальний інтернет-блог стає незамінним під час карантинів, дозволяючипри
цьому не переривати навчальний процес та успішно виконувати програму;
-навчальний блог дозволяє вести журнал успішності у вільному доступі,
дозволяючи учням, а особливо їх батькам, слідкувати за результатами навчання,
формуючи при цьому об’єктивну картину;
-навчальний блог дозволяє підвищити інтерес учнів до свого предмета,
заохочує їх до освоєння персонального комп’ютера та, звичайно, підвищує
авторитет викладача;
-навчальний блог дозволяє самовдосконалюватися викладачеві як у знанні
свого профільного предмета, так і в освоєнні основ інформатики;

10
-створити навчальний інтернет-блог може кожен, адже це легко та абсолютно
безкоштовно. Необхідні при цьому лише знання педагога, його бажання, можливості
персонального комп’ютера та вільний доступ до інтернету.
Загалом, тема навчання, поєднаного з блогінгом, зараз дуже актуальна.
Особливо, зважаючи на те, яка кількість людських знань сьогодні перебуває саме в
блогах.
1.3 Види навчальних блогів
Виділяють декілька основнихвидів навчальних блогів:
1. Блог викладача-предметника.
Даний блог може містити план або матеріали уроку, короткий конспект,
завдання для учнів, корисніпосилання, додатковуінформацію для учнів, навчальне
відео, корисні та цікаві ґаджети, форму зворотнього зв’язку і т.д.
2. Блог учнівської групи.
Можна створити блог вашої групи, запросити в якості співавторів батьків та
учнів. У такому блозі можна розміщувати інформацію про заходи, які проводяться,
плани позаурочної роботи, навчальні матеріали, інформацію для батьків, фото і
відео групи, т.д.
3. Блог мережевої спільноти.
Мережеві спільноти – це обмін досвідом та знаннями, скарбничка навчальних
матеріалів, корисні посилання та онлайн-робота.
4. Блог предметного об’єднання.
Подібні блогистворюються з метою об’єднання викладачів предметних секцій.
Вони можуть містити інформацію для викладачів-предметників, оголошення про
конкурси та їх результати, новини в предметній області, навчальні матеріали та
посилання на цікаві сайти та блоги.

11
5. Блог навчального проекту.
Це дуже цікавий вид блогу, присвячений дослідженню певної теми. Містить
збірники питань, завдання, словники. Робота учнів організована і продумана: є
методичнийпаспортпроекту і таблиця досягнень. Відображено проміжні результати
проекту.
6. Тематичний блог.
Блог зазвичай групи авторів, що працюють над висвітленням конкретного
переліку питань без прив’язки до особистості.
7. Блог – «електронний зошит учня».
Блог, який веде учень як електронний зошит для виконання різних завдань з
різних предметів. У викладача є можливість перевірити та прокоментувати виконані
учнем завдання прямо в блозі. А батьки мають змогу проконтролювати успіхи у
навчанні своєї дитини, отримуючи при цьому об’єктивну інформацію.
8. Блог – газета.
Даний блог створює широкі можливості для прояву фантазії та здібностей
учнів. В інтернет-газеті можна проводитирізноманітні опитування, брати інтерв’ю в
цікавих людей, влаштовувати форуми для обговорення поточних проблем або
неймовірних подій, започатковувати найрізноманітніші конкурси, демонструвати
світлини, вітати з іменинами та інше.
Сподіваюсь, що ви вже визначилися, який блог бажаєте створити!

12
2. СТВОРЕННЯ БЛОГУ
2.1 Розробка концепції блогу
Основніетапи створення блогу:
1) розробкаконцепції блогу;
2) змістовне наповнення блогу;
3) вибір платформи для блогу;
4) створення облікового запису користувача;
5) створення шаблону блогу, розробка його дизайну;
6) створення дописів блогу;
7) створення нових сторінок блогу;
8) робота з ґаджетами;
9) редагування блогу;
10) реалізація зворотного зв’язку з читачами блогу.
Орієнтовна структура комплексного блогу викладача (у форматі: Назва
сторінки – короткий опис):
- Головна сторінка:
1) статична (розміщення інформації, яка буде відображатися постійно);
2) динамічна (відображення нових матеріалів).
- Про себе/Про викладача/Інформація про себе – (за умови, що Головна
сторінка динамічна):
1) контактна інформація;
2) коротка інформація про те, що вважаєте головним у своїй діяльності;
3) девіз викладача, емблема, якщо є;
4) які методи, прийоми роботи використовуєте;

13
5) проблемне питання, над яким працюєте, тощо.
Новини/повідомлення/оголошення/останні події/події – необов’язковий
розділ, публікації якого регулярно оновлюються.
Новини групи/життя групи – якщо викладач є класним керівником. Розділ
краще зробити динамічним. Матеріали можна постійно оновлювати, додаючи фото
та відео.
Мої розробки/власна творчість/наробки:
1) календарне планування;
2) конспекти уроків;
3) розробки виховних годин;
4) сценарії позакласних заходів;
5) презентації та відео (якщо не можна віднести до попередніх розділів).
Для батьків/батькам/інформація для батьків: пам’ятки, оголошення,
рекомендації.
Для учнів/учням:
1) організаційна інформація/до відома/розклад: розклад уроків, заміни уроків,
розклад дзвінків, будь-яка плануюча інформація;
2) пам’ятайте: пам’ятки, рекомендації;
3) зверніть увагу: оголошення, повідомлення;
4) домашнє завдання/над чим працюємо вдома/для самостійного
опрацювання/завдання додому: цей розділ бажано розбити за групами або
предметами, якщо викладається декілька предметів.
Розділи в блогах можна реалізувати сторінками (вбудованимиабо доданими, де
кожна сторінка – окремий блог, приєднаний до основного) або мітками
(посиланнями на якусь групу дописів, об’єднаних за певною темою чи ознакою).

14
2.2 Створення нового блогу
Блог — це ваш міні-веб-сайт, легкий в користуванні. Це те місце, де ви можете
швидко публікувати свої думки, відео, фото, отримувати коментарі на них,
спілкуватися з людьми та багато чого іншого.
Для створення блогу:
1) увійти в браузер Google Chrome. Для цього виконати подвійне натискання
лівою кнопкою миші на значку Google Chrome;
2) виконати вхід до свого облікового запису. Для цього натиснути лівою
кнопкою миші на кнопці Увійти (рис. 1);
Рисунок 1. Вхід до облікового запису
3) у вікні з переліком облікових записів вибрати свій та натисніть на ньому
лівою кнопкою миші (рис. 2);
Рисунок 2. Вибір облікового запису

15
4) ввести свій пароль з клавіатури, натиснути Увійти (рис. 3);
Рисунок 3. Вхід до облікового запису
5) зайти до середовищаBlogger;
Для цього:
1) натиснути на кнопку Додатки Google;
2) серед запропонованих додатків (рис. 4) обрати
Blogger;
3) у вікні, що з'явиться натиснути лівою кнопкою
миші на напис Новий блог (рис. 5);
Рисунок 4. Додатки Google

16
Створити блог
Рисунок 5. Блоги користувача
4) у вікні, що з’явиться (рис. 6) виконати такі дії:
-ввести заголовок;
-ввести адресу вашого блогу (вона має легко запам’ятовуватися);
-вибрати потрібний шаблон;
-натиснути кнопку Створити блог.
Перед вами з’явиться повідомлення: Зачекайте, Ваш блог створюється. Після
чого ви перейдете на Панель управління блогом (рис. 7).

17
Рисунок 6. Створення нового блогу
Рисунок 7. Панель управління блогом

18
3. ОБЛІКОВИЙ ЗАПИС GOOGLE
3.1 Створення акаунту Google
Акаунт Google – це ваш універсальний пропуск до всіх сервісів Google,
включаючи Gmail, Google+, YouTube та багатьох інших. Після створення особистого
облікового запису ви одразу автоматично отримуєте поштову скриньку Gmail та
профіль у Google+. При цьому одне й те ж саме ім’я користувача і пароль
використовують для входу в будь-який сервіс Google.
Для створення акаунту:
1) увійти в браузер Google Chrome, виконавши подвійне натискання лівою
кнопкою миші на значку Google Chrome;
2) перейти на сторінку реєстрації https://accounts.google.com/signup.Для цього
в рядку адреси (рис. 8) ввести з клавіатури https://accounts.google.com/signup і
натиснути клавішу Enter;
Рисунок 8. Рядок адреси браузера Google Chrome

19
3) заповнити поля реєстраційної
форми (рис. 9):
 вказати своє ім’я та прізвище;
 вказати адресу електронної
пошти, яка буде використовуватися в
якості логіну;
 вказати пароль для захисту
облікового запису та повторити його
повторним введенням;
 вказати дату свого народження;
 вказати свою стать;
 вказати номер мобільного
телефону або поточну електронну адресу
для підтвердження реєстрації;
 вказати додаткову адресу
електронної пошти;
 вказати країну місцезнаходження;
 натиснути кнопку
Наступний крок.
Примітка: якщо у вас уже є акаунт, і ви просто хочете створити новий, то
натиснувши лівою кнопкою миші на кнопці Обліковий запис Google, слід обрати
команду Додати обліковий запис (рис. 10).
Рисунок 9. Реєстраційна форма

20
3.2 Додавання файлів до сховища Google Диск
Рисунок 11. Додатки Google
Для додавання файлів у Google
Диск, потрібно зайти на свій акаунт і в
правому верхньому кутку натиснути
кнопку Додатки Google(рис. 11), а
потім вибрати пункт Диск.
Перед вами відкриється вікно
Google Диску, де будуть відображатися
всі додані вами об’єкти.
Для додавання нового об’єкту на
Google Диск:
1) натиснути кнопку
Створити (рис. 12);
2) обрати спосіб створення чи
завантаження (рис. 12);
Рисунок 10. Додавання нового облікового запису

21
3) вибрати тип об’єкту, який буде додано або створено. Ви можете створити
папку, документ, презентацію, електронну таблицю, форму, малюнок та інші
об’єкти (рис. 12).
Рисунок 12. Способи додавання об'єктів на GoogleДиск
Як ви можете бачити, є можливість завантаження файлу чи папки, а також
можливість створення інших додатків Google. Після створення вони зберігаються на
диску автоматично.
Отже, для завантаження файлу необхідно виконати такі дії:
1) в середовищі Google Диску виконати команду Створити/Завантажити
файл;
2) у вікні завантаження файлу (папки) вибрати необхідний файл для
розміщення на Google Диску і натиснути кнопку Відкрити (рис.13).
Процес завантаження файлу чи папки відображається в правому нижньому куті
вікна (рис. 14).

22
Після завантаження документ з’явиться в списку ваших файлів на Google
Диску.
За замовчуванням всі ваші файли на сторінці Google Диску відображаються у
вигляді списку, де файли можна сортувати за назвою – якщо натиснути
на Назва (у таблиці з вашими файлами), власником – Власник
або розміром файлу – Розмір файлу.
Рисунок 13. Завантаження документа
Рисунок 14. Стан завантаження файлу

23
4. СТВОРЕННЯ ПОВІДОМЛЕНЬ БЛОГУ
4.1 Створення нової публікації
Створити нову публікацію можна одним із наведених нижче способів:
Спосіб 1.
На панелі управління блогом натиснути кнопку Нова публікація
або перейти до вкладки Публікації та натиснути на напис Створити нову
публікацію (рис. 15).
Рисунок 15. Створення нової публікації з панелі управління блогом
Спосіб 2.
На панелі управління блогом натиснути кнопку Переглянути
блог (таким чином відкриється ваш блог) і на панелі інструментів обрати команду
Нова публікація (рис. 16).
Обидва способи відкриють перед вами вікно Публікація (рис.17).
Перед створенням самого допису необхідно ознайомитися з панеллю
інструментів вікна Публікація, якадозволяє виконувати операції з текстом (рис. 18).

24
Рисунок 16. Створення нової публікації з блогу
Рисунок 17. Вікно Публікація повідомлення
Рисунок 18. Панель інструментів вікна Публікація

25
У вікні Публікація слід виконати такі дії:
1) ввести з клавіатури заголовок публікації в рядок Заголовок допису (рис. 17);
2) ввести текст публікації в області Тексту публікації (рис. 17), під час
введення тексту скористатися загальними правилами набору тексту;
3) оформити свій текст, скориставшись панеллю інструментів (рис. 18);
4) додати мітки до публікації, натиснувши лівою кнопкою миші на кнопці
Мітки, ввести їх з клавіатури через кому, натиснути кнопку
Готово;
Мітки відображаються під повідомленням після публікації. Натискуючи лівою
кнопкою мишки на будь-якій з них, ви перейдете до сторінки, на якій містяться
лише повідомлення з вказаною міткою.
5) опублікувати повідомлення, натиснувши кнопку
Опублікувати.
Після публікації система запропонує вам додати коментар до допису та
поділитися з користувачами Google+ (рис. 19).
Рисунок 19. Спільний доступ у службі Google+

26
На панелі управління блогом на вкладці Публікації над виділеним
повідомленням можна виконати такі операції (рис. 20):
1) редагувати;
2) переглянути;
3) надати доступ;
4) видалити.
Рисунок 20. Операції, які можна виконати над публікацією
Щоб переглянути результат роботи необхідно вибрати команду Переглянути
(рис. 20). У режимі перегляду блог відкривається в новій вкладці.
Примітка: кожна нова стаття буде розміщуватися над попередньою. Тобто
ваша перша стаття стане останньою (нижньою) в блозі.
4.2 Додавання спеціальних символів у повідомлення блогу
Під час набору тексту повідомлення виникає необхідність використати в тексті
символи, яких немає на клавіатурі (спеціальні символи). Віднедавна на платформі
Blogger з’явилася така можливість.
Для додавання спеціальних символів необхідно скористатися кнопкою панелі
інструментів вікна Публікація – Вставлення спеціальних символів (рис. 21).
Рисунок 21. Вставлення спеціальних символів

27
Після вибору даної команди відкриється вікно Вставлення спеціальних
символів (рис. 22).
Рисунок 22. Вікно Вставлення спеціальних символів
У вказаному вище вікні знайти потрібний символ можна одним із
способів (рис. 22):
1) прокручуючи зразки представлених символів;
2) ввести ключове слово в поле пошуку;
3) намалювати символ мишкою.
4.3 Додавання посилань у повідомлення блогу
Після додавання файлів до Google Диску, посилання на них можна додавати в
повідомлення блогу.
Перш за все створюємо нове повідомлення вже відомим нам способом. Для
прикладу вводимо такий текст: «План уроку наступного заняття».

28
Набір тексту плану уроку займає багато часу та місця. До того ж функції
форматування тексту повідомлення блогу досить обмежені. Єдиний вихід у цьому
випадку – додати посилання на файл, який містить у собі готовий план уроку. За
цим посиланням ваші читачі можуть переглянути або завантажити вказаний файл.
Отже, необхідно виконати такі дії:
1) виділити лівою кнопкою миші слово чи словосполучення, яке буде
виступати в ролі посилання, наприклад: план уроку;
2) у новій вкладці браузера відкрити вікно Google Диску;
3) знайти потрібний файл і виділити його лівою кнопкою миші;
4) відкрити загальний доступ до цього файлу натисканням кнопки
Надати доступ. З’явиться вікно (рис. 23), в якому через кнопку
Редагування можна обратичитачів. У цьому ж вікні можна отримати
посилання на файл, натиснувши кнопку Посилання
для спільного доступу;
Рисунок 23. Надання спільного доступу до файлу

29
5) після виконання цих дій ви отримаєте посилання на файл (рис. 24), яке
необхідно скопіювати натисканням на кнопку Копіювати
посилання, натиснути кнопку Готово;
Рисунок 24. Посилання на файл
6) перейти на вкладку з блогом;
7) виділити лівою кнопкою миші текст на який потрібно додати посилання;
8) натиснути кнопку Прив’язати (рис.21), у вікні Редагувати
посилання (рис. 25) в рядку Веб-адреса вставити з буферу обміну отримане
посилання (поєднання клавіш CTRL+V або Shift+Insert), натиснути кнопку
ОК.

30
Рисунок 25. Редагування посилання
Ви маєте отримати подібний результат (рис. 26):
Рисунок 26. Додане посилання на файл
4.4 Додавання зображень у повідомлення блогу
У створене повідомлення для наочності можна додати зображення. Для цього
необхідно на панелі інструментів у вікні повідомлення натиснути кнопку
Вставити зображення.

31
Перед вами з’явиться діалогове вікно (рис. 27), яке дозволяє вибрати спосіб
додавання зображень:
- завантажити – завантаження файлу із зображенням з комп’ютера;
- з цього блогу – завантаження зображень розміщених на поточному блозі;
- з архіву альбомів Google – завантаження фото або зображення з Google
Диску;
- з телефону – завантаження зображень, розміщених на мобільному
телефоні;
- з веб-камери – завантаження зображень, знятих за допомогою веб-камери,
встановленої на цьому ж комп’ютері;
- з URL-адреси – завантаження зображень за вказаним інтернет-посиланням.
Рисунок 27. Додавання зображення
Розглянемо додавання зображення з комп’ютера:
1) натиснути на кнопку Вставити зображення;
2) у діалогову вікні обрати спосіб додавання – Завантажити;
3) натиснути кнопку Вибрати файли;
4) у діалоговому вікні вибрати потрібний файл, виділити його лівою кнопкою
миші, натиснути кнопку Відкрити;

32
5) після повного завантаження файлу виділити його лівою кнопкою миші,
натиснути кнопку Додати вибрані.
Для редагування доданого зображення слід натиснути на ньому лівою кнопкою
миші. Під зображенням з’явиться панель інструментів редагування зображення
(рис. 28).
Рисунок 28. Редагування зображення
4.5 Додавання відео до повідомлення блогу
Для додавання відео на панелі інструментів у вікні Повідомлення слід
натиснути кнопку Вставити відео. Перед вами з’явиться діалогове вікно
Додати відео
(рис. 29), яке дозволяє вибрати спосіб додавання відео:
- завантаження – завантаження відео-файлу з комп’ютера;
- з YouTube – завантаження відео з YouTube не виходячи з блогу;
- мої відео на YouTube– завантаження відео з власного каналу на YouTube, не
виходячи з блогу;
- з телефону – завантаження відео, розміщених на мобільному телефоні.
Розглянемо додавання відео з YouTube:
1) натиснути на кнопку Вставити відео;

33
2) у діалогову вікні, що з’явиться, вибрати спосіб додавання – З YouTube;
3) у діалоговому вікні Додати відео (рис. 30) в рядку пошуку ввести з
клавіатури запит на пошук і натиснути кнопку Пошук;
Рисунок 29. Додавання відео
4) серед результатів пошуку обрати потрібне відео, виділити його лівою
кнопкою миші, натиснути кнопку Вибрати.
Примітка: у повідомлення блогу можна додати відео розміром не більше
100 Мб. В іншому випадку краще скористатися додаванням посилання на відео, яке
знаходиться на Google Диску.
Рисунок 30. Додавання відео з YouTube

34
4.6 Додавання Google Форми в повідомлення блогу
Однією з сучасних технологій оцінки навчальних досягнень учнів є форма
контролю у вигляді електронних тестових завдань.
Blogger надає можливість створити онлайн-тестування безпосередньо у
повідомленні блогу. Для цього призначений простий у користуванні та
налаштуванні додаток – Google Форми.
Форми створюються та зберігаються на Google Диску за допомогою команди
Створити/Google Форми (рис. 31).
Рисунок 31. Створення Форми
Для додавання вже готової форми до повідомлення блогу необхідно виконати
такі дії:
1) на Google Диску знайти та відкрити потрібну форму;
2) на панелі інструментів натиснути кнопку Надіслати(рис. 32);
3) натиснути кнопку Вставити HTML-код (рис. 33) для отримання
коду для вставки в повідомлення;

35
Рисунок 32. Редагування Форми
4) налаштувати ширину і висоту відображення форми, натиснути кнопку
Копіювати;
6) вибрати публікацію, в яку буде додано форму;
7) відкрити публікацію для редагування і в режимі HTML вставити
скопійований код;
8) перейти в режим публікації (кнопка Написати) і натиснути
кнопку Опублікувати;
9) переглянути результат, натиснувши кнопку Переглянути
блог.
Ви маєте отримати подібний результат (рис. 34).

36
Рисунок 33. Вікно Надіслати форму
Рисунок 34. Форма в повідомленні

37
4.7 Додавання презентації в повідомлення блогу
Презентація PowerPoint дозволяє представити будь-який матеріал учням
зрозуміліше, яскравіше та цікавіше. Презентації також можна додавати в
повідомлення блогу та розміщувати їх на блозі в режимі слайдів (рис. 35).
Рисунок 35. Презентація в режимі слайдів
Але слід враховувати, що в цьому режимі ефекти анімації не відображаються.
Презентація на блог додається через додаток Google Презентації.
Для завантаження презентації з Google Диска потрібно виконати такі дії:
1) відкрити в новій вкладці браузера Google Диск;
2) у середовищі Google Диску виконати команду Створити/Google
Презентації (рис. 36);
3) виконати команду Файл/Відкрити…(рис. 37);

38
Рисунок 36. Створення Google Презентації
Рисунок 37. Команди меню Файл

39
4) вибрати презентацію на Google Диску або завантажити її з комп'ютера
(рис. 38);
Рисунок 38. Завантаження презентації з Google Диску
5) відредагувати презентацію засобами Google Презентацій;
6) виконати команду Файл/Опублікувати в Інтернеті (рис. 37);
7) у вікні, що з’явиться налаштувати параметри публікації презентації
(рис. 39);
8) після виконання всіх налаштувань презентації перейти на вкладку
Вставити(рис. 39) і скопіювати код для вставки презентації в повідомлення блогу;
9) перейти на вкладку з повідомленням блогу;
10) перейти в режим HTML, виконати вставку коду (комбінація клавіш
CTRL+V) і перейти в режим Написати;
11) переглянути результат додавання презентації;
12) натиснути кнопку Опублікувати.

40
Рисунок 39. Параметри публікації
4.8 Додавання розриву в повідомлення блогу
Повідомлення блогу часто бувають довгимиі при розміщенні на блозі мають не
зовсім естетичний вигляд. Уникнути цього можна за рахунок додавання розриву. У
цьому разі на сторінці блогу відобразиться лише та частина, яка знаходиться вище
розриву. Частину нижче розриву можна побачити після натискання на напис
Детальніше>> (рис. 40).
Рисунок 40. Розрив у повідомленні

41
Для додавання розриву необхідно виконати такі дії:
1) перейти в потрібне місце допису(розрив будедодано після позиції курсору)
і натиснути кнопку Вставити розрив переходу;
2) у місці додавання розривуз’явиться напис – Детальніше>> (рис. 40). Після
натискання на ньому лівою кнопкою миші, текст повідомлення відобразиться
повністю.
4.9 Додавання анімованого тексту заголовку
Анімований текст у повідомленні можна використати не тільки як заголовок.
Його можна додати в будь-якому місці повідомлення. Для його створення існує
багато онлайн-сервісів.
Я пропоную розглянути додавання заголовку, створеного в сервісі
up-image.com:
1) знайти на блозі потрібне повідомлення і натиснути кнопку
Редагувати публікацію;
2) у новій вкладці браузера в адресному рядку ввести: http://up-image.com/;
3) на сторінці сайту в генераторі анімованого тексту (рис. 41) виконати такі
кроки:
1 – ввести текст;
2 – вибрати шрифт та розмір шрифту;
3 – вибрати текстуру тексту та рамку тексту, якщо потрібно;
4 – отримати HTML-код для додавання в блог;
5 – скопіювати HTML-код у буфер обміну.
4) перейти на вкладку з повідомленням;
5) в режимі HTML вставити з буферу обміну скопійований код (комбінація
клавіш CTRL+V) і перейти в режим Написати;

42
6) опрацювати доданий текст як зображення (рис. 42);
7) зберегти або опублікувати зміни (кнопки Зберегти,
Опублікувати).
Рисунок 41. Генератор анімованого тексту
Рисунок 42. Опрацювання готового анімованого тексту

43
Створити такі написи можна також на таких сайтах, як http://giiif.ru/,
http://ru.bloggif.com/, http://gfto.ru/, http://libo.ru/bukofki.html/ та на багатьох інших.
4.10 Як «оживити» текст на блозі
Текст на блозі або в повідомленнях блога можна «оживити», тобто змусити
рухатися як на екрані монітора під час набору з клавіатури. Такий текст називається
«лайвтайпом».
Для створення лайвтайпу скористаємось можливостями HTML-коду та
ресурсами сайту http://livetyping.ru/.
Розглянемо на прикладі «оживлення» тексту повідомлення:
1) на новій вкладці браузеразайти на сайт http://livetyping.ru/;
2) набрати з клавіатури текст, який потрібно «оживити», налаштувати його
параметри, натиснути кнопку Оживити (рис. 43);
Рисунок 43. Створення лайвтайпу

44
3) під отриманим лайвтайпом натиснути на напис Код
для сайту або блогу (рис. 44);
Рисунок 44. Отриманий лайвтайп
4) скопіювати код лайвтайпу (рис. 45);
Рисунок 45. Код лайвтайпу
5) в новій вкладці браузера відкрити свій блог;
6) знайти повідомлення, заголовок якого необхідно змінити, натиснути кнопку
Редагувати публікацію;
7) у вікні повідомлення перейти в режим HTML і вставити код (CTRL+V),
перейти в режим Написати;
8) налаштувати лайвтайп як зображення;

45
9) опублікувати (натиснути Оновити) та переглянути результат
(натиснути кнопку Переглянути блог).
4.11 Додавання електронного підпису
Сьогодні все більшої популярності набирає використання красивого
електронного підпису для блогів. Сервісів, які надають такі можливості – безліч.
Цей сайт надає можливість створити статичний підпис у вигляді зображення,
не потребує реєстрації та надає послуги безкоштовно. Для створення анімованого
підпису краще скористатися іншою програмою (сайтом) або платними послугами
даного сайту.
Розглянемо створення електронного підпису за допомогою сайту
Mylivesignature.com:
1) перейти на сайт програми, для цього в адресному рядку браузера ввести
адресу http://www.mylivesignature.com/ і натиснути клавішу Enter;
2) у вікні, що з’явиться, натиснути кнопку Розпочати (рис. 46);
3) обрати спосіб створення - За допомогою Майстра створення підпису
(рис. 47);
4) ввести з клавіатури текст підпису латинськими літерами (максимальна
довжина – 25 символів), натиснути кнопку Next Step> Наступний крок;
5) на наступному кроці вибрати шрифт підпису і натиснути кнопку
Next Step> Наступний крок;
6) на наступному кроці вибрати розмір шрифту і натиснути кнопку
7) на наступному кроці вибрати колір підпису і натиснути кнопку
8) на наступному кроці вибрати кут нахилу підпису і натиснути кнопку

46
Рисунок 46. Сайт mylivesignature.com
Рисунок 47. Майстер створення підпису
9) на останньому кроці майстра створення підпису (рис. 48) натиснути кнопку
CLICK HERE TO DOWNLOAD YOUR SIGNATURE Натисніть тут для
завантаження вашого підпису;
10) в новій вкладці браузера відкрити свій блог;
Майстер створення
підпису

47
Рисунок 48. Готовий підпис
11) відкрити потрібне повідомлення для редагування;
12) встановити курсор у місці додавання підпису та натиснути кнопку
Вставити зображення;
13) обрати спосіб вставки зображення – Завантажити, натиснути кнопку
Вибрати файли, знайти файл з підписом, натиснути кнопку
Відкрити;
14) після завантаження зображення натиснути кнопку
Додати вибрані;
15) налаштувати доданий електронний підпис як зображення.
Рисунок 49. Електронний підпис

48
5. НАЛАШТУВАННЯ ШАБЛОНУ ТА МАКЕТУ БЛОГУ
5.1 Налаштування «реакцій» на повідомлення блогу
Для організації зворотного зв’язку на блозі, окрім коментарів до посилання,
можна додати такий засіб, як «реакція». Річ у тім, що, переглянувши повідомлення
на блозі, не кожний читач залишить коментар, а ось залишити під повідомленням
«галочку»-реакцію зможе кожний. «Реакція» допомагає автору допису
проаналізувати свою роботу.
Для налаштування «реакцій»:
1) зайти в Blogger- натиснути на кнопку Додатки Google, серед додатків
обрати Blogger;
2) вибрати в списку потрібний блог;
3) на панелі управління блогом вибрати команду Макет;
4) на макеті знайти область Публікації блогу, натиснути на напис Редагувати
(рис. 50);
5) у вікні налаштування повідомлення активувати параметр Реакція (рис. 51);
6) якщо стандартні реакції користувача на повідомлення не влаштовують, їх
можна змінити, натиснувши на напис Редагувати (рис. 51). Реакції вводити з
клавіатури через кому, натиснути кнопку Зберегти;
7) натиснути кнопку Зберегти компонування;
8) після того, як з’явиться повідомлення Ваші зміни збережено, можна
переглянути блог, натиснувши кнопку Переглянути блог.

49
Рисунок 50. Налаштування параметрів повідомлень
Рисунок 51. Реакції на повідомлення
Рисунок 52. Повідомлення з "реакціями"

50
5.2 Налаштування шаблону блогу
Шаблон – це набір налаштувань зовнішнього вигляду блогу.
Завдяки широкому вибору шаблонів, шрифтів, кольорів і варіантів дизайну
стовпців ви можете виразити себе в своєму блозі.
Щоб перейти до налаштувань, робимо наступне:
1) зайти в Blogger- натиснути на кнопку Додатки Google, серед додатків
обрати Blogger;
2) вибрати в списку потрібний блог;
3) на панелі управління блогом вибрати команду Тема;
4) у вікні, що з’явиться (рис. 53) можна змінити шаблон блогу;
Рисунок 53. Вкладка Тема
5) натиснути кнопку Налаштувати;

51
6) у вікні Дизайнератем Blogger(рис. 54) на вкладці Теми вибрати потрібний
шаблон;
Рисунок 54. Попередній перегляд шаблону
7) на відповідних вкладках (Тло, Змінити ширину, Макет, Додаткова)
виконати потрібні налаштування (рис. 54);
8) після налаштування елементів шаблону натиснути кнопку
Зберегти в блозі;
9) для перегляду результату натиснути кнопку Переглянути
блог.
Всі зміни, які відбуваються з вашим блогом, відображаються в нижній частині
вікна Дизайнера тем Blogger.
5.3 Додавання піктограми блогу
Переглядаючи різні блоги в Інтернеті, відкрила для себе таку цікаву річ - серед
них виділяються лише ті, які мають нестандартну піктограму.
Піктограма (іконка) – це малюнок, який презентує блог і міститься в його
заголовку (рис. 55). Найчастіше має розширення файлу - .png.

52
Рисунок 55. Піктограми блогів
Для додавання піктограми до блогу необхідно виконати такі дії:
1) зайти в Blogger і вибрати в списку потрібний блог;
3) у вікні редагування макету в області Піктограма сайту натиснути напис
Редагувати (рис. 56), після чого з’явиться вікно Налаштування іконки сайту
(рис. 57);
Рисунок 56. Піктограма сайту
4) відкрити в Інтернет-браузері нову вкладку і в рядку пошуку ввести запит
«іконка для сайту». Для пошуку потрібного зображення натиснути кнопку
Інструменти, в меню Розмір обрати пункт Піктограми (рис. 58),
натиснути кнопку Пошук або клавішу Enter на клавіатурі;
5) серед результатів пошуку вибрати потрібне зображення і натиснути на
ньому правою кнопкою миші, в контекстному меню, що з’явиться, обрати команду
Відкрити посилання в новій вкладці…;
6) перейти на вкладку із зображенням, натиснути на ньому правою кнопкою
миші, в контекстному меню вибрати команду Зберегти картинку як…, зберегти
файл із зображенням на комп’ютері;
7) перейти до вкладки з вашим блогом;

53
Рисунок 57. Вікно налаштування іконки сайту
Рисунок 58. Пошук потрібного зображення

54
8) у вікні налаштування іконки сайту (рис. 57) натиснути кнопку
Оберіть файл, у вікні Відкривання знайти свій файл з іконкою,
виділити його лівою кнопкою миші та натиснути кнопку Відкрити,
натиснути кнопку Зберегти;
9) перевірити результат, натиснувши кнопку Переглянути
блог.
Сподіваюсь, що ваша піктограма стане окрасою вашого блогу!
5.4 Налаштування шапки блогу
Перше, на що користувач звертає увагу, зайшовши на блог – це шапка блогу.
Вона знаходиться в його верхній частині і зазвичайзаймає всю ширину блогу, в
шапці знаходиться заголовокблогута його описання.
Для редагування шапки блогу:
1) зайти в Blogger, вибрати в списку потрібний блог;
2) на панелі керування блогом вибрати команду Макет;
3) у вікні редагування макету в області віджета Шапка сторінки (рис. 59)
натиснути на напис Редагувати;
Рисунок 59. Віджет Шапка сторінки
4) у вікні Конфігурація шапки (рис. 60) виконати потрібні налаштування і
натиснути кнопку Зберегти.

55
Рисунок 60. Конфігурація шапки
Розглянемо додавання зображення у шапку з мережі Інтернет, розмістивши
його слідом за назвою й описом. Для цього вам необхідно знати ширину блогу в
пікселях (можна переглянути в налаштуваннях шаблону блогу), заздалегідь знайти
та зберегти на комп’ютер потрібне зображення.
Для додавання зображення в шапку блогу:
1) у новій вкладці інтернет-браузера в рядку пошуку ввести запит, наприклад
«Кошенята» (рис. 61);

56
Рисунок 61. Пошук зображення
2) для розширеного пошуку натиснути кнопку Інструменти,
в меню Розмір обрати пункт Лише розміром, ввести з клавіатури потрібні розміри
(у мене: 1100*200), натиснути кнопку Пошук або клавішу Enter на клавіатурі;
3) серед результатів пошуку обрати потрібне зображення і зберегти його на
комп’ютер розглянутим раніше способом;
4) перейти на вкладку з вашим блогом;
5) у вікні налаштування Конфігурації шапки (рис. 60) натиснути кнопку
Оберіть файл, у вікні Відкривання знайти файл із зображенням,
виділити його лівою кнопкою миші та натиснути кнопку Відкрити,
обрати спосіб розташування - Слідом за назвою й описом (рис. 62), натиснути
кнопку Зберегти;
6) перевірити результат, натиснувши кнопку Переглянути
блог.

57
Рисунок 62. Налаштування зображення шапки
5.5 Додавання сторінок до блогу
Сторінки блогу можуть бути статичними (інформація додається як при
редагуванні повідомлення) або динамічними (сторінка представлена як окремий
блог).
Для додавання статичних сторінок:
2) на панелі управління блогом вибрати команду Сторінки;
3) натиснути кнопку Нова сторінка або натиснути на напис
Створити нову сторінку (рис. 63);

58
Рисунок 63. Вкладка Сторінки
4) у вікні Сторінка (рис. 64) виконати дії ідентичні до створення нового
повідомлення;
Рисунок 64. Вікно Сторінка
5) натиснути на кнопку Параметри та виконати потрібні
налаштування (рис. 65), натиснути кнопку Готово;
6) натиснути кнопку Опублікувати;
8) в області Усі стовпці натиснути напис Додати
ґаджет (рис. 66);

59
Рисунок 65. Налаштування параметрів сторінки
Рисунок 66. Додавання нового ґаджета
9) у списку вибрати ґаджет Сторінки (рис. 67), натиснути кнопку Додати;
Рисунок 67. Ґаджет Сторінки
10) у вікні Налаштувати список сторінок (рис. 68) встановити всі необхідні
опції і натиснути кнопку Зберегти, натиснути кнопку

60
Зберегти компонування, натиснути кнопку
Переглянути блог.
Рисунок 68. Налаштування списку сторінок
Для додавання динамічних сторінок, кожна з яких представляє собою окремий
блог:
3) в області Усі стовпці знайти віджет Сторінки і натиснути на напис
Редагувати (рис. 69);

61
Рисунок 69. Віджет Сторінки
4) у вікні Налаштувати список сторінок (рис. 68) натиснути кнопку
Додати зовнішнє посилання;
5) відкрити список своїх блогів у новій вкладці браузера;
6) відкрити блог, який слугуватиме сторінкою;
7) скопіювати (CTRL+C) його веб-адресу в адресному рядку браузера;
8) перейти на сторінку з основним блогом;
9) у вікні Нова сторінка (рис. 70) ввести заголовок сторінки та вставити веб-
адресу (натиснути CTRL+V), натиснути кнопку Зберегти
посилання;
Рисунок 70. Приєднання іншого блогу в якості сторінки
10) натиснути кнопку Зберегти компонування, натиснути
кнопку Переглянути блог.

62
6. ДОДАВАННЯ ҐАДЖЕТІВ ДО БЛОГУ
6.1 Додавання ґаджета «Мітки»
Мітки використовуються для полегшення навігації блогом. Вони додаються під
час створення публікацій, а для їх відображення на блозі використовують
стандартний ґаджет Мітки.
Для додавання міток необхідно зробити наступне:
1) відкрити блог вже відомим вам способом;
3) вибрати місце для розміщення міток (списком на бічній панелі, у вигляді
меню блогу), натиснути в обраному місці напис Додати
ґаджет;
4) у списку вибрати ґаджет Мітки (рис. 71) і натиснути кнопку Додати;
Рисунок 71. Ґаджет Мітки
5) виконати налаштування міток (рис. 72): вибрати заголовок та спосіб
відображення міток (список або хмара міток), активувати (за бажанням) опцію
Показувати кількість дописів для кожної мітки;
6) натиснути кнопку Зберегти, натиснути кнопку
Зберегти компонування та кнопку

63
Рисунок 72. Налаштування міток
Примітка: якщо мітки додаються під заголовком блогуу виглядіменю, то поле
Заголовок під час налаштування Конфігураціїмітокнеобхідно залишити порожнім.
6.2 Додавання ґаджета «Архів блогу»
Для додавання цього ґаджета необхідно:
2) вибрати на одній із бічних панелей місце для розміщення архіву, натиснути
в обраному місці напис Додати ґаджет;
3) у списку вибрати ґаджет Архів блогу (рис. 73) і натиснути кнопку
Додати;

64
Рисунок 73. Ґаджет Архів блогу
4) налаштувати відображення архіву (рис. 74): ввести заголовок, вибратистиль
відображення, періодичність архівування, формат дати;
Рисунок 74. Налаштування архіву

65
Рисунок 75. Архів блогу
6.3 Додавання ґаджета «Опитувальник»
Ще одним способом зворотногозв’язкуз читачами вашого блогу є опитування.
Опитування найчастіше проводитьсядля того, щоб з’ясуватидумку відвідувачів про
якісь певні факти або події. Для цього розробникидодали ґаджет Опитування. Для
його додавання необхідно:
2) вибрати на одній з бічних панелей місце для розміщення архіву, натиснути в
обраному місці напис Додати ґаджет;
3) у списку вибрати ґаджет Опитування (рис. 76) і натиснути кнопку
Додати;

66
Рисунок 76. Ґаджет Опитування
4) налаштувати опитування (рис. 77): ввести запитання, варіанти відповідей,
дозвіл на вибір кількох відповідей, дату та час завершення опитування;
Рисунок 77. Налаштування опитування

67
Рисунок 78. Опитування на блозі
6.4 Додавання ґаджета «Статистика блогу»
Даний ґаджет відображає кількість переглядів сторінок вашого блогу і
найчастіше розташований на одній із бічних панелей.
Для його додавання:

68
2) вибрати на одній з бічних панелей місце для розміщення архіву, натиснути в
3) у списку вибрати ґаджет Статистика для блогу (рис. 79) і натиснути
кнопку Додати;
Рисунок 79. Ґаджет Статистика для блогу
4) налаштувати параметри відображення статистики (рис. 80): ввести
заголовок, проміжокчасу, за який необхідно відобразити статистику, вибрати стиль
відображення та варіанти оформлення;
Рисунок 80. Налаштування віджета Статистика

69
Рисунок 81. Статистика блогу
6.5 Додавання ґаджета «Панель відео»
Ґаджет «Панель відео» дає можливість відвідувачам переглядати відео
YouTube, не залишаючи сторінку блогу.
Для його додавання необхідно виконати такі дії:
1) на панелі керування блогом вибрати команду Макет;
2) вибрати на одній з бічних панелей місце для розміщення відео, натиснути в
3) у списку вибрати ґаджет Панель відео (рис. 82) і натиснути кнопку
Додати;
Рисунок 82. Ґаджет Панель відео

70
4) у вікні Налаштування панелі відео (рис. 83) налаштувати потрібні
параметри ґаджета;
Рисунок 83. Налаштування Панелі відео
5) у налаштуваннях ґаджета можна задати такі параметри:
- назва ґаджета;
- налаштування на каналі YouTube тих відео, які відповідають визначеним
категоріям;
- канали YouTube;
- налаштувати ключові слова відео, що відображається;
- попередній перегляд відео;

71
7. РОБОТА З ҐАДЖЕТОМ HTML/JAVASCRIPT
7.1 Додавання ґаджета «HTML/JavaScript»
Ґаджет «HTML/JavaScript» – це універсальний спосіб додавання до блогу
додаткових об’єктів, таких як картинка, відео, банер, кнопки, текст і посилання.
Приємною особливістю використання даного ґаджета є можливість
вбудовування за допомогою HTML-коду інструментів веб 2.0, основне призначення
яких – інтерактивний супровід навчання.
Для додавання ґаджета «HTML/JavaScript» необхідно:
1) відкрити блог вже відомим вам способом;
3) вибрати місце для розміщення ґаджета, натиснути в обраному місці напис
Додати ґаджет;
4) у списку вибрати ґаджет «HTML/JavaScript» (рис. 84) і натиснути кнопку
Додати;
Рисунок 84. Ґаджет HTML/JavaScript
5) у вікні Конфігурація HTML/JavaScript (рис. 85) вказати заголовок
ґаджета та вставити HTML-код певного об’єкта;

72
Рисунок 85. Налаштування ґаджета HTML/JavaScript
7.2 Додавання інформера погоди
Інформер - це графічний або HTML-об'єкт, який встановлюється на сайті
користувача і автоматично оновлюється.

73
Погодний інформер - це невеликий графічний файл (малюнок) розміром від 2
до 5 кілобайт, який автоматично відображає прогноз погоди для обраного вами
міста.
Головна мета погодного інформера - зацікавити відвідувачів вашого блогу та
підвищити відвідуваність вашого ресурсу.
Ви можете встановити собі на сторінку погодний інформер з таких сайтів:
- ua.sinoptik.ua/інформери;
- gismeteo.ua/ua/informers/;
- opogode.ua/ua/informer;
- meteo.ua/ua/informers;
- meteoprog.ua/ua/informers/;
- pogodnik.ua/інформер;
- weather.i.ua/informer/.
Розглянемо додавання інформера від Gismeteo:
1) відкрити нову вкладку браузера, в адресному рядку ввести адресу сайту -
https://www.gismeteo.ua/ua/informers/, натиснути клавішу Enter;
2) на сторінці сайту (рис. 86) натиснути кнопку
Створити інформер;
Рисунок 86. Сторінка сайту gismeteo.ua

74
3) налаштувати погодний інформер, виконуючи вказівки Конструктора
погодних інформерів (рис. 87), натиснути кнопку
Отримати код інформера;
Рисунок 87. Конструктор погодних інформерів
У Конструкторі можна налаштувати такі параметри:
- мова інформера;
- назва місця розташування;
- параметри розташування на сайті або блозі, параметри відображення
погодних умов, налаштування відображення температури, тиску, вітру;

75
- налаштування зовнішнього вигляду інформера;
- налаштування способу отримання коду інформера;
4) після виконання всіх налаштувань скопіювати в буфер обміну отриманий
код (комбінація клавіш CTRL+C);
7) додати на одну з бічних панелей ґаджет «HTML/JavaScript» (рис. 84);
8) у вікні Конфігурація HTML/JavaScript (рис. 85) вставити з буферу обміну в
полі Вміст код інформера;
Рисунок 88. Погодний інформер

76
7.3 Додавання ґаджета «рухомий рядок»
Ґаджет «рухомий рядок» найчастіше використовується для відображення
реклами, останніх новин та статей. Використовувати цей ґаджет можна як у
повідомленнях, так і на сайдбарах (панелях) блогу.
Рухомий рядок створюється за допомогою спеціальних тегів
<marquee>Текст рухомого рядка</marquee>
Для налаштування рухомого рядка використовують наступну таблицю:
Таблиця 1. Таблиця тегів для
налаштування рухомого рядка
Тег Опис
direction="left" Направлення руху вліво
direction="right" Направлення руху вправо
direction="down" Направлення руху вниз
behavior="alternate" Текст іде вправо до кінця, а потім у зворотному
напрямку
behavior="slide" Текст зупиняється, дійшовши до кінця
loop="4" Контролює час відображення тексту
scrollamount="2" Швидкість руху тексту, чим більша тим швидше
width="400" Ширина тексту
height="66" Висота тексту
bgcolor="#9999CC" Колір тла
style="color: #FF0000" Колір тексту
style="font-size: 1em" Розмір шрифту
style="font-family: Tahoma" Тип шрифта
style="font-size: 12pt; color:
#800000; font-family: Tahoma"
Змінити тип і розмір шрифта в одном тегу

77
Розглянемо додавання «рухомого рядка»:
1) зайти в Blogger та зайти на свій блог;
3) в області нижньої панелі під областю повідомлення додати ґаджет
«HTML/JavaScript» (рис. 84);
4) у вікні Конфігурація HTML/JavaScript (рис. 85) у полі Вміст ввести з
клавіатури текст: <marquee>Це – рухомий рядок!</marquee>, натиснути кнопку
Зберегти;
5) натиснути кнопку Зберегти компонування та
кнопку Переглянути блог.
Рисунок 89. Рухомий рядок
Спробуємо встановити такі параметри тексту: встановити шрифт – Tahoma,
колір тексту - #FFFAFA (білий), розмір шрифту - 12pt, колір фону - #7CFC00
(салатний), висота блоку з рухомим рядком - 66, ширина блоку – 318.
Для цього необхідно виконати такі дії:
1) у режимі попереднього перегляду блогу під «рухомим рядком» натиснути
кнопку Редагувати (рис. 90);
Рисунок 90. Редагування "рухомого рядка"

78
2) у вікні редагування HTML-коду видалити попередній код і ввести новий:
<marquee style="font-family: tahoma; color: #FFFAFA; font-size: 12pt"
bgcolor="#7CFC00" height="66" width="318">Це - рухомий рядок!</marquee>
3) натиснути кнопку Зберегти;
4) на панелі інструментів браузера натиснути кнопку Оновити;
Рисунок 91. Рухомий рядок
Якщо не вказувати ширину та висоту блоку з текстом, то рядок буде рухатися
по всій ширині блогу.
Таблиця 2. Таблиця кольорів
7.4 Додавання посилання або зображення в «рухомий рядок»
Ми вже розглянули, як додати в блог «рухомий рядок» і як його налаштувати.
А зараз розглянемо, як додати в «рухомий рядок» посилання або зображення.
Зробити це не важко, необхідно лише слідувати інструкціям.

Блог як ефективний засіб для навчання

Блог як ефективний засіб для навчання

Recommended

Recommended

More Related Content

Similar to Блог як ефективний засіб для навчання

Similar to Блог як ефективний засіб для навчання (20)

More from Марина Белоцерковец

More from Марина Белоцерковец (9)

Блог як ефективний засіб для навчання