A WordPress plugin that allows you to display BlueSky posts in Wordpress based on hashtags in a beautiful, responsive feed with horizontal or vertical scrolling capabilities.
- Display BlueSky posts filtered by hashtags
- Horizontal or vertical scrolling options
- Lazy loading of images for better performance
- Responsive design that works on all devices
- Built-in caching system for improved performance
- Simple shortcode integration
- Touch-friendly navigation
- Automatic post updates
- Clean, modern UI
Bluesky.mp4
- WordPress 5.0 or higher
- PHP 7.4 or higher
- jQuery (included with WordPress)
- BlueSky account credentials
- Upload the
blueskyFeedPlugindirectory to the/wp-content/plugins/directory - Activate the plugin through the 'Plugins' menu in WordPress
- Go to the BlueSky Feed settings page in your WordPress admin panel
- Enter your BlueSky credentials and configure your feed settings
-
Authentication Settings
- BlueSky Identifier (email/handle)
- BlueSky Password
- Test Connection button to verify credentials
-
Feed Configuration
- Add hashtags to track (without # symbol)
- One hashtag per line
-
Layout Settings
- Choose between horizontal or vertical scrolling
- Configure display options
Add the feed to any page or post using the shortcode:
[bluesky_feed]
blueskyFeedPlugin/
βββ js/
β βββ bluesky-feed-v4.js # Frontend JavaScript
βββ css/
β βββ bluesky-feed-v2.css # Styling
βββ bluesky-feed.php # Main plugin file
βββ bluesky-integration.php # BlueSky API integration
βββ README.md
-
BlueSkyFeedScroller Class
- Main plugin class handling WordPress integration
- Manages admin interface and settings
- Handles shortcode rendering
-
BlueSkyAPI Class
- Handles all BlueSky API interactions
- Manages authentication
- Fetches and formats posts
-
Frontend JavaScript
- Handles scrolling behavior
- Manages lazy loading
- Handles touch interactions
- Controls post loading and updates
The plugin uses the following WordPress hooks:
// Actions
add_action('admin_menu', ...)
add_action('admin_init', ...)
add_action('wp_enqueue_scripts', ...)
add_action('wp_ajax_test_bluesky_connection', ...)
add_action('wp_ajax_load_more_bluesky_posts', ...)
add_action('wp_ajax_clear_bluesky_cache', ...)
// Filters
add_filter('bluesky_post_content', ...)Key CSS classes for styling:
.bluesky-feed-container: Main container.bluesky-feed-scroller: Scroll container.bluesky-post: Individual post.bluesky-post-horizontal: Horizontal layout specific.bluesky-post-content: Post content.bluesky-image-wrapper: Image container.bluesky-nav-buttons: Navigation buttons
The BlueSkyFeed class provides methods for:
// Initialize feed
new BlueSkyFeed(container);
// Available methods
scrollPosts(direction) // Scroll to next/prev posts
loadMoreContent() // Load additional posts
updateNavigationState() // Update nav buttons state
initLazyLoading() // Initialize lazy loadingThe plugin implements a caching system for API responses:
- Cache duration: 1 hour
- Cached data: Authentication tokens and post data
- Clear cache: Available through admin interface
- All user inputs are sanitized
- WordPress nonces used for AJAX requests
- Credentials stored securely using WordPress options API
- API requests use proper authentication headers
Enable debug logging by adding to wp-config.php:
define('WP_DEBUG', true);
define('WP_DEBUG_LOG', true);Logs are stored in:
- Plugin directory:
/debug.log - WordPress debug log:
/wp-content/debug.log
- Fork the repository
- Create your feature branch (
git checkout -b feature/AmazingFeature) - Commit your changes (
git commit -m 'Add some AmazingFeature') - Push to the branch (
git push origin feature/AmazingFeature) - Open a Pull Request
This project is licensed under the MIT - see the LICENSE file for details.

