Skip to main content

Giphy

GIFs are a great way to change the tone or convey emotions in your conversations. Here's a guide which helps to implement Gifphy in an easy and quick way. Let's get started!

Before you begin

  1. Sign up at Giphy and create a new app.
  2. Select API and click on Next.
  3. Enter your App name, description and click create.
  4. Make note of the API key that has been created.

Extension settings

  1. Login to CometChat and select your app.
  2. Go to the Extensions section and enable the Giphy extension.
  3. Click on the settings button and enter your Giphy API key and hit save.

How does it work?

This extension uses the callExtension method provided by the CometChat SDK. You can perform the following actions using this method:

  1. Get trending GIFs
  2. Search for GIFs

To list and show the most trending GIFs on Giphy, all you have to do is include the following parameters in your request.

keyValueDescription
offsetnumberSince you can get paginated results for trending GIFs, you can provide an offset and fetch results accordingly
limitnumberThe number of trending GIFs that you want to fetch

Once you have set the above parameters, you can make a call to the extension as follows:

const URL = "v1/trending?offset=1&limit=15";
CometChat.callExtension("gifs-giphy", "GET", URL, null)
.then((response) => {
// GIFs data from Giphy
})
.catch((error) => {
// Error occured
});

Search for GIFs

Apart from listing the trending ones, the extension also allows searching for a particular GIF using the following parameters:

keyvalueDescription
offsetnumberSince you can get paginated results for searches, you can provide an offset and fetch results accordingly.
limitnumberThe number of GIFs that you want to fetch as part of the search.
lang2-letter ISO 639-1 language identifier(Optional) Defaults to en. (Example values: es, fr, it.)
querystringSearch term

Once you have all the above parameters, you can make a call to the extension as follows:

const URL = "v1/search?offset=1&limit=15&query=awesome";
CometChat.callExtension("gifs-giphy", "GET", URL, null)
.then((response) => {
// GIFs data from Giphy
})
.catch((error) => {
// Error occured
});