Facebook Code Snippets

Buttons_Template.js

{
  "facebook":{
    "attachment":{
      "type":"template",
      "payload":{
        "template_type":"button",
        "text":"What do you want to do next?",
        "buttons":[
          {
            "type":"web_url",
            "url":"https://www.messenger.com",
            "title":"Visit Messenger"
          },
          {
            "type":"web_url",
            "url":"https://www.google.com",
            "title":"Visit Google"
          },
          {
            "type":"web_url",
            "url":"https://www.yahoo.com",
            "title":"Visit Yahoo"
          }
        ]
      }
    }
  }
}

External_Websites.js

{
  "facebook":{
    "attachment": {
      "type": "template",
      "payload": {
        "template_type":"open_graph",
        "elements":[
           {
            "url":"https://gmail.com"
          }
        ]
      }
    }    
  }
}

Generic_Template.js

{
  "facebook": {
    "attachment": {
      "type": "template",
      "payload": {
        "template_type":"generic",
        "elements":[
           {
            "title":"Here is your title!",
            "image_url":"https://i.imgur.com/fFxXB2m.png",
            "subtitle":"Here goes your subtitle.",
            "default_action": {
              "type": "web_url",
              "url": "https://google.com",
              "webview_height_ratio": "tall"
            },
            "buttons":[
              {
                "type":"web_url",
                "url":"https://facebook.com",
                "title":"Link to Facebook"
              },{
                "type":"postback",
                "title":"Some Text",
                "payload":"Some Text"
              }              
            ]      
          }
        ]
      }
    }
  }
}

NodeJS_Template.js

const {Image} = require('dialogflow-fulfillment');

// Simple text
const name = 'Anshul';
agent.add(`Hello ${name}`);

// Sending images
agent.add(new Image('https://i.imgur.com/DYLlv4G.gif'));

// Sending quick replies
agent.add(`Would you like to understand how I may be of use to you? Please say Yes or No`);
agent.add(new Suggestion(`Yes`));
agent.add(new Suggestion(`No`));

// Sending cards
const card = new Card('Here is a Card Template');
card.setImage('https://i.imgur.com/w6ubJcV.png');
card.setText('Click on the below button ');
card.setButton({text: 'Go to Google.com', url: 'https://google.com'});
agent.add(card);

// Setting contexts
agent.setContext({ name: 'context-name', lifespan: 2, parameters: { city: 'Rome' }});

Persistent_Menu.js

// POST https://graph.facebook.com/v2.6/me/messenger_profile?access_token=<PAGE_ACCESS_TOKEN>

 {
  "persistent_menu":[
    {
      "locale":"default",
      "composer_input_disabled": false,
      "call_to_actions":[
        {
          "title":"Persistent Options",
          "type":"nested",
          "call_to_actions":[
            {
              "title":"Share App",
              "type":"postback",
              "payload":"Share App"
            },
            {
              "type":"web_url",
              "title":"Go to Google",
              "url":"https://google.com",
              "webview_height_ratio":"full"
            },
            {
              "type":"web_url",
              "title":"Go to Facebook",
              "url":"https://facebook.com/",
              "webview_height_ratio":"full"
            }
          ]
        },
        {
	  "title":"Show Main Menu",
	  "type":"postback",
	  "payload":"Main Menu"
        }
      ]
    }
  ]
}

Quick_Replies.js

{
  "facebook": {
    "text": "Here is a quick reply!",
    "quick_replies":[
      {
        "content_type":"text",
        "title":"How to get more out of your team or clients",
        "payload":"How to get more out of your team or clients",
        "image_url":"http://example.com/img/red.png"
      },
      {
        "content_type":"location"
      }
    ]
  }
}

Video_Template.js

{
  "facebook":{
    "attachment": {
      "type": "template",
      "payload": {
         "template_type": "media",
         "elements": [
            {
               "media_type": "video",
               "url": "https://www.facebook.com/AllTimeConspiracies/videos/199444947485193/"
            }
         ]
      }
    }    
  }
}