Как добавить анимашку в виджет сайта

  • 20
виджет сайта

Как добавить анимашку в виджет сайта

виджет сайтаПриветствую Вас, мои дорогие читатели!

Продолжим веселую тему.
Теперь нам нужно вставить нашу замечательную картинку в виджет сайта или блога.
Будьте только внимательны, сама операция занимает 5 % Вашего времени для выполнения поставленной задачи. 95% времени уйдет на предварительный выбор вариантов картинки.

Итак. Мы получили код для дальнейших действий.

<center><img src=»https://s17.rimg.info/1c061ab4389c67c9442416dbb80ed571.gif» ></center>

Теперь идем в наш конструктор InPages Cloud Service.

Заходим в раздел «Модули» и выбираем подраздел «текст и графика»

модуль текст и графика
Отлично, теперь этот модуль легко и непринужденно переставляем в нужное место.
Как вариант подходит боковая панель. Для боковой панели можно использовать значение модуля «для всех страниц».

для всех страниц

Я Вас поздравляю, мы почти у цели.

Теперь ( это боковая колонка в нашем случае) вставляем код изображения

код изображения

И в таком вот виде :

вид

И не забываем обновить код.
Все готово, вот этот герой анимации.

в таком виде

Сохраняем картинку, нажав в редакторе кнопку ОК.

Теперь для полного счастья выделяем анимашку.

выделяем картинку

И не забываем сохранить .Все, данную копию сайта сохранили и опубликовали

чудо

А при нажатии на подобное чудо просто выскакивает надпись и соответственно идет
переход на нужную Вам страницу. Отменно подходит для совсем интересных одностраничников.

На блоге ( инструмент InBlog) все проще. Это просто как вставить картинку.
В Виджет также ставится html- код. Еще проще.

Итак вариант установки на InBlog Подходит для любого шаблона.

Зашли в InBlog — далее панель управления — записи — создать новую

И берем наш код <center><img src=»https://s17.rimg.info/1c061ab4389c67c9442416dbb80ed571.gif» ></center>

Панель управления записи- создать новую. В виде HTML — текста

inblog

В визуальный редактор переходим.

визуальный редактор

И спокойно нажимаем на ссылку и вводим название нужной страницы и всплывающий текст.

ссылка

Идем обратно в HTML — текста и полностью копируем код.
Далее просто вставить в виджет. И все готово.

Это мы рассмотрели вариант с привлечением сторонней анимации.
Надо отметить, что в разделе «Библиотеки» в Альт Клубе есть подборка анимаций , уже готовых к употреблению. Тут просто. Просмотрели картинку, щелкнули правой мышкой
«сохранить изображение как» и готово.
Но варианты рассмотреть всегда полезно.
Прекрасно работает на вирусных открытках, просто на сайте лучше ставить в колонке.
Главное в таком деле- без фанатизма.

 Александр Зорин

 

Share

Об авторе

AltClub

AltClub - Всемирная социальная сеть компьютерной грамотности, это МИРОВАЯ Социальная сеть, которая предлагает Бесплатное обучение для всех пользователей сети интернет

20 комментариев

Арсений

22.04.2015 на 10:21 пп

Очень хорошо что в статье изложены два способа добавления анимации на свой сайт или открытки. Всё легко и просто. Спасибо.

Константин Кислов

19.03.2015 на 12:57 пп

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

    Арсений

    26.05.2015 на 4:17 пп

    Мультяшность у меня асоциируется с детством, а детство с домашним уютом. Мультяшность может заставить читателя почувствовать себя на сайте комфортнее.

Рашида

13.02.2015 на 10:33 пп

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

    Мария Левицкая

    31.07.2015 на 3:58 пп

    Рашида, какой из способов предложенных в статье Вы предпочитаете для вставки анимации, первый или второй?

Нина

26.01.2015 на 7:51 пп

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

    Рашида

    15.02.2015 на 4:03 пп

    Нина, если сразу не получилось — я вам просто советую — не откладывайте на потом. Лучше еще раз пройдитесь по шагам и сделайте как написано в статье — все получится!

      Мария Левицкая

      31.07.2015 на 4:00 пп

      Рашида, наверно Вы неправильно поняли Нину. Нина устала и со свежей головой желает доделать вставку анимации на свой сайт. У меня такое тоже случается.

    Мария Левицкая

    31.07.2015 на 3:59 пп

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

Татьяна Лабоцкая

21.01.2015 на 11:00 пп

Ничего не поняла из статьи

Вера Демагина

19.01.2015 на 10:12 дп

Доброго времени суток и с праздником Крещения Господня!!!
Прекрасная компания, чудесные преподаватели, отличные посты на блоге…
Информация очень нужная и интересная.
Я благодарна судьбе, что оказалась в нужное время и в нужном месте — в компании Alt-InWEB.
Спасибо.
С уважением, Вера Демагина.

Людмила Пархоменко

19.01.2015 на 3:02 дп

Александр, я с интересом прочитала статью, загорелась воплотить в жизнь, но к сожалению, я пропустила начало. Буду искать по блогу. Надеюсь на счастливую встречу.

    Рашида

    15.02.2015 на 4:05 пп

    Людмила, так в статье ссылка на предыдущую статью — в ней как раз и рассказывается где взять ссылку на анимашку — все очень просто, автор статьи так доступно все объяснил.

      Мария Левицкая

      31.07.2015 на 4:01 пп

      Рашида, я Вас поправлю. Ссылка на анимацию приведена в начале этой статьи и обраблена тегами красного цвета.

      Мария Левицкая

      31.07.2015 на 4:03 пп

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

Галина

18.01.2015 на 7:40 пп

Прекрасно! Мне очень нравится. Поистине возможности инструментов InWEB очень велики. Замечательно, что автор статьи делится своими «фишечками» со всеми. Будем применять.

    Рашида

    15.02.2015 на 4:06 пп

    Галина, тем более таким интересным способом добавить эмоции на блог с помощью анимашек, остается только применить.

      Мария Левицкая

      31.07.2015 на 4:10 пп

      Анимация помимо такой важной составляющей как эмоциональность придаёт к этому движение и живость на сайте.

Валентина

18.01.2015 на 7:08 пп

Интересная информация.Если в компьютере еще плохо разбираешься. то это очень полезно.Главное легко! Спасибо! Обязательно применю.

    Мария Левицкая

    31.07.2015 на 4:12 пп

    Валентина, желаю Вам быстрейшего освоения компьютера вместе с Альт-клубом. У Вас всё получится. Удачи Вам.

Добавить комментарий

Share
Share