воскресенье, 16 марта 2014 г.

Как вставить виджет Инстаграм в блог (мини мк)

Недавно "копалась" в блоггера и интернете, чтобы вставить виджет инстаграма на боковую панель блога. Я полный чайник в этих вопросах, но все-таки мне удалось это сделать, решила, что кому-то может пригодится эта информация))
Итак, если вы хотите поставить виджет инстаграм у себя в блоге, то вам нужно воспользоваться сервисом сайта http://snapwidget.com что очень удобно - там не нужно регистрироваться и не нужно ничего платить.
Переходите по ссылке и чуть спустившись вниз, увидите вот токую табличку:


1. В первой строчке пишите свой логин в инстаграм, например у меня это yuliyasechkina
Или ниже можно указать хештег, но я заполнила первую. 
2.The type of widget to display your photos in - Тип виджета для отображения фотографий
Можно выбрать, как будут размещаться ваши фотографии , я оставила тот, что предлагают первым: grid - сетка, решетка
3.The size of each of the photos in the widget - Размер каждой фотографии в виджете. 
Размер можно увеличить или уменьшить, зависит это от ширины вашей панели в блоггере. Мне пришлось уменьшить до 75, чтобы виджет не вылезал за пределы ширины моего блога.
4. The number of photos across and down. Max 60. - Количество фотографий по горизонтали и вертикали. Max 60. Я установила 3 на 3 фотографии, но можно уменьшить или увеличить число фотографий.
5. Should a border be displayed around each photo -  граница будет отображаться вокруг каждого фото. 
Можно выбрать обрамлять каждую фотографию рамкой или нет.
6. Background of the widget. Leave empty for transparent. - Фон виджета. Оставьте пустым для прозрачной.
Я оставила прозрачным, но вы можете выбрать любой цвет.
7. Amount of space between each phot - Промежуток между каждой фотографией. Я уменьшилась до 3-х. 
8. Effect applied when a visitor hovers their mouse over a photo in the widget - Эффект применяется, когда посетитель наводит мышь на фото в виджете (фото тускнеет или становится ярче) я не стала ставить. 
9. Adds sharing buttons to each photo in the widget for easy sharing - Добавляет кнопки общего доступа для каждого фото в виджете для легкого обмена. Это кнопки соц.сетей

Дальше нажимаем зеленую кнопочку
Get Widget
появляется код:



копируем его и идем в раздел Дизайн в блоггере



Справа нажимаем Добавить гаджет и из списка и выбираем добавление кода HTML 



Пишем (можно и не писать) название гаджета, потом вставляем в содержание наш скопированный код и нажимает сохранить.
      Кстати, если вдруг гаджет все-таки окажется шире вашей панели в блоге, то его легко уменьшить в самом коде, изменив последние цифры, видите в коде 390px -вот меняя эти цифры, вы сможете  уменьшить или увеличить размер гаджета.


Сохраняет наши изменения и любуемся результатом))




41 комментарий:

  1. Спасибо за подробную инструкцию!!! Интересно было бы почитать как добавлять другие инструменты))

    ОтветитьУдалить
  2. огромное спасибо! просто и красиво!

    ОтветитьУдалить
    Ответы
    1. Спасибо! Рада, что понравилось! Я старалась :)

      Удалить
  3. Очень полезная информация, и просто все. Мне помогло, спасибо!

    ОтветитьУдалить
  4. Спасибо,всё настроила без проблем

    ОтветитьУдалить
  5. ОГРОМНОЕ вам спасибо за информацию!! Я уже почти год бьюсь с этим блогпостом, первый раз в жизни всё с первого раза получилось!)) Спасибо большое!!!!!))))

    ОтветитьУдалить
  6. Спасибо ОГРОМНОЕ! А то я уже голову сломала, как прицепить к блогу ссылочку на инстаграм))

    ОтветитьУдалить
  7. Юля, спасибо! По твоему МК установила и у себя виджет )

    ОтветитьУдалить
  8. СПАСИБО ВСЕМ за комментарии - очень радостно, что кому-то пригодилась эта информация! Значит не зря было потрачено время :) на написание поста!

    ОтветитьУдалить
  9. Большое спасибо! Очень пригодилась информация, уже добавила у себя в блоге)

    ОтветитьУдалить
  10. Спасибо огромное! очень пригодилось для моего свежего блога)))

    ОтветитьУдалить
  11. Спасибо за МК - оказалось полезно)

    ОтветитьУдалить
  12. спасибо большое, это очень вовремя! -)))

    ОтветитьУдалить
  13. Огромное спасибо)
    http://elpise.blogspot.com/

    ОтветитьУдалить
  14. Спасибо большущее! Это самый доходчивый и простой способ, который я смогла найти! Все получилось, еще раз, благодарю!

    ОтветитьУдалить
  15. Теперь этот виджет почему то ведет на сайт снап виджет и андройд жалуется на вредоносный контент

    ОтветитьУдалить
    Ответы
    1. Похожий сервис - ejfe.ru/widget . Точно так же, добавь ссылку на профиль и вставь код. Еще и твиттер с vk поддерживает. Еще и на русском, и дизайн поинтересней.

      Удалить
  16. спасибо, очень полезный пост)

    ОтветитьУдалить
  17. Спасибо, Вам за проделанную работу!

    ОтветитьУдалить
  18. Спасибо за фотографии к инструкции! Очень помогли)

    ОтветитьУдалить
  19. Спасибо большое! все получилось!

    ОтветитьУдалить
  20. Спасибо Вам большое, очень полезная статься!!! :))))

    ОтветитьУдалить
  21. Огромное спасибо! Очень подробно и легко!))) Сделала за 2 минуты!))

    ОтветитьУдалить
  22. Юля, спасибо за полезный пост!) Все получилось :)

    ОтветитьУдалить
  23. Спасибо большое))) вы большая молодец, поделились самым важным для новорожденного блога)))

    ОтветитьУдалить
  24. Спасибо большое! понятно, доступно)))

    ОтветитьУдалить
  25. Огромное спасибище!!! Тепла и добра в вашу карму����

    ОтветитьУдалить
  26. Огромное спасибо!!! Все очень понятно и просто, вот бы и про все остальное так же! :) Хоть с этим справилась :) а то столько времени уже потратила, а с места не сдвинулась.

    ОтветитьУдалить
  27. Вот спасибо! Заняло 5 минут вместе с чтением)))))

    ОтветитьУдалить
  28. Спасибо большое! Очень полезная статья!

    ОтветитьУдалить

Большое спасибо за Ваши комментарии!
Всегда с радостью читаю их!
Ваши отзывы вдохновляют меня на новые свершения!