How-to: Create your Facebook Application

Discussion in 'Tutorials' started by Basti, Jan 22, 2011.

  1. Basti
    • Staff

    Basti Administrator Staff Member

    Updated 10.02.2019

    Before you start!
    - With recent facebook privacy policy changes, the app requires your list to have https support
    If your host do not provide free ssl certificates, you can as well skip all of this.
    This is needed for step 6.3

    - As i do not have a app as old as plugin version below 1.5, i cant say anything about how this new version works with old apps.
    To be safe, please setup a new app following the instructions


    In Order to use some Facebook features on your toplist, it is required you setup an Application via Facebook. That is to let your list communicate with Facebook.

    So, follow this step by step tutorial and you can in no time use these features.
    Tip: Clicking small images will enlarge them for better visiblity.


    1) Create your application https://developers.facebook.com/apps
    - It is important that you are logged in as the Admin of your Fan Page.
    1.png

    2) Give your App a name
    - Email should be prefilled, if not enter it
    2.png

    3) After creation, go over to the settings tab
    3.png

    4) Enter your App domain
    4.png

    5) Choose App plattform as website and enter your website url as found in your Visiolist Admin Settings. Once done save settings.
    5.png 6.png 7.png

    6) Next we need to add the product "login" to our new app. Return to the menu item "Dashboard" and setup the product
    - This is needed later for our admin area, so the page owner can grant the app permissions
    - This is not a global social login, only used by one person, the owner.

    8.png

    6.1) Choose www
    9.png

    6.2) Enter your website url as found in VisioList admin setting and click save
    - This should be auto filled if you followed this guide correctly.
    10.png

    6.3) Head over to the product settings and enter the "Valid OAuth Redirect URIs" and hit save settings
    - This step is needed due facebooks' privacy policy
    - The url to enter is https://your-site.com/index.php?a=admin&b=settings&facebook_get_tokens=1
    - Replace your-site.com with your actual domain, as found in VisioList admin settings
    - https has to be kept due privacy policy. Login is not allowed through a insecure channel

    11.png

    7) It is VERY important that you keep your app in developement mode
    - Without this, you need to submit your app for review, which is a very nasty and long lived procedure
    - We do not need a public app, as only the app owner uses this
    18.png


    8) Copy your App ID and App Secret.
    - For App Secret, please click "show" to see it. This is facebook security.
    12.png

    9) Now go to your VisioList admin page under facebook settings
    - Enter your Fan Page ID or Alias
    - Enter your App ID and App Secret.
    - Enable the features you want to actually use
    - Save settings.
    13.png

    10) After returning to this page, click "Allow Permissions".
    14.png

    10.1) The "Allow Permissions" will open the facebook OAuth page where the needed permissions are granted.
    - If you are not logged into your facebook account, you will be prompted to do so. Make sure you login as the Admin of your Fan Page.
    - You will notice the warning at the top. This is because we didn't submit app for approval.
    This we do not want! As only you as the admin uses this app, therefore not requiring the long approval process

    15.png

    10.2) Grant the actual permissions
    16.png

    10.3) After returning to the VisioList admin settings page. Let us validate that the access token is actually valid.
    Copy your token
    17.png

    10.3.1) Visit https://developers.facebook.com/tools/debug/accesstoken/ and paste your token
    The importants part on that page are
    - Type should mention "Page"
    - Expires should mention "Never"
    - Valid should mention "True"
    - Scopes should mention "manage_pages, pages_show_list, publish_pages, public_profile"




    With this you have successfully setup all needed steps!
    Last edited: Jul 11, 2019
    avidwebsolutions3, Screentzz and Mark like this.
  2. CraigKoz

    CraigKoz Member

    I was wondering where this was in the admin section .... cant seem to find it
  3. Basti
    • Staff

    Basti Administrator Staff Member

    Haha yea, when i built this we had it in the core files like premium, but it has been removed. Though, the code is still flying around and just need to be built as a plugin, for which i hopefully find the time soon
  4. CraigKoz

    CraigKoz Member

    Yeah thats great i would love this as an plugin since pretty much everything uses FB today... Its just a major plus to have

    Thanks hope to see it soon :)
  5. Basti
    • Staff

    Basti Administrator Staff Member

    Just to keep everyone updated. This is now a plugin and will be released once VL 0.6 is out
    Mark and CraigKoz like this.
  6. Anna

    Anna Member

    Trying to get FB plugin to work finally and I have done as it says above but when I press Allow Permissions it says "An error has occured. Please try again." Whats up? What have I done wrong this time^^
  7. Basti
    • Staff

    Basti Administrator Staff Member

    Hard to say, but i guess you still have your profile id in use. This does not work anymore as before. A fanppage has to be used now
  8. Anna

    Anna Member

    Nope - used the fan page id. But the strange thing is - I DO have (didnt bother to check before since there were an error) facebook button just below the twitter one on stats page and a facebook box to write in as well (dont like though that when commenting on fb the plugin uses any random screenshot it seems). But I do not have the buttons on the ranking page.
  9. Basti
    • Staff

    Basti Administrator Staff Member

    This might ( pretty sure actually )be related to your screenshot issue. Facebook also uses Curl to grab the tokens from facebook application etc.
  10. cajkan
    • Licensed

    cajkan Active Member

    Yep everything works as it should

    Thank you Basti
  11. Anna

    Anna Member

    OK, still cant get passed the Allow Permissions part. Just to be on the safe side: Is there something wrong with how I have written it in my application creation?

    Attached Files:

  12. cajkan
    • Licensed

    cajkan Active Member

    You must login into admin pannel and press Allow permission

    Everything is ok on screenshot
  13. Anna

    Anna Member

    But thing is - I do this and I get a: "There is something wrong. Try again later".... Thats what I meant with not getting any further....
  14. cajkan
    • Licensed

    cajkan Active Member

    If you can give me teamview i could try to help and see whats going on
  15. Basti
    • Staff

    Basti Administrator Staff Member

    App Domain: dont think the http://www. part is needed there. Try to remove it.

    Beside that all looks ok.
    And you first inserted your app secret etc into admin and saved settings yes? and pressed allow after that?
  16. Kelly Ling

    Kelly Ling Member

    Does this plugin work? I'm getting the error message someone mentioned above - "There is something wrong. Try again later". Would appreciate any assistance.
  17. leonor
    • Licensed

    leonor Active Member

  18. Kelly Ling

    Kelly Ling Member

    OK - So here's another question. Why is the Visiolist logo showing up and not your topsites logo? I would want my logo to post since it is from my site, using the Visiolist program. The users and visitors of my top site have no idea what Visiolist is.
  19. Basti
    • Staff

    Basti Administrator Staff Member

    Then update your settings :)
    You will see in the facebook settings part there is an avatar setting. It tells you exactly what it does.
    "Image to show next to the other info on Facebook"
    Just update the path to some other image
  20. webaddictdesigns
    • Licensed

    webaddictdesigns Member

    I've done everything above and it won't post to my facebook fan page. Had no trouble setting it up.
    For facebook settings the app domain is topwebs100.com my domain right? &
    Website with Facebook Login is http://topwebs100.com ? right?
    Sandbox mode is off also. I even got it to allow permissions in the back of my list.

Share This Page