Без заголовка

Дневник

Пятница, 03 Января 2014 г. 13:02 + в цитатник

Здравствуйте! С новым Годом! Я вам в комменте сейчас выложу урок по яндексу - там есть подробное описание как убрать эту стрелочку.

Всем привет!
Сегодня мы с вами будем загружать на яндекс фотки анимационную картинку и переносить ее к себе в блог при помощи HTML кодов. Урок будет длинный, но надеюсь что понятный.
Итак начнем!
У нас есть вот такая анимашка

На ее примере и рассмотрим наш урок!
Урок написан для mail.ru.

Для начала нужно зарегистрироваться на яндексе. Это не сложно, потому не буду на этом останавливаться.
Аналогично такую же картинку можно загрузить и в группу (сообщество).

1. Идем на яндекс фотки по сылке СЮДА .
Нажимаем "загрузить фотки"

2. Открывается вот такое окно

3. Теперь настраиваем видимость нашего фото как на скрине

4. получаем вот такое окно

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

Нажимаем на выделенную мной область (см.скрин выше) и получаем вот такое окно

В нем нажимаем "создать альбом" и получаем следущее :

Вводим название альбома и нажимаем "создать"

6. Теперь приступим к загрузке фото. Нажимаем "добавьте фотографии" как на скрине

У вас откроется диалоговое окно с вашим компьютером. В нем выбираете нужное вам фото, у меня это гиф картинка (наша анимашка). Вот так это выглядит у меня :

Выделив нашу анимашку, нажимаем "открыть". Диалоговое окно закрылось и мы получили вот такую картинку :

Нажимаем "загрузить фото" и получаем это:

После того, как загрузка завершилась, у вас откроется вот такое окно как на скрине ниже. В нем нажмите "перейдите к просмотру своих альбомов"

И получаем это :

На скрине я выделила свою картинку, вы же увидите свою.
Рядос с картинкой находится глазок, это значит, что я закрыла ее ото всех. И вижу ее на яндексе только я.

7. А теперь разъяснения по кодам.

Будьте внимательны!!!

Нажимаем мышкой по нашей картинке и получаем вот это :

8. Нажимаем "в другом размере"

и видим вот это

Красным я выделила свой размер картинки, вы можете взять любой.
В дальнейшем нам это пригодится.
9. Далее, выбрав нужный нам размер жмем "код для вставки на сайт или блог"

Под нашей картинкой откроется вот такой код

Для наглядности я его выделила красным прямоугольником.
Выделенные внутри значения :
1. ширина 600 пикселей,
2. высота 400 пикселей.

10. Открываем свой блог. Нажимаем "добавить запись". Переходим на вкладку с яндекс фотками и копируем самый первый код. Вот этот :

Бережно переносим его в блог на майл (вкладка с редактором у нас уже открыта) и вставляем его в редактор записи, получаем вот это :

Нажимаем "предпросмотр".
И получаем вот такую картинку :

Что же мы видим ?

Что плавность анимации отсутствует, появилась кликабельность картинки, ненужные слова "посмотреть на яндекс фотках". И еще появилась некрасивая белая стрелочка в левом нижнем углу нашей картинки (она появляется только на анимациях).

Вот все это мы сейчас и будем исправлять. Здесь все дело в кодах.

Первое.

Убираем кликабельность. Для этого возвращаемся назад в редактор и аккуратно стираем ссылку, которую я выделила синим. Только стираем так, что бы остались кавычки.

и получим вот такой код :

Второе.

Точно так же убираем фразу "посмотреть на яндекс фотках". И получаем вот такой код :

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

Осталось убрать стрелку.

Третье.

Возвращаемся в редактор. Преходим на вкладку с яндекс фотками и под нашей картинкой нажимаем "в другом размере". В открывшемся окне нажимаем "оригинал", вот как тут :

И наша картинка открылась в новой вкладке. Теперь нам нужно из адресной строки браузера скопировать адрес картинки. На скрине я показала где его искать.

Теперь этот адрес бережно несем на вкладку с открытым редактором своего блога. И делаем следующее. Внимательно смотрим код в нашем редакторе и находим вот эту ссылку, она у меня на скрине выделена синим. Аккуратно удаляем ее между кавычками. Вот как тут :

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

Нажимаем "предпросмотр". И вуаля! Наша картинка избавилась от стрелочки и появилась плавная анимация

Уряяяя!!! У нас все получилось! Надеюсь все всем понятно! Будут вопросы - задавайте. С удовольствием отвечу на все!

С любовью, ваша Анта!

Серия сообщений "HTML":
Часть 1 - Оформление постов. Теги. Ответы на вопросы.
Часть 2 - Таблица HTML кодов
Часть 3 - Как скопировать текст с сайта, который защищен от копирования.
Часть 4 - Без заголовка
Часть 5 - Текст с прокруткой
Часть 6 - Как создать кликабельную картинку или кнопку-переход в редакторе

Рубрики:

Все для оформления дневника
ПОМОЩЬ БЛОГГЕРУ

Метки: яндекс фото

LiveInternetLiveInternet

-Музыка

-Рубрики

-Всегда под рукой

-Поиск по дневнику

-Подписка по e-mail

-Статистика

Он-лайн графические редакторы

Для тех, кто не умеет пользоваться фотошопом