Disqus-Kommentare funktionieren in einem benutzerdefinierten Polymerelement nicht
Ich weiß nicht, wie ich einen Disqus-Kommentar-Code erstellen soll, damit er in meinen benutzerdefinierten Elementen funktioniert.
Struktur meiner Site:| index.html
-------- \my-app.html (benutzerdefiniertes Element)
---------------- \my-testView1.html (benutzerdefiniertes Element)
---------------- \my-testView2.html (benutzerdefiniertes Element)
Ich muss disqus Kommentare in @ setzmy-testView1.html undmy-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>
Ich setze das div der disqus Kommentare in<my-app> auf derindex.html so dass Chrom es finden konnte. Eskippe finde es, wenn ich es hinein lege<my-testView1> so wie das
Seitemy-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>
, weil die my-app.html selbst ein benutzerdefiniertes Element ist und es nicht zulässt, dass Chrome es findet. Also musste ich es außerhalb des Schattendoms platzieren (dasindex.html Seite
my-testView1.html undmy-testView2.htmlsieht aus wie das<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>
Comments erscheint nur auf einem diesermy-testView1.html my-testView2.html damals. Ich brauche 1 disqus Thread auf my-testView1.html und ein weiterer Disqus-Thread auf my-testView2.html
Vielleicht liegt es am Routing. Die Disqus-Konsolenmeldung besagt, dass ich die Ajax-Methode @ verwenden mushttps: //help.disqus.com/customer/portal/articles/472107-using-disqus-on-ajax-site Leider konnte ich es nicht zum Laufen bringen, als ich den obigen Javascript-Code durch den Code aus dem Beispiel ersetzte:
<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>
Innerhalb der beiden benutzerdefinierten Elemente (Ändern vondisqus_identifier unddisqus_url entsprechend für jeden von ihnen)