Embedding Discourse Category not Topic

[Bar_Smith]

Hello all!

I run a community driven open source project and our Discourse forum is the heart of the community.

I am working on a website to host collaborative open source projects and I would like each project page to have a discourse discussion section similar to how @eviltrout has an embedded discourse comments section on his blog:

Embedding Discourse in Static Sites

Instead of just embedding a single topic as a comments section, I would like to embed a category so that there can be multiple discussions going simultaneously.

So here’s my question: Is it possible to embed a discourse category instead of a topic and where do I start?

Thanks for your time! Love everything about discourse.

[Falco]

It’s our goal on this year RGSoC to create more widgets for embedding, like a latest posts widget, etc.

Wish for us to be selected

[Bar_Smith]

I’m happy to work on coding it myself…is there a place to start? Should I build off of the existing embedding widget?

[TeoWneD]

@Falco

It’s our goal on this year RGSoC to create more widgets for embedding, like a latest posts widget, etc.

Have you did it ? i would also enjoy that kind of widget i’m searching to embed category also.

@Bar_Smith

Instead of just embedding a single topic as a comments section, I would like to embed a category so that there can be multiple discussions going simultaneously.

[Falco]

Unfortunately we weren’t selected to this year RGSoC. So the project is on hold.

[TeoWneD]

Ohhh, so i have to learn rss feed in order to get the same result ?

[Falco]

There isn’t much to learn in RSS, it’s just a XML document you can parse.

Maybe you can create a mockup of exactly what you want to achieve?

[TeoWneD]

@TeoWneD

I will start by giving a bit of our context:
we provide specific food planning for specific profile:

• example a pregnant woman

There is 2 way our user can access the forum. A regular one, where you click on the tab ‘forum’ and it redirect you to our forum. This way is actually working properly. ( see screeshot 1 )

12.JPG1914x1080 250 KB

Now the second way ( the reason why we looked for iframe etc )One of our user come on our website as example 1 ( pregnant woman ) under her planning, she will see the pregnant woman category from forum.
Why we wanted iframe first ? to embed category like this

azeae.JPG1923x1069 216 KB

If we could have the corresponding forum category embeded under our planning would be the exact behaviour that we are looking for

Thanks you are you able to help?

[Falco]

Oh I see what you want now.

On the backend code responsible for the page located at dev.culibo.com/planning you must call the endpoint http://forum.culibo.com/c/Femme-Enceinte/latest.json which will respond with a JSON containing all the latest posts in the category.

Use this data to construct the HTML you want on the page.

[TeoWneD]

Thanks you, i will try it.

So i tryed it, and i got this result

“L’URL ou ressources demandée n’a pas été retrouvé” : mean The requested url was not found.

Could you please tell me, what latest.json consist of ?
Is ‘latest’ the correct name for the file of is it just a way of speaking?

[Falco]

Oops I forgot the list part of the URL, should be http://forum.culibo.com/c/Femme-Enceinte/l/latest.json

[TeoWneD]

So we managed to acces a json page when going on the folowing url:

http://forum.culibo.com/c/Femme-Enceinte/l/latest.json

On our side, we use PHP and we use those fonction:

$allTopicsList = file_get_contents(‘https://forum.culibo.com/c/Femme-Enceinte/l/latest.json’);
var_dump($allTopicsList);
And File_get_content is returning NULL.

Reminder: our discourse’s url is: https://forum.culibo.com/
Our website url is: https://dev.culibo.com/planning

Update: we also tryed 2 other methods:

• First div is the result of (JQUERY) load method.
• Seconde div is Ajax requested (JS).
• Third is the result of file_get_content (PHP)

Here is the code :

<div id="iframeLike"></div>
       <div id="iframeLikeII"></div>
       <div id="iframeLikeIII"><?= $allTopicsList ?></div>

       <script>
           $(function()
           {
               $("#iframeLike").load("<?= $forumURL ?>");

               $.ajax({
                   url: "<?= $forumURL ?>", // target
                   type: "GET", // HTTP request type
                   cache: false, // clearing the cache
                   dataType: "json", // type of the data to send
                   success: function(retrievedJsonData, statut) {
                       console.log(retrievedJsonData);
                       $("#iframeLikeII").text(retrievedJsonData);
                   },
                   error: function(resultat, statut, erreur) {
                       console.log(resultat);
                   }
               });
           });
       </script>

None of the 3 ways gives an answer, and here is the console message we have:

It means Multiorigines request had been bloqued ( Cross origin request ) The policy do not allow to consult the distant ressources on (https://URL.com) reason is CORS request failed