1. Plugin Installation:

Access the Bubble Plugin Marketplace and search for "Pixabay Media Search Plugin for Bubble".
Install the plugin and add the element to the page where you wish to display Pixabay media.

2. Basic Property Configuration:

In the Bubble editor, select the plugin element on your page.
Configure the api_key_pixabay property by entering your Pixabay API key (obtained from the Pixabay API Portal).
Adjust additional properties such as search_term, results_count, search_type (photos, illustrations, vectors, or videos), orientation, min_width, min_height, category, colors, and language.

3. Video Player Configuration:

For video content, utilize the built-in Video.js player element.
Configure video player properties including autoplay, loop, muted, controls, and poster image.
Set responsive behavior and custom styling options to match your application design.

4. "Load More" Button Configuration:

Add a button to your page to enable loading additional results.
In the button's workflow, set the plugin's load_more property to "yes" upon click.
Utilize the has_more_results state to dynamically show or hide this button.

5. Workflow Integration:

Bind the plugin's exposed states (e.g., image_results, video_results, image_tags, video_thumbnails, photographer_names) to dynamic elements.
Set up a Repeating Group to display results, using image_results or video_results as the data source.
Implement actions for user interactions, such as selecting and saving media content, or embedding media into your content workflows.

6. Media Display & Interaction:

Directly display media using URLs provided in exposed states (images and videos).
Implement selection workflows to allow users to interact with media items individually.
Use dynamic metadata provided (photographer names, tags, views, downloads, sizes) to enhance content presentation.
Leverage the built-in video player for seamless video playback with customizable controls.

7. Backend API Integration:

Use image or video URLs provided by the plugin to store media directly into your Bubble database.
Implement "Schedule API Workflow on a List" workflows to handle batch processing of media items.
Create custom endpoints in Bubble's backend to manage advanced media handling operations.
Utilize exposed metadata (tags, photographer credits, resolutions) for automated content categorization.

8. Performance Optimization:

Leverage built-in intelligent caching to minimize unnecessary API calls.
Consider using initial prefetching to load subsequent pages for a smoother user experience.
Display visual loading indicators during API request processing to enhance user engagement.
Implement lazy loading for video content to optimize page performance.

---

1. Create an Account in Pixabay:

Sign up for a free account at Pixabay.com.
Navigate to the Pixabay API documentation page to access API features.

2. Obtain the API Key (api_key_pixabay):

After creating your account, access your API key from the Pixabay API documentation page.
Copy your unique API key which provides access to Pixabay's media library.

3. Review API Terms and Limits:

Check the usage limits for your account (5,000 requests per hour for free accounts).
Ensure compliance with Pixabay API terms and conditions.
Review attribution requirements and licensing terms for media usage.

4. Integrate the API Key in Bubble:

Go to Bubble's "Settings" > "API" or configure directly in the plugin element properties.
Add your Pixabay API key securely under the api_key_pixabay property.
Save and apply these settings to your application.

5. Content Categories & Filtering:

Familiarize yourself with Pixabay's 20+ content categories (backgrounds, fashion, nature, science, education, etc.).
Understand filtering options including image types (photo, illustration, vector), orientations, and color preferences.
Plan your search strategies to maximize relevant content discovery.

---

1. Video Player Customization:

Configure Video.js player options including skin themes, control layouts, and responsive behavior.
Implement custom poster images and thumbnail previews for enhanced visual appeal.
Set up player events and callbacks for advanced interaction tracking.

2. Search Optimization:

Utilize advanced search parameters including minimum resolution filters and safety settings.
Implement multi-language search capabilities with the language parameter.
Create dynamic search workflows that adapt based on user preferences and content types.

3. Content Management:

Set up automated content moderation workflows using Pixabay's safety filters.
Implement user favorites and collection systems using exposed metadata.
Create content recommendation engines based on tags and categories.

4. Mobile Optimization:

Configure responsive design settings for optimal mobile experience.
Implement touch-friendly video controls and gesture support.
Optimize loading strategies for mobile bandwidth considerations.

---

6. Support & Documentation

To maximize your plugin usage, we provide:

• 📘 Full Documentation: Detailed guides and setup instructions
  
• 🛠️ Troubleshooting Help: Quick resolutions for common issues available in our FAQ.
  
• 🔄 Continuous Updates: Regular improvements and feature enhancements.
  
• 💡 Visual Content Boost: Access millions of high-quality, royalty-free images and videos instantly.
  
• 🎬 Video Integration: Professional video playback capabilities with customizable controls.
  

More Plugins by ANDAON (BubbleAI Labs)
Explore additional powerful Bubble plugins from our team:
🧩 View All Plugins by ANDAON