A powerful WordPress plugin that displays PDF files in an elegant carousel format using Slick Carousel and PDF.js. Perfect for showcasing PDF documents in your website's footer or anywhere using shortcodes or widgets.
- PDF Thumbnails: Automatically generates thumbnails from PDF first pages using PDF.js
- Multiple PDFs: Support for multiple PDF files in a single carousel
- Responsive Design: Fully responsive and mobile-friendly
- Fallback Support: Graceful fallback to direct PDF links if thumbnail generation fails
- Organized Settings: Clean, categorized admin interface with three main sections:
- PDF Settings: Configure PDF URLs, dimensions
- Carousel Behavior: Auto-rotation, speed, pause controls
- Navigation Settings: Arrows, dots, slides configuration
- Auto-rotation: Enable/disable automatic slide rotation
- Rotation Speed: Configurable speed (minimum 1000ms)
- Pause on Hover: Pause auto-rotation when hovering
- Infinite Loop: Continuous looping through slides
- Navigation Controls: Toggle arrows and dots indicators
- Fade Effect: Optional fade transition instead of slide
- Responsive Behavior: Mobile-optimized settings
- Mobile-First: Optimized for all screen sizes
- Touch Support: Swipe gestures on mobile devices
- Adaptive Layout: Automatically adjusts to container width
-
Upload Plugin:
- Upload the plugin folder to
/wp-content/plugins/ - Or install via WordPress admin β Plugins β Add New β Upload
- Upload the plugin folder to
-
Activate Plugin:
- Go to WordPress admin β Plugins
- Find "PDF Carousel Footer" and click "Activate"
-
Configure Settings:
- Go to Settings β PDF Carousel Footer
- Add your PDF URLs and configure carousel behavior
- PDF URLs: Comma-separated list of PDF file URLs
- PDF Width: Thumbnail width in pixels (minimum 100px)
- PDF Height: Thumbnail height in pixels (minimum 100px)
- Enable Auto-rotation: Toggle automatic slide rotation
- Rotation Speed: Speed in milliseconds (minimum 1000ms)
- Pause on Hover: Pause rotation when hovering over carousel
- Infinite Loop: Enable continuous looping
- Show Navigation Arrows: Toggle left/right arrow buttons
- Show Dots Indicator: Toggle bottom dots navigation
- Slides to Show: Number of slides visible (1-5)
- Slides to Scroll: Number of slides to scroll (1-5)
- Fade Effect: Use fade transition instead of slide
'pdf_urls' => '',
'width' => 600,
'height' => 400,
'autoplay' => 0,
'autoplay_speed' => 4000,
'show_arrows' => 1,
'show_dots' => 1,
'infinite_loop' => 1,
'slides_to_show' => 1,
'slides_to_scroll' => 1,
'fade_effect' => 0,
'pause_on_hover' => 1,Place this shortcode anywhere in your content:
[pdf_carousel_footer]
- Go to Appearance β Widgets
- Find "PDF Carousel Footer" widget
- Drag it to your desired widget area
- Configure settings in Settings β PDF Carousel Footer
// Get plugin instance
$plugin = PDF_Carousel_Footer_Plugin::instance();
// Render carousel HTML
echo $plugin->render_carousel_html();
// Get current options
$options = $plugin->get_options();.pcf-pdf-carousel- Main carousel container.pcf-slide- Individual slide container.pcf-thumb-link- PDF thumbnail link.pcf-thumb-fallback- Fallback content when PDF fails to load.pcf-notice- Notice messages
/* Customize carousel appearance */
.pcf-pdf-carousel {
max-width: 800px;
margin: 0 auto;
}
.pcf-pdf-carousel canvas {
border-radius: 8px;
box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}
/* Custom arrow styling */
.pcf-pdf-carousel .slick-prev,
.pcf-pdf-carousel .slick-next {
background: #0073aa;
border-radius: 50%;
}- Slick Carousel: For carousel functionality
- PDF.js: For PDF thumbnail generation
- jQuery: Required for Slick Carousel
pdf-carousel-footer/
βββ PDF Carousel Footer.php # Main plugin file
βββ includes/
β βββ class-pdf-carousel-plugin.php # Main plugin class
β βββ class-pdf-carousel-widget.php # Widget class
βββ assets/
β βββ css/
β β βββ pdf-carousel.css # Plugin styles
β βββ js/
β βββ pdf-carousel.js # Plugin JavaScript
βββ README.md # This file
pcf_options- Filter plugin optionspcf_carousel_html- Filter carousel HTML outputpcf_slider_settings- Filter Slick carousel settings
PDFs not loading:
- Ensure PDF URLs are accessible and use HTTPS
- Check browser console for CORS errors
- Verify PDF files are not password-protected
Thumbnails not generating:
- Check if PDF.js is loading properly
- Verify PDF URLs are valid and accessible
- Check browser console for JavaScript errors
Carousel not responsive:
- Ensure theme doesn't override plugin CSS
- Check for CSS conflicts
- Verify Slick Carousel is loading
Admin settings not saving:
- Check user permissions (requires 'manage_options')
- Verify WordPress nonce is working
- Check for plugin conflicts
Enable WordPress debug mode to see detailed error messages:
define('WP_DEBUG', true);
define('WP_DEBUG_LOG', true);- Initial release
- Basic PDF carousel functionality
- Admin panel with comprehensive settings
- Responsive design
- Widget and shortcode support
- PDF.js integration for thumbnails
- Slick Carousel integration
- Mobile-optimized interface
For support, feature requests, or bug reports:
- Check the troubleshooting section above
- Review WordPress error logs
- Test with default WordPress theme
- Disable other plugins to check for conflicts
This plugin is licensed under GPLv2 or later.
Nikolay Djemerenov
- Install and activate the plugin
- Go to Settings β PDF Carousel Footer
- Add your PDF URLs (comma-separated)
- Configure dimensions (width/height)
- Set up carousel behavior (autoplay, speed, etc.)
- Choose navigation options (arrows, dots)
- Save settings
- Add shortcode
[pdf_carousel_footer]or use the widget
Your PDF carousel is now ready to display your documents beautifully! π