среда, 24 июля 2013 г.

Как изменить внешний вид кнопки Pin It

Привет! Продолжу повествования про Pinterest.
В комментариях к предыдущему посту Катя задала резонный вопрос - "как вместо круглой кнопочки на фото, сделать прямоугольную, маленькую?"


Рассказываю!

Первый способ - простой
Та кнопочка, которую предлагает сам Pinterest.com. Именно про нее спрашивала Катя.
Чтобы поменять кнопку, нужно опять вернуться в то место, куда мы с вами вставляли кусок кода из предыдущего поста:


1. Открываем Шаблон -> Изменить HTML
2. С помощью Ctrl+F ищем var bs_pinButtonURL
3. Вместо "http://3.bp.blogspot.com/-y3xzTGiGzH0/UK4XOaUpdaI/AAAAAAAADw8/Z1MH4Jr4Efo/s1600/pinterestx1_72.png" вставляем "//assets.pinterest.com/images/pidgets/pin_it_button.png"

Вуа ля и у вас уже новая кнопочка!

Второй способ - продвинутый с секретом

Для того, чтобы установить персональную кнопку придется немного пошаманить! Т.к. у платформы Blogger нет возможности загружать файлы на файловую систему, в отличии от сайтов с персональным хостингом, то приходится искать обходные пути.
Какая у нас задача? Нам нужно куда-то загрузить картинку, чтобы потом можно было вставить путь к ней в шаблон нашего блога.

Я для себя открыла вариант с созданием Черновика сообщения, в котором у меня хранятся картинки для разных кнопок.

Как это работает? 

1. Создаем Черновик сообщения и в него добавляем нужную картинку. 


2. Переходим в режим HTML все в том же сообщении и копируем путь к картинке.



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

В Интернете есть множество бесплатных кнопок Pin It. Идем по сслыкам и скачиваем архивы с картинками. Сразу скажу - все архивы проверила на вирусы - все чисто. Сайты все англоязычные - не пугаемся!
Архивы распаковываем и ищем понравившуюся картинку.


Кнопочки от Pixtea


13 комментариев:

  1. Спасибо Машенька, как раз то что мне надо. :)


    Заходите ко мне в гости! Буду очень рада дружбе!
    http://takashandmade.blogspot.com/

    ОтветитьУдалить
  2. И еще раз огромное спасибо! Все получилось. Мне очень нравится!

    ОтветитьУдалить
  3. Не получилось у меня применить второй способ. Совсем исчезла кнопочка.

    ОтветитьУдалить
  4. И ссылочка с красивыми кнопочками не работает почему-то.

    ОтветитьУдалить
    Ответы
    1. Не отчаивайтесь и пробуйте еще раз. У меня сейчас работает именно по технологии из второго способа. А ссылка красивыми кнопками - это сторонний ресурс, наверное его больше нет. Ссылку на него сейчас уберу, спасибо.
      Кнопочки можно поискать в гугле по фразе Pinterest buttons.
      Удачи!

      Удалить
  5. А у меня проблема даже с обычной кнопкой, не знаю что делать, уже переустанавливала ее, чистила кеш, что еще может мешать, может вы знаете? Браузер хром, кнопочки на фото вообще не работают, а если нажимаю кнопку вверху, то открывается просто пустое окно(((

    ОтветитьУдалить
  6. Спасибо большое. благодаря вашим урокам установила и себе кнопочки :). спасибо!

    ОтветитьУдалить
  7. спасибо, очень помогла статья!^^

    ОтветитьУдалить
  8. Маша, спасибо! ) Теперь и у меня такие кнопочки )
    еще не определилась какую именно хочу, попользуюсь, повыбираю... Но инфа полезная, еще раз спасибо!
    Удачи :)

    ОтветитьУдалить
  9. добрый вечер! устанавливала по вашему методу кнопочки, сначала работали, а на этой неделе пропали. у вас тоже на изображениях не появляются... вы убрали их или они сами по себе? не знаете как исправить?

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

Related Posts Plugin for WordPress, Blogger...