Home/ Questions/Q 1019023
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-16T10:56:47+00:00

I’ve looked for some help on the reddit site itself, but I still can’t

  • 0

I’ve looked for some help on the reddit site itself, but I still can’t quite figure it out, so I’ve reposted here. I’ve also searched this forum but I haven’t found a close enough answer and don’t know enough about programming to extrapolate from what I have found.

I’m certainly not much of a programmer; this seems possible but I can’t work out how to do it.

I’d like to be able to insert a link to a reddit thread on a webpage and also display the number of comments in the thread I’ve linked to.

I understand how to do the first part:

<a href="http://www.reddit.com/r/redditdev/comments/d570p/reddit_widget_help/" 
target="_blank">4eddit thread<br /></a>

And I know I can get info on the thread by appending .josn to the url

http://www.reddit.com/r/redditdev/comments/d570p/reddit_widget_help.json

And I know the data I need in the json output is “num-comments“.

How can I come up with something that looks like this…

reddit widget help (n comments)

…where n is pulled from the .json info and is updated when the page is loaded?

Update

I’ve used Matthew Flaschen’s example below to get it working.

In the last hour or so I’ve discovered that moodle (our online course management system) doesn’t support JQuery but only YUI. And in any event I can’t seem to get and YUI javascript examples to run in the html sections that I am able to edit (I assume this is because I’m unable to edit the section).

As a workaround I can load this html:

<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        function show_num_comments(response) {
            $(function() {
                $('#comm_count').text(response[0].data.children[0].data.num_comments);
            });
        }
    </script>
    <script type="text/javascript" src="http://www.reddit.com/r/redditdev/comments/d570p/.json?jsonp=show_num_comments"></script>
</head>
<body>  
    <div id="thread"><span id="comm_count"></span> comments</div>
</body>

in an iframe. Unfortunately it means I’ll have to have a separate html file (for each iframe) for each lesson/comment thread I’d like students to discuss.

Any idea for making this a bit more elegant?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I made a simple proof-of-concept. You can test it on JSFiddle. (with jQuery) (without jQuery):

    Thread has <span id="comm_count"></span> comments
<script type="text/javascript">
    function show_num_comments(response)
    {
       window.addEventListener("load", function()
       {
         document.getElementById('comm_count').textContent = response[0].data.children[0].data.num_comments;
       }, false);
    }
</script>
<script type="text/javascript" src="http://www.reddit.com/r/redditdev/comments/d570p/reddit_widget_help/.json?jsonp=show_num_comments"></script>

    Because this is cross-domain, we have to use JSONP (JSON with padding). Basically, this means we provide a special function on our page (show_num_contents), then use a script tag. Reddit responds with a a script that calls the function, passing in the JavaScript object.

    We use addEventListener to wait until load to manipulate the DOM.

    • 0