Форум

royksopp · #1 (**permalink**) 19.02.2013, 17:26

Посетила меня идея как загружать соц кнопки, в конце страницы, а выводить в начале. Вывел через div

<div id="socpack"></div>
<script type="text/javascript">
var theElement = document.getElementById("socpack"); 
theElement.innerHTML = "<table width="600px" border="0" cellspacing="0" cellpadding="0"><td><!-- Place this tag in your head or just before your close body tag --><script type="text/javascript" src="http://apis.google.com/js/plusone.js">
 {lang: 'ru'}</script><!-- Place this tag where you want the +1 button to render --><g:plusone></g:plusone></td><td><!-- Put this script tag to the <head> of your page --><script type="text/javascript" src="http://vkontakte.ru/js/api/share.js?10" charset="windows-1251"></script><!-- Put this script tag to the place, where the Share button will be --><script type="text/javascript"><!-- document.write(VK.Share.button(false,{type: "button", text: "Сохранить"})); --></script></td><td><script src="http://connect.facebook.net/ru_RU/all.js#xfbml=1"></script><fb:like href="" layout="button_count" show_faces="false" width="130" font="arial"></fb:like></td></tr></table>";</script>

И тут я понял, что ничего не выйдет

Как вывести такой код (вместе с javasript) на сайте? Может надо считать из txt файла его?

danik.js · #2 (**permalink**) 19.02.2013, 17:33

Сообщение от royksopp

Может надо считать из txt файла его?

Чего????
Положи теги там, где тебе нужны кнопки, а скрипты расположи внизу страницы.

рони · #3 (**permalink**) 19.02.2013, 17:34

royksopp, откройте для себя
экранирование-специальных-символов

рони · #4 (**permalink**) 19.02.2013, 17:37

royksopp,
width="600px" => width=\"600px\"
</script> => <\/script>

danik.js · #5 (**permalink**) 19.02.2013, 17:40

рони, тогда уж проще использовать просто другие ковычки '..width="600px"..'
Но еще проще - расположить теги там где нужно, а скрипты - внизу.

рони · #6 (**permalink**) 19.02.2013, 17:44

Сообщение от danik.js

тогда уж проще использовать просто другие ковычки

неспасает в данном случае,но для незнающих будет полезно.

danik.js · #7 (**permalink**) 19.02.2013, 18:37

Все эти танцы с кавычками не имеют смысла, ибо все просто как дважды два:

<div id="socpack">
<table width="600px" border="0">
    <td><g:plusone></g:plusone></td>
    <td><div id="vk-like"></div></td>
    <td><fb:like href="" layout="button_count" show_faces="false" width="130" font="arial"></fb:like></td>
</table>
</div>
<p>Скрипты идут ниже, однако кнопки появятся выше</p>

<script src="http://apis.google.com/js/plusone.js">{lang: 'ru'}</script>
<script src="http://vk.com/js/api/share.js?11" charset="windows-1251"></script>
<script>document.getElementById('vk-like').innerHTML = VK.Share.button(false,{type: "button", text: "Сохранить"});</script>
<script src="http://connect.facebook.net/ru_RU/all.js#xfbml=1"></script>

Можно еще для Google+ и Facebook прописать атрибуты async. Вконтакте вобще чудит с кодировкой

Deff · #8 (**permalink**) 19.02.2013, 19:14

<div id="socpack"></div>



<script type="text/javascript" src="http://apis.google.com/js/plusone.js"></script>
<script type="text/javascript" src="http://vkontakte.ru/js/api/share.js?10" charset="windows-1251"></script>
<script src="http://connect.facebook.net/ru_RU/all.js#xfbml=1"></script>
<script type="text/javascript">
document.getElementById("socpack").innerHTML= '<table width="600px" border="0" cellspacing="0" cellpadding="0"><tbody>\
<tr><td>\
<!-- Place this tag in your head or just before your close body tag -->\
<!-- Place this tag where you want the +1 button to render --><g:plusone></g:plusone>\
</td><td>\
<!-- Put this script tag to the <head> of your page -->\
<!-- Put this script tag to the place, where the Share button will be --><span id=VK></span>\
</td><td>\
<fb:like href="" layout="button_count" show_faces="false" width="130" font="arial"></fb:like>\
</td></tr></tbody></table>';
document.getElementById("VK").innerHTML= VK.Share.button(false,{type: "button", text: "Сохранить"});
</script>

danik.js · #9 (**permalink**) 19.02.2013, 19:31

Ну теперь я просто обязан запостить yet another вариацию использования скриптов

<div id="socpack"></div>
<p>Скрипты идут ниже, однако кнопки появятся выше</p>

<script src="http://apis.google.com/js/plusone.js">{lang: 'ru'}</script>
<script src="http://vk.com/js/api/share.js?11" charset="windows-1251"></script>
<script src="http://connect.facebook.net/ru_RU/all.js#xfbml=1"></script>
<script type="text/x-template" id="soctemplate">
    <table width="600px" border="0">
        <td><g:plusone></g:plusone></td>
        <td><div id="vk-like"></div></td>
        <td><fb:like href="" layout="button_count" show_faces="false" width="130" font="arial"></fb:like></td>
    </table>
</script>
<script>
    document.getElementById('socpack').innerHTML = document.getElementById('soctemplate').innerHTML;
    document.getElementById('vk-like').innerHTML = VK.Share.button(false,{type: "button", text: "Сохранить"});
</script>

Форум

Справочник

Discord чат

Курсы javascript