Перейти к публикации
silence1988

Подгрузка социальных кнопок

Рекомендованные сообщения

silence1988
Не знаю как кого, но лично меня уже давно раздражала тормозная загрузка социальных кнопок. Все сервисы пробовал и все не то. И как то на одном сайте увидел интересное решение, вместо кнопок грузится картинка и при нажатии на нее подгружаются кнопки причем там куча кнопок ) Без этого бы страница грузилась дольше. А так моментально. И решил реализовать у себя так же. Сейчас делаю сайтик один для себя, немного учусь в php итп. Ниже распишу как реализовать у себя так же. 
 
Мне понравились вот эти кнопочки: http://share.pluso.ru
 
После того, как настроили кнопки по своему вкусу, создаем в корне сайта файл socialbuttons.php
 
В нем вставляем полученный код с сервиса кнопок, в том виде в каком получили. 
 
Пример стандартный код:
 
<script type="text/javascript">(function() {
          if (window.pluso)if (typeof window.pluso.start == "function") return;
          var d = document, s = d.createElement('script'), g = 'getElementsByTagName';
          s.type = 'text/javascript'; s.charset='UTF-8'; s.async = true;
          s.src = ('https:' == window.location.protocol ? 'https' : 'http')  + '://share.pluso.ru/pluso-like.js';
          var h=d[g]('head')[0] || d[g]('body')[0];
          h.appendChild(s&
#41;;
          })();
0;/script>
        <div class="pluso" data-options="big,square,line,horizontal,counter,theme=04" data-services="vkontakte,odnoklassniki,facebook,twitter,google,moimir,email,
print" data-background="#ebebeb"></div>
 
Далее открываем файл своего шаблона: ваш файл где прописаны все скрипты (не знаю как в DLE и других кроме вордпресса и phpBB) и вставляете перед </head> код:
 
<script type="text/javascript">
function myfunct() {
$("#block").load("socialbuttons.php", function() {
$("#leftFit").hide()
});
}; 
</script>      
 
И в то место, где вы хотите видеть кнопки, вставляете следующий код:
 
<a id="leftFit" onclick="myfunct();">Показать кнопки / Так же можно картинку свою вставить</a>
<div id="block"></div>
 
Вроде ничего не упустил. Может есть и грамотнее решение какое, но лично у себя я разницу ощутил.
 
Посмотреть типа демки, можно на моем сайте: http://silllence.com
 
kd3YJzU.png
 
Сильно не пинать, все это сделано при помощи гугла )))

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах
TheAndrey
<script type="text/javascript">
function myfunct() {
$("#block").load("socialbuttons.php", function() {
$("#leftFit").hide()
});
}; 
</script>

Функция надо давать уникальные имена. А вообще лучше сделать так:

 

<script>
$(function(){
    $("#leftFit").click(function(){
        $.get("/socialbuttons.php", {}, function(response){
            $("#block").html(response);
            $("#leftFit").hide();
        });
    });
});
</script>

Атрибут onclick у ссылки убрать надо тогда.

Поделиться сообщением


Ссылка на сообщение
Поделиться на других сайтах

Создайте аккаунт или войдите в него для комментирования

Вы должны быть пользователем, чтобы оставить комментарий

Создать аккаунт

Зарегистрируйтесь для получения аккаунта. Это просто!

Зарегистрировать аккаунт

Войти

Уже зарегистрированы? Войдите здесь.

Войти сейчас

×
×
  • Создать...