1. Get a Giphy API Key
- Go to Giphy Developers and create an account or log in.
- Select "Create an App" and choose the API type:
- SDK: For testing and development (limit of 25 searches per hour)
- Production: For production applications (requires approval)
- Complete the required information about your application.
- Once created, you'll find your API Key in the dashboard.
2. Configure the API Key in Bubble
- In the Bubble admin panel, go to "Settings" > "API".
- In the "API Keys" section, add a new entry with the name "api_key_giphy".
- Paste your Giphy API Key as the value.
- Save the changes.
3. Install and Configure the Plugin in Your Application
- Add the plugin element to your page.
- Configure the properties according to your needs:
- search_term: Connect with a text field to allow searches.
- load_more: Connect with a "Load more" button using a workflow.
- results_count: Set how many results you want per page.
- rating: Configure the appropriate rating for your audience.
- media_type: Select the type of content you want to display.
4. Display the Results
- Add a Repeating Group to your page.
- Configure the data source as the plugin element.
- In "Source of Data" select the "image_urls" state (or the state you need).
- Inside the Repeating Group cells, add an image and configure its source as "Current Cell's Value".
Comments (00)