Please upgrade here. These earlier versions are no longer being updated and have security issues.
HackerOne users: Testing against this community violates our program's Terms of Service and will result in your bounty being denied.

How to show last 20 topics on other webpages

edited November 2011 in Vanilla 2.0 - 2.8
I have already installed Vanilla Forums on my website.
Now , I want to show last 20 topics on my homepage.
I don't know much of API . Just need some working codes.
Tagged:

Best Answer

  • ToddTodd Chief Product Officer Vanilla Staff
    Answer ✓
    I'm going to help you get started with some javascript that we've done for a client.

    Please note that this script uses jQuery so you'll need to include that in your page as well. It is a very common library and should work. You should really know javascript and jQuery a little bit or you'll be flying blind though.
    // Include this script where you want to embed the latest 20 discussions.
    // This script requires jQuery.
    
    document.write('<div id="vn_discussions_popular"></div>');
    
    jQuery(document).ready(function($) {
       var url = 'http://yourforumhere.com/discussions.json?page=1-20&callback=?';
       
       $.ajax({
         url: url,
         dataType: 'json',
         success: function(data) {
             var foo = 'bar';
             var result = '';
             
             for(i in data.Discussions) {
                d = data.Discussions[i];
                result += '<li><a href="'+d.Url+'">'+d.Name+'</a></li>';
             }
             
             result = '<ul>'+result+'</ul>';
             $('#vn_discussions_popular').html(result);
          }
       });
    });
    Notes

    1. Notice that the url looks very similar to the url that your browse to when viewing the forum normally. The only difference is that it has a .json?page=1-20&callback=? on the end. This is the API in action and you can call most urls that way.

    2. If you want to figure out what kind of data is returned from the API I recommend getting the excellent JSONView Firefox extension. Once you've installed this you can copy that api url into your browser and have a look at what comes out. If you don't install JSONView you can still look at the url, but you will be prompted to download.

Answers

  • ToddTodd Chief Product Officer Vanilla Staff
    Answer ✓
    I'm going to help you get started with some javascript that we've done for a client.

    Please note that this script uses jQuery so you'll need to include that in your page as well. It is a very common library and should work. You should really know javascript and jQuery a little bit or you'll be flying blind though.
    // Include this script where you want to embed the latest 20 discussions.
    // This script requires jQuery.
    
    document.write('<div id="vn_discussions_popular"></div>');
    
    jQuery(document).ready(function($) {
       var url = 'http://yourforumhere.com/discussions.json?page=1-20&callback=?';
       
       $.ajax({
         url: url,
         dataType: 'json',
         success: function(data) {
             var foo = 'bar';
             var result = '';
             
             for(i in data.Discussions) {
                d = data.Discussions[i];
                result += '<li><a href="'+d.Url+'">'+d.Name+'</a></li>';
             }
             
             result = '<ul>'+result+'</ul>';
             $('#vn_discussions_popular').html(result);
          }
       });
    });
    Notes

    1. Notice that the url looks very similar to the url that your browse to when viewing the forum normally. The only difference is that it has a .json?page=1-20&callback=? on the end. This is the API in action and you can call most urls that way.

    2. If you want to figure out what kind of data is returned from the API I recommend getting the excellent JSONView Firefox extension. Once you've installed this you can copy that api url into your browser and have a look at what comes out. If you don't install JSONView you can still look at the url, but you will be prompted to download.
  • Interesting. The code makes the thread titles visible to anyone even if not logged?
    In this case it wouls solve that problem... :P
  • edited November 2011
    It works great !!
    Then , How can I show more data like posters , posting date , topic view count?
  • @visavit can you say me that list is visible to anyone or need the user to be logged?
  • Yes, I can se the list of threads but your forum is open.
    I'm interested in showing the guests the title of the threadb ut force them to reginstr&login to read the contents (posts)...
  • meshugymeshugy Musician/Hacker ✭✭
    edited April 2014

    Has anyone gotten this to work recently? I'd like to embed just the titles of the recent discussions into my website. I tried the method above but got this error:

    Parse error: syntax error, unexpected '$', expecting '&' or T_VARIABLE
    

    I'm using Vanilla 2.1b2

  • meshugymeshugy Musician/Hacker ✭✭

    bump...for some reason my comment didn't show up in the feed of new posts.

  • @meshugy said:
    Has anyone gotten this to work recently? I'd like to embed just the titles of the recent discussions into my website. I tried the method above but got this error:

    Parse error: syntax error, unexpected '$', expecting '&' or T_VARIABLE
    

    I'm using Vanilla 2.1b2

    post the exact code you inserted and we might see where the syntax error is.

    I may not provide the completed solution you might desire, but I do try to provide honest suggestions to help you solve your issue.

  • meshugymeshugy Musician/Hacker ✭✭
    document.write('<div id="vn_discussions_popular"></div>');
    
    jQuery(document).ready(function($) {
       var url = 'http://www.djangobooks.com/forum/discussions.json?page=1-20&callback=?';
    
       $.ajax({
         url: url,
         dataType: 'json',
         success: function(data) {
             var foo = 'bar';
             var result = '';
    
             for(i in data.Discussions) {
                d = data.Discussions[i];
                result += '<li><a href="'+d.Url+'">'+d.Name+'</a></li>';
             }
    
             result = '<ul>'+result+'</ul>';
             $('#vn_discussions_popular').html(result);
          }
       });
    });
    
  • meshugymeshugy Musician/Hacker ✭✭

    Line 3 was the one cited in the error

    jQuery(document).ready(function($) {
    
Sign In or Register to comment.