Кнопки "Мне нравится"

Discussion in 'SЕО - тонкости, методы раскрутки' started by mff, 20 Dec 2010.

  1. mff

    mff Elder - Старейшина

    Joined:
    12 Mar 2008
    Messages:
    2,074
    Likes Received:
    701
    Reputations:
    227
    В общем крутил сегодня на сайте 5 кнопок, решил написать статейку. Может кому пригодится.

    • facebook.com

      [​IMG]

      http://developers.facebook.com/docs/reference/plugins/like

      Тут всё просто, заполняем форму и получаем вот такой код:
      HTML:
      <script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like layout="button_count" show_faces="true" width="450" font="arial"></fb:like>
    • vkontakte.ru

      [​IMG]

      http://vkontakte.ru/developers.php?o=-1&p=Like

      Тоже не сложно, нужно авторизоваться, указать в форме "Название сайта" и "Адрес сайта", далее выбрать "Варианты кнопки".
      На выходе 2 куска кода:
      Это вставляется между тегами <head></head>:
      HTML:
      <script type="text/javascript" src="http://userapi.com/js/api/openapi.js?20"></script>
      
      <script type="text/javascript">
        VK.init({apiId: XXXXXXX, onlyWidgets: true});
      </script>
      и этот код в теле документа, на месте вывода кнопки:
      HTML:
      <div id="vk_like"></div>
      <script type="text/javascript">
      VK.Widgets.Like("vk_like", {type: "mini"});
      </script>
    • twitter.com

      [​IMG]

      http://twitter.com/goodies/tweetbutton

      Тут выбираем из 3-х вариантов кнопки подходящую: "Vertical count", "Horizontal count" или "No count".
      Получаем вот такой кусок кода:
      HTML:
      <a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
    • odnoklassniki.ru

      [​IMG]

      http://dev.odnoklassniki.ru/wiki/display/plugins/Social+Plugins

      Тут всё не очень хорошо. Нужно вставить между тегами <head></head> код подгрузки стиля и яваскрипта:
      HTML:
      <link href="http://stg.odnoklassniki.ru/share/odkl_share.css" rel="stylesheet">
      <script src="http://stg.odnoklassniki.ru/share/odkl_share.js" type="text/javascript" ></script>
      
      далее код ссылки с фоном там, где вам нужно:
      HTML:
      <a class="odkl-klass-stat" href="Абсолютный адрес страницы" onclick="ODKL.Share(this);return false;" ><span>0</span></a>
      Высота кнопки отличается от кнопок Твиттера и Фэйсбука, что так же не очень хорошо. Вместо "Абсолютный адрес страницы" я так понял нужно прописывать переменную адреса текущей странички вашего движка или я не знаю. В общем у меня не работает она. Они пишут:
      но что то у меня ничего не заменяет...
    • mail.ru

      [​IMG]

      http://api.mail.ru/sites/plugins/share/

      Хорошо поработали. Делаем нужные изменения в форме, URL отсавляем пустым (кроме отдельных случаев) и получаем код для вставки в нужное нам место:
      HTML:
      <a target="_blank" class="mrc__plugin_like_button" href="http://connect.mail.ru/share" rel="{'type' : 'button', 'width' : '550', 'show_text' : 'true', 'show_faces' : 'true'}">Нравится</a>
      <script src="http://cdn.connect.mail.ru/js/loader.js" type="text/javascript" charset="UTF-8"></script>



    Чтобы выстроить кнопки горизонтально можно воспользоваться слоями:
    HTML:
    <div style="float:left; margin-bottom:4px;"></div>
    <div style="float:left; margin-bottom:4px;">код кнопки</div>
    <div style="float:left; margin-bottom:4px;">код кнопки</div>
    <div style="float:left; margin-bottom:4px;">код кнопки</div>
    <div style="float:left; margin-bottom:4px;">код кнопки</div>
    <div style="clear:both;"></div>
    Всем удачи.
     
    #1 mff, 20 Dec 2010
    Last edited: 20 Dec 2010
    11 people like this.
  2. Bmite

    Bmite Робот-Казанова

    Joined:
    27 Feb 2007
    Messages:
    336
    Likes Received:
    81
    Reputations:
    0
    спасибо,как раз искал недавно=) щас на сайты поставлю.
     
    1 person likes this.
  3. mff

    mff Elder - Старейшина

    Joined:
    12 Mar 2008
    Messages:
    2,074
    Likes Received:
    701
    Reputations:
    227
    Bmite не за что. Там обратите внимание на одноклассники: нужно url текущей странички прописывать, что ле :( Всё у них ни как у людей.
     
  4. mff

    mff Elder - Старейшина

    Joined:
    12 Mar 2008
    Messages:
    2,074
    Likes Received:
    701
    Reputations:
    227
    Поправил первый пост.
     
  5. Bmite

    Bmite Робот-Казанова

    Joined:
    27 Feb 2007
    Messages:
    336
    Likes Received:
    81
    Reputations:
    0
    apiId: XXXXXXX в кнопке ВК что за параметр?в смысле где его взять.
     
    1 person likes this.
  6. mff

    mff Elder - Старейшина

    Joined:
    12 Mar 2008
    Messages:
    2,074
    Likes Received:
    701
    Reputations:
    227
    Bmite когда вы авторизованы укажите адрес и название сайта и жмите кнопку "Сохранить". apiId сам пропишется.
     
  7. mff

    mff Elder - Старейшина

    Joined:
    12 Mar 2008
    Messages:
    2,074
    Likes Received:
    701
    Reputations:
    227
    Разобрался с одноклашками, там для того, чтобы счетчик работал еще и в <body> нужно гавнецо прописывать :eek:
    HTML:
    <body onload="ODKL.init();">
    Поэтому я отказываюсь от счетчика и оставлю просто кнопку.
    В <head></head> то же код:
    HTML:
    <link href="http://stg.odnoklassniki.ru/share/odkl_share.css" rel="stylesheet">
    <script src="http://stg.odnoklassniki.ru/share/odkl_share.js" type="text/javascript" ></script>
    В теле документа:
    HTML:
    <a class="odkl-klass" href="АБСОЛЮТНЫЙ адрес страницы" onclick="ODKL.Share(this);return false;">Нравится</a>
    Вид кнопки можно изменить вот так, после подгрузки стиля odkl_share.css в <head></head> прописать:
    HTML:
    <style type="text/css">
    .odkl-klass {background: url(http://site.ru/img/odkl.gif) no-repeat;}
    .odkl-klass:hover {background: url(http://site.ru/img/odkl2.gif) no-repeat;}
    </style>
    Вот и 2 кнопочки сделал, прикрепляю:

    [​IMG] [​IMG]
     
    2 people like this.
  8. ifree

    ifree New Member

    Joined:
    14 Jul 2010
    Messages:
    4
    Likes Received:
    0
    Reputations:
    0
    очень хорошо, сделаю себе на сайт... надеюсь кто-нибудь жимкнет хотя бы одну)))
    да и спасибо, что всё в кучку собрали... ;)
     
  9. Law

    Law Member

    Joined:
    10 Oct 2010
    Messages:
    211
    Likes Received:
    44
    Reputations:
    6
    очень хорошо сделал.
    может когда понадобится)
     
  10. zlo12

    zlo12 Elder - Старейшина

    Joined:
    28 Dec 2007
    Messages:
    535
    Likes Received:
    135
    Reputations:
    34
    извиняюсь за тупой вопрос, но зачем они нужны? >_<
     
  11. Топе

    Топе Banned

    Joined:
    2 Oct 2010
    Messages:
    70
    Likes Received:
    9
    Reputations:
    2
    Cпасибо. Поставил себе)
     
  12. mff

    mff Elder - Старейшина

    Joined:
    12 Mar 2008
    Messages:
    2,074
    Likes Received:
    701
    Reputations:
    227
    zlo12 для посещаемости.
    Топе не за что. Удачного использования.
     
  13. mff

    mff Elder - Старейшина

    Joined:
    12 Mar 2008
    Messages:
    2,074
    Likes Received:
    701
    Reputations:
    227
    Не работает кнопка "Мне нравится" вКонтакте назеркалах сайта

    Сегодня заметил, что на зеркале сайт.рф кнопка вКонтакте не работает. Указать в настройках виджета зеркало нельзя.
    Сделал следующим образом: добавил в настройках виджета еще один домен и поставил временно затычку:
    Code:
    <?php
    if($_SERVER["SERVER_NAME"]=="site.ru"){
    echo'<script type="text/javascript">
      VK.init({apiId: xxxxxxx1, onlyWidgets: true});
    </script>';
    }
    if($_SERVER["SERVER_NAME"]=="xn--xxxxxxx.xn--p1ai"){
    echo'<script type="text/javascript">
      VK.init({apiId: xxxxxxx2, onlyWidgets: true});
    </script>';
    }
    ?>
    Цифры на разных доменах будут разные, но за то не будет ошибки.
     
  14. Brosco

    Brosco New Member

    Joined:
    23 Sep 2010
    Messages:
    26
    Likes Received:
    3
    Reputations:
    1
    Автор спасибо за инфу!
     
  15. AlexV

    AlexV Elder - Старейшина

    Joined:
    29 Feb 2008
    Messages:
    173
    Likes Received:
    550
    Reputations:
    81
    Благодарю за своеобразный мануал, пригодилось.
     
    1 person likes this.
  16. ImLucky

    ImLucky New Member

    Joined:
    26 Sep 2010
    Messages:
    72
    Likes Received:
    3
    Reputations:
    0
    Не пойму, а чем яндекс в этом плане не угодил, если уже всё готово ?
    _http://api.yandex.ru/share/
     
  17. Engineer

    Engineer Member

    Joined:
    22 May 2009
    Messages:
    70
    Likes Received:
    5
    Reputations:
    0
    А еще есть сервис addthis.com но share.yandex.ru для провославных проектов больше подходит. А вообще тысячи их... Обращайте внимание на объем яваскрипта который подгружаете к себе на страницы.
     
  18. Zigert

    Zigert Member

    Joined:
    24 Jun 2009
    Messages:
    50
    Likes Received:
    8
    Reputations:
    0
    спасибо Тс поставил пару кнопок
     
  19. eXtreX

    eXtreX Member

    Joined:
    27 Aug 2009
    Messages:
    64
    Likes Received:
    5
    Reputations:
    0
    ТС большое спасибо)Пригодилось
     
  20. rossoo

    rossoo наркоша

    Joined:
    14 Feb 2010
    Messages:
    142
    Likes Received:
    50
    Reputations:
    13
    Сенкс пригодится