Я не знаю, как заставить код комментариев disqus работать внутри моих пользовательских элементов.
Структура моего сайта:
| index.html
--------\ my-app.html (пользовательский элемент)
----------------\ my-testView1.html (пользовательский элемент)
---- ------------\ my-testView2.html (пользовательский элемент)
Мне нужно поместить комментарии disqus внутри my-testView1.html и my-testView2.html
Структура index.html:
<body>
<my-app>
<div class="disqusClass1" id="disqus_thread"></div>
<div class="disqusClass2" id="disqus_thread"></div>
<my-app>
</body>
Структура my-app.html:
<iron-pages>
<my-testView1 name="testView"><content select=".disqusClass1"></content></my-testView1>
<my-testView2 name="testView2"><content select=".disqusClass2"></content></div></my-testView2>
</iron-pages>
Структура my-testView1.html:
<template>
<content select=".disqusClass1"></content>
</template>
Структура my-testView2.html:
<template>
<content select=".disqusClass2"></content>
</template>
Дискус див
Я поместил div комментариев disqus внутрь <my-app> на index.html, чтобы хром мог его найти. Он не сможет найти его, если я вставлю его внутрь <my-testView1> вот так:
страница my-app.html
<iron-pages>
<my-testView1 name="testView"><div id="disqus_thread"></div></my-testView1>
<my-testView2 name="testView2"><div id="disqus_thread"></div></my-testView2>
</iron-pages>
потому что my-app.html сам по себе является настраиваемым элементом, и он не позволит хрому его найти. Поэтому мне пришлось поместить его за пределы теневого дома (страница index.html)
Код Javascript на страницах my-testView1.html и my-testView2.html выглядит так:
<dom-module id="my-testView1">
<template>
...
<content></content>
...
</template>
<script>
Polymer({
is: 'my-testView1',
ready: function ()
{
// DEFAULT DISQUS CODE (I changed real URLs though):
var disqus_config = function () {
this.page.url = 'https://www.example.com/testView1'; // Replace PAGE_URL with your page's canonical URL variable
this.page.identifier = '/testView1';
// this.page.title = 'Test View';
};
(function() {
var d = document, s = d.createElement('script');
s.src = '//myChannelName.disqus.com/embed.js';
s.setAttribute('data-timestamp', +new Date());
(d.head || d.body).appendChild(s);
})();
}
});
</script>
</dom-module>
Результат
Комментарии появляются только на одном из этих my-testView1.html my-testView2.html одновременно. Мне нужна 1 ветка disqus на my-testView1.html и еще одна ветка disqus на my-testView2.html
Возможно, это из-за маршрутизации. В сообщении консоли Disqus говорится, что мне нужно использовать метод ajax https://help.disqus.com/customer/portal/articles/472107-using-disqus-on-ajax-sites К сожалению, я не смог заставить его работать, когда заменил приведенный выше код javascript кодом из пример:
<script>
Polymer({
is: 'my-testView1',
ready: function ()
{
var disqus_shortname = 'myDisqusChannelId';
var disqus_identifier = '/testView1';
var disqus_url = 'http://example.com/testView1';
var disqus_config = function () {
this.language = "en";
};
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = 'http://' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
var reset = function (newIdentifier, newUrl) {
DISQUS.reset({
reload: true,
config: function () {
this.page.identifier = newIdentifier;
this.page.url = newUrl;
}
});
};
}
});
</script>
</dom-module>
внутри обоих пользовательских элементов (изменив disqus_identifier и disqus_url соответственно для каждого из них)
channelName: jsbin.com/feqaqig/ редактировать?html,js,вывод - person Tomasz Pluskiewicz schedule 29.09.2016scriptdisqus на некоторые из этих страниц (настраиваемые элементы). Но, как вы сказали, это не будет работать в теневом доме, и я новичок, поэтому я еще не знаю, как это реализовать. К сожалению, в документации по полимерам нет полезной (для новичков) информации о скриптах внутри пользовательских полимерных элементов. - person Un1 schedule 29.09.2016select=""? Как показано в разделе Результат, у меня есть эти идентификаторыdisqus_threadиdisqus_thread2Нужно ли мне сделать так, чтобы ‹content› выглядел так: в одном пользовательском элементе<content select="#disqus_thread">и<content select="#disqus_thread2">в другом как для страниц пользовательских элементов, так и для промежуточная страница (my-app.html)? - person Un1 schedule 29.09.2016