Quest 2. "Avatar"

Цей квест присвячено створенню вашого анімаційного аватару. Такому, як дівчина Джулія, що зверху. Навіщо він потрібен? Ми розмістимо його у боковій колонці вашого блогу і він стане чимось на зразок візитки, чи рекламки, що будуть привертати увагу читачів.

Такий плеєр робиться на сайті Voki.
Отже, заходимо туди та реєструємось (справа зверху кнопка Register). Вам на пошту прийде лист для підтвердження реєстрацій. Знайдіть там такий рядок:

Welcome to Voki. To activate your Voki account, click on the following link, or paste it into your browser:

А після нього буде йти ссилка - її треба натиснути.

Після цієї процедури (теж своєрідний квест, адже це англомовний ресурс і там все англійською) на головній сторінці сайту натискаєте зверху першу кнопку Create. Чекаєте завантаження конструктору.

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

Справа від нього панель Customize Your Character з трьома кнопками. Тут ви вибираєте зовнішність свого аватара, його одяг, аксесуари. Підказка: Не забудьте, що там є такі маленькі круглі кнопочки зі стрілочками, які дозволяють гортати меню при виборі, наприклад, зовнішності вліво-вправо.

 Також майте на увазі, що образи на яких в куточках висить капелюх з кісточкою - то для платних аккаунтів. Як все зробите в цьому блоку - натискайте Done.

Нижче знаходиться панель з чотирма кнопками. Give it a Voice. Нас буде цікавити лише друга кнопка, з клавішею Т. Натискаєте її і вводите текст (Type your text), який хочете, щоб казав ваш аватар, та підбираєте голос з меню, що випадає (Voice). Прослухати те, що ви набрали, можна натиснувши стрілочку "Грати", або в цій панелі, або на самому плеєрі з обличчям, що зліва.

Який має бути ваш текст? Ну, головне, він звичайно має бути англійською. Відрекомендуйтеся, або повідомте, про що ваш блог, або скажіть, що сподіваєтеся знайти нових друзів і т.д. Підказка: текст завжди можна буде змінити, якщо ви захочете відредагувати свій Voki-плеєр.

Ще нижче - блок з двома кнопками. Тут ви обираєте фон, що буде позаду аватару (до речі, там є можливість поставити і щось з ваших картинок) та колір самого плеєру.

Зліва внизу, під зразком плеєра є ще додаткова панель, де ви можете підкорегувати колір та форму обличчя, очей, і т.д.

Як все буде готово - натискайте Publish справа, внизу. Перед вами з"явиться довгий код справа, та можливість вибрати розміри плеєра. Який розмір поставити? Це залежить від ширини вашої бокової колонки. Якщо вона більше ніж 200 пікселей - можна вибирати другу опцію. Якщо менше - саму маленьку (ширина 100 пікселей).

Після цього копіюйте весь-весь код. У випадку нашого плеєру з Джулією він виглядає ось так:

<img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://c.gigcount.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEzNTE3OTA1MTExNDMmcHQ9MTM1MTc5MDUxNTU*MyZwPTk3NTA3MiZkPTAwMCUyMC*lMjBWb2tpJTIwV2lkZ2V*Jmc9/MSZvPTE1YmQ2MzZjYjhlYjQxZTFhNmNmOWY2MzIzZjA4Mzg1Jm9mPTA=.gif" /><object height="267" width="200" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" id="widget_name"><param name="movie" value="http://vhss-d.oddcast.com/vhss_editors/voki_player.swf?doc=http://vhss-d.oddcast.com/php/vhss_editors/getvoki/chsm=739e30d7327da135377f4560a8a0695b%26sc=6968413" /><param name="quality" value="high" /><param name="allowScriptAccess" value="always" /><param name="width" value="200" /><param name="height" value="267" /><param name="allowNetworking" value="all"/><param name="wmode" value="transparent" /><param name="allowFullScreen" value="true" /><embed height="267" width="200" src="http://vhss-d.oddcast.com/vhss_editors/voki_player.swf?doc=http%3A%2F%2Fvhss-d.oddcast.com%2Fphp%2Fvhss_editors%2Fgetvoki%2Fchsm=739e30d7327da135377f4560a8a0695b%26sc=6968413" quality="high" allowScriptAccess="always" allowNetworking="all" wmode="transparent" allowFullScreen="true" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" name="widget_name"></object>

Ну і тепер саме цікаве - як і куди вставити цей код. Пригадаймо 11-й урок про бокову колонку. Знайдіть в переліку гаджетів - HTML/JavaScript (на малюнку, що нижче він у самому низу).

Натискаєте + та у віконечко, що з"явиться, вставляєте весь код вашого плеєру. Зберігаєте. Має все вийти! :)