Embed Discourse comments on another website via Javascript

Your use case is certainly not supported out of the box in Discourse and would require some custom development. I’d look at plugin development or hiring a consultant to help you implement it.

2 Likes

I would add to the Troubleshooting that if Discourse is not able to parse the content of your page/blog post in order to create a new thread, the embedding will fail (and no hint about it is given). Try embedding a specific topic first, then try to leverage the options for parsing your page.

3 Likes

This is great! The only hiccup I have on this is that I can’t determine how to use the correct CSS selector to pull the meta-description in to use as the first post.
I have tried several iterations like this. Any suggestions?

image

1 Like

If you are trying to pull in the content of the meta tag from your site’s head section, I don’t think it will be possible.

2 Likes

I am still lamenting that this won’t simply do a one box for the link provided in the embed vs. doing a more fancy import of text and potentially images.

Surely for sites with complex page data/layouts someone must have thought of a scenario where the topic was a placeholder for discussions and also a way to refer people to the remote site with the article/story?

Plz? :slight_smile:

3 Likes

So we are looking at implementing this on some blogs and articles on our main site and using the forum. When I was in a meeting this morning my marketing person said it was a bad idea because each post created on the forum would look like duplicate content with our blog because they have the same title and show the same first paragraph. He showed this with a google search from the example. Is there something built in that helps to show Google that these are not duplicates or could you put a no index on these posts?

4 Likes

Hmm, that’s interesting, because if we added noindex then the comments wouldn’t be indexed either which is not ideal. Is there a way of telling google “this part of the page is a duplicate?”

We could apply that to the OP.

1 Like

This was actually my concern when we discussed this. I don’t want to hurt the SEO value of the Blog however, I also don’t want to hide the forum Q&A because that is at times just as big of a draw as some of the blogs. I am not sure of a way to tell google index this part and not this part of a post.

Discourse has an embed set canonical url site setting. When it’s enabled, the canonical URL for embedded topics is set to the embedded content’s URL. Would this help to improve the duplicate content issue?

1 Like

It sounds like this would help with the issue. Any chance you know someone who is using this feature just so I can see and share an example?

Another option here would be to add “Comments on ______” to the beginning of the discussion title.

1 Like

That’s a tricky one, because I can’t share details about our customer’s sites. There are some more details about this issue in this topic: Add option to set canonical_url to embed_url. I’ve asked in that topic to see if anyone wants to provide details about how enabling the setting has affected their SEO.

1 Like

Is changing the title enough? The post content would still be shared.

1 Like

for some reason I can’t even view the page, even with disabled Adblock writes that it needs to be disabled

A single paragraph of “duplication” isn’t enough to trigger any duplicate content problems in my experience – since you used a screenshot from my blog :wink:

It’s similar to quoting a paragraph from a random article.

I did try this today by putting the page url into a hidden div. The script just put the link in place as text. No one box sadly. :frowning:

I was able to get the embed feature to grab my photos from the page. The problem was on my end as the code was using a pre-load/fade-in image JavaScript called lazyload. Once this was removed the topic creation was able to create any image I setup in the class selector area. However…

The topic is created and works fine for a few minutes. The image is viewable via zoom click. But after a few minutes on re-fresh the topic changes and instead of the image being present there is a upload text line in place of the image.

![](upload://s9ULowF5G9GnR4SQ1STdj1d9JtO.jpeg)

It would appear this is a failure of the image to remote upload to the forums server. Any ideas on why that would fail? Also if it does fail, why isn’t the system just retaining the original URL location. Seems odd.

I should add this wasn’t a lone case either. It consistently happened on all of the topics that had the image initially there (about 10+ topics).

[update: The workaround for this was to add my sites to the blacklist for sites to not download images from. That way the HTML just grabs them from the remote site. Works for me.]

1 Like

Can we prevent new topics when the URL changes (for blog title updates)?

1 Like

Yes, but your blog software will need to keep track of the topic ID that was created on the first call and pass it as a parameter on subsequent embed requests.

See “Linking to existing topics” in the OP.

3 Likes

I am unable to embed via typescript in angular, Please help

let   window : any;

      window.DiscourseEmbed = { discourseUrl: 'xyz.com',

        topicId: 26};

       

        let script = this._renderer2.createElement('script');

        script.type = "text/javascript";

        script.src =  'window.DiscourseEmbed.discourseUrl '+ 'javascripts/embed.js';

        script.async = true;
this._renderer2.appendChild(this._document.body, script);
1 Like