Мы создаем сайт для клиента на работе, который можно найти здесь: http://ethercreative.net/studio_social/ Это очень простая тема для WordPress, но осложнения возникают из-за конфликтов между бесконечным плагином прокрутки и социальным иконки.
Каждый пост предназначен для отображения блока в конце с помощью социальных иконок G +, FB и Twitter. Он предназначен для отображения ~ 4 сообщений или около того при запуске, а затем при прокрутке он предназначен для загрузки следующего набора.
Каждая из этих вещей работает, но не вместе.
Когда бесконечная прокрутка загружает следующий блок сообщений, она показывает только кнопку в facebook, а также две другие социальные иконки.
Странная вещь, однако, она оставляет блоки кода:
<span class="icons"> <g:plusone size="medium" href="http://ethercreative.net/studio_social/?p=1"></g:plusone> <iframe src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fethercreative.net%2Fstudio_social%2F%3Fp%3D1&locale=&layout=button_count&action=like&width=92&height=20&colorscheme=light" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:92px; height:20px;" allowtransparency="true"></iframe> <a href="http://twitter.com/share" class="twitter-share-button" data-url="http://ethercreative.net/studio_social/?p=1" data-count="horizontal" data-text="Hello world!" data-via="twitter_username"></a></span> </div>
Я знаю, в чем проблема и почему это происходит, но я действительно не очень хорошо разбираюсь в javascript и не знаю, какие вызовы использовать для ее исправления.
Я использую WordPress 3.3.1 с бесконечным плагином прокрутки (http://wordpress.org/extend/plugins/infinite-scroll/) и digg digg для социальных значков (http://wordpress.org/extend/plugins / Digg-Digg /)
У бесконечного плагина прокрутки есть возможность добавлять события onLoad для запуска после того, как он захватил новый набор сообщений. Итак, что я должен добавить здесь?
Спасибо за любую помощь! Хорошего дня.
Обновление: после нескольких исследований я также установил твиттер. Теперь остается только исправлять Google Plus. Код для твиттера:
!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
Обновление еще раз: также нашел код Google Plus:
(function () {var po = document.createElement ('script'); po.type = 'text / javascript'; po.async = true; po.src = 'https://apis.google.com/js/ plusone.js '; var s = document.getElementsByTagName (' script ') [0]; s.parentNode.insertBefore (po, s);}) ();
Что я узнал? Сделайте больше googling, прежде чем спрашивать о переполнении стека. По крайней мере, это ответ для людей с этой проблемой в будущем.
Решение, которое вы в основном представляете, это перезагрузка скриптов, что довольно неэффективно, поскольку вы, вероятно, загрузили их на загрузку страницы для первого набора социальных кнопок. Все 3 службы имеют возможность проанализировать часть документа или всего документа для отображения любых новых социальных виджетов. Код, который вы хотите, будет примерно таким:
var el = document.body; //Google Plus if (typeof gapi !== "undefined") { gapi.plusone.go(el); } //Facebook if (typeof FB !== "undefined") { FB.XFBML.parse(el); } //Twitter if (typeof twttr !== "undefined") { twttr.widgets.load(); }
В приведенных выше случаях el должен быть контейнером, который содержит виджеты, или может быть просто document.body (будет повторно отображать все виджеты.) Не уверен, что вы можете сузить контекст с помощью Twitter в настоящее время, но я считаю, что они планируют добавить что.
Как и LocalPCGuy, вы делаете гораздо больше работы, чем необходимо для достижения этой цели. В идеале у вас будет часть асинхронного обратного вызова загрузки, чтобы вставлять эти кнопки только в те элементы, которые их требуют. Или, что еще лучше, добавьте их на стороне сервера (если это возможно), чтобы клиент не работал, чтобы сделать страницу готовой. По крайней мере, с вашим решением файлы сценариев будут кэшироваться, что должно улучшить время загрузки. Проблема в том, что вы все еще делаете страницу труднее, чем нужно. Как страница бесконечных свитков и становится все больше и больше, эта дополнительная работа будет более значимой.
Идеальный поток будет примерно таким:
Таким образом, вы выполняете наименее необходимую работу, чтобы получить необходимый эффект.
добавьте код в файлы JS …
addthis.toolbox('.addthis_toolbox'); addthis.counter('.addthis_counter');
Он работает отлично.