Fade Slider
Fade Slider is a lightweight, modern carousel/slider plugin built on Bootstrap 5.3. It provides smooth fade and slide animations with full responsiveness and works seamlessly with any WordPress theme. Key Features Bootstrap 5.3 carousel component with native animations Fade and slide animation modes Fully responsive design (mobile, tablet, desktop) Adaptive height scaling for different screen sizes Touch and keyboard navigation support Customizable interval, pause behavior, and autoplay Slide titles, descriptions, and clickable URLs Indicator dots and navigation arrows Responsive caption display with mobile optimization Works with any theme (includes Bootstrap or uses CDN) Automatic Bootstrap duplicate detection (prevents conflicts) Drag and drop slide reordering with visual feedback Auto-save slide order when reordered Custom Options 1. Install and activate the plugin 2. Create a new slider in the admin panel (Fade Slider menu) 3. Configure animation type (Fade or Slide) 4. Set carousel interval (delay between slides in milliseconds) 5. Add slides with images, titles, descriptions, and URLs 6. Set slider height/width (auto-scales to 70% on tablet, 60% on mobile, 50% on small phones) 7. Choose to show/hide captions on small devices 8. **Drag and drop slides to reorder** - Simply click and drag a slide thumbnail to change its display order. Visual feedback shows where the slide will be placed 9. Add shortcode to page/post: [display_fade_slider id=SLIDER_ID] 10. Or use template: Shortcode Usage [display_fade_slider id=1] Configuration Options Animation: Choose between Fade or Slide effects Interval: Set auto-play delay (milliseconds) or turn off with ‘off’ Hover Pause: Pause slider on mouse hover Show Indicators: Display bottom dot navigation Show Arrows: Display prev/next buttons Description Responsive: Hide captions on mobile devices (only shows on desktop/tablet) Slider Height and Width: Auto-responsive scaling Frequently Asked Questions Which Bootstrap version is required? Bootstrap 5.3.3 is automatically loaded via CDN. If your theme already includes Bootstrap 5.3+, the plugin will automatically detect and avoid duplication. Do I need to install Bootstrap separately? No. Bootstrap 5.3 is loaded automatically via CDN. The plugin includes intelligent duplicate detection to prevent conflicts with theme-provided Bootstrap. Does it work on mobile devices? Yes. The plugin is fully responsive with adaptive height scaling: Desktop (≥1200px): Full configured dimensions Tablet (768px-1199px): 70% of viewport height Mobile (≤767px): 50-60% of viewport height Small phones (≤375px): 40% of viewport height Can I customize animations? Yes. Two animation modes are available: Fade (opacity transition) and Slide (horizontal transition). Is there keyboard/touch support? Yes. The carousel supports touch gestures, arrow keys for navigation, and full accessibility features. How do I hide captions on mobile? In slider settings, select “Hide” for “Description Responsive” option. Captions will only show on tablets and desktops (≥768px). How do I reorder slides? You can easily drag and drop slides to change their display order. Click and hold on a slide thumbnail, then drag it to the desired position. The slide order is automatically saved when you release it. Visual highlighting shows where the slide will be positioned. Can I edit slide images after adding them? Yes. Click the edit icon (pencil) on any slide thumbnail to change the image. Click the trash icon to remove a slide entirely.
Top keywords
- slide16×2.98%
- slider11×2.05%
- bootstrap10×1.86%
- fade9×1.68%
- display7×1.30%
- height7×1.30%
- mobile7×1.30%
- drag5×0.93%
- responsive5×0.93%
- slides5×0.93%
- animation4×0.74%
- automatically4×0.74%
WP Swiper
WP Swiper adds a flexible carousel block to the WordPress editor. Each slide accepts standard nested blocks, so you can combine images, headings, buttons, video, and other block content without using a separate page builder. Highlights Build slides with nested WordPress blocks. Choose from seven editable in-block starter templates without adding extra block types. Create horizontal or vertical responsive carousels. Configure navigation, pagination, autoplay, loop mode, free mode, and transition effects. Set responsive breakpoints, spacing, offsets, and slides per view. Add background images, focal points, overlays, thumbnails, and custom navigation icons. Drag image files into the editor to create slides. Load frontend assets only when a slider is detected, with an optional global-loading setting for custom setups. Use the bundled Swiper 14 runtime without a jQuery dependency. Accessibility Since version 1.4.6, WP Swiper removes non-visible slides from the accessibility tree and keyboard tab order. Focusable content is restored when its slide becomes visible, including in responsive layouts that display multiple slides. This behavior addresses one carousel accessibility barrier, but it is not a certification that WP Swiper or a website using it conforms to WCAG. Conformance must be evaluated for the complete published page and depends on the carousel configuration, slide content, theme, and other integrations. Site authors remain responsible for accessible content and configuration. Provide meaningful image alternatives, logical headings, readable contrast, and clear control labels. If autoplay is enabled, enable the pause/play control so users can stop rotation. Rotation stops when keyboard focus enters the carousel and restarts only after an explicit user request. See the W3C carousel accessibility guidance. Privacy WP Swiper does not include analytics, advertising, tracking, or telemetry. Images selected through the editor are handled by the standard WordPress Media Library and REST API. Support and development For usage questions, use the WordPress.org support forum. Report reproducible bugs and feature requests on GitHub. Security issues should be reported privately according to the repository security policy. Development is supported through Buy Me a Coffee. Developer filter The wpswiper_frontend_js_register_args filter can change the dependencies and loading arguments used for the plugin’s frontend script. add_filter( 'wpswiper_frontend_js_register_args', function ( $args ) { $args['deps'][] = 'jquery'; $args['args'] = array( 'in_footer' => true, 'strategy' => 'defer', ); return $args; } ); See the wp_enqueue_script() documentation for supported loading arguments. Frontend lifecycle WP Swiper automatically initializes blocks added after page load. Navigation and AJAX integrations can also call window.wpSwiperInit(element), window.wpSwiperDestroy(element), or window.wpSwiperReinit(element) with a .wp-swiper block wrapper. Runtime configuration corrections dispatch a wp-swiper:warning browser event with a structured diagnostic. Initialization failures dispatch wp-swiper:error, and explicit destruction dispatches wp-swiper:destroy. Contributing WP Swiper is developed openly on GitHub, and community contributions are welcome. Report reproducible bugs through the GitHub issue tracker. Suggest focused improvements and new features. Improve documentation, translations, accessibility, or test coverage. Submit pull requests after reviewing the contribution guide. Please report security issues privately according to the security policy.