Description
Liyanit Responsive Slider is built using WordPress coding standards and accessibility best practices. It provides administrators with a dedicated slider manager, drag-and-drop slide ordering, Media Library integration, shortcodes, and Gutenberg block support.
The plugin uses WordPress-native functionality and does not require jQuery or third-party frontend JavaScript libraries.
Key Features
- Object-Oriented Architecture: Clean autoloading and modular class structure using the Liyan_GS\ResponsiveSlider namespace.
- WordPress Native: Uses a Custom Post Type (
liyan_gs_slider) and post meta without creating custom database tables. - Drag-and-Drop Editor: Re-order slides easily from the WordPress Admin.
- Touch & Swipe Support: Modern vanilla JavaScript slider engine with no jQuery dependency on the frontend.
- Accessibility Features: Keyboard navigation, ARIA attributes, visible focus states, pause on hover/focus, and prefers-reduced-motion support.
- Conditional Assets: Loads frontend CSS and JavaScript only when a slider is rendered.
- Developer Hooks API: Provides action and filter hooks for custom extensions.
- Gutenberg Support: Insert and configure sliders directly from the WordPress Block Editor.
- Shortcode Support: Display sliders anywhere shortcodes are supported.
- Template Overrides: Customize slider markup from your active theme without modifying plugin files.
Shortcode Usage
Display any slider using:
[liyan_gs_slider id=”123″]
Supported Attributes
id(int, required): Slider Post ID.autoplay(bool, optional): Override autoplay (trueorfalse).speed(int, optional): Override transition speed in ms (e.g.600).navigation(bool, optional): Show or hide arrow navigation (trueorfalse).pagination(bool, optional): Show or hide pagination dots (trueorfalse).slides_per_view(int, optional): Override the number of visible slides.space_between(int, optional): Override the spacing between slides in pixels.class(string, optional): Extra CSS class name for styling wrapper.
Example:
[liyan_gs_slider id=”123″ autoplay=”true” speed=”5000″ navigation=”true” pagination=”true” slides_per_view=”3″ space_between=”20″]
Developer Hooks API
Actions
liyan_gs_slider_init: Fires on plugin initialization.liyan_gs_slider_before($slider_id, $settings): Fires before slider markup.liyan_gs_slider_after($slider_id, $settings): Fires after slider markup.liyan_gs_slider_before_slide($slide, $index): Fires before each slide item.liyan_gs_slider_after_slide($slide, $index): Fires after each slide item.
Filters
liyan_gs_slider_settings($settings, $slider_id): Filter slider configuration.liyan_gs_slider_slides($slides, $slider_id): Filter array of Slide objects.liyan_gs_slider_slide_html($html, $slide, $index): Filter rendered HTML of an individual slide.liyan_gs_slider_image_attributes($attr, $slide): Filter image attributes (alt,loading, etc.).liyan_gs_slider_classes($classes, $slider_id, $settings): Filter slider container CSS classes.
Blocks
This plugin provides 1 block.
- Liyanit Responsive Slider Select and display an OOP Liyanit Responsive Slider.
Installation
- Upload the
liyanit-responsive-sliderdirectory to/wp-content/plugins/. - Activate the plugin through the ‘Plugins’ menu in WordPress.
- Navigate to WordPress Admin Sliders to create your first slider.
- Copy the shortcode
[liyan_gs_slider id="123"]or select the Liyanit Responsive Slider block in Gutenberg block editor.
FAQ
-
How do I display a slider on my site?
-
You can insert a slider using shortcode
[liyan_gs_slider id="YOUR_SLIDER_ID"]into any page, post, or widget area. Alternatively, if you are using the Block Editor (Gutenberg), search for the Liyanit Responsive Slider block and select your desired slider. -
Can I override the default slider template in my theme?
-
Yes! Copy the template file from
wp-content/plugins/liyanit-responsive-slider/public/views/slider-template.phpto your active theme folder atwp-content/themes/your-theme/liyanit-responsive-slider/slider-template.php. Do not modify the plugin’s original template file, because your changes may be lost when the plugin is updated. -
Is jQuery required on the frontend?
-
No. The frontend slider script uses vanilla JavaScript and does not require jQuery or other external frontend JavaScript libraries.
-
Does the plugin create custom database tables?
-
No. The plugin uses the WordPress Custom Post Type liyan_gs_slider and WordPress post meta instead of creating custom database tables.
-
Does the slider support accessibility features?
-
Yes. The slider includes keyboard navigation, ARIA attributes, visible focus states, pause behavior for hover and focus, and support for the user’s prefers-reduced-motion preference.
Reviews
There are no reviews for this plugin.
Contributors & Developers
“Liyanit Responsive Slider” is open source software. The following people have contributed to this plugin.
ContributorsTranslate “Liyanit Responsive Slider” into your language.
Interested in development?
Browse the code, check out the SVN repository, or subscribe to the development log by RSS.
Changelog
1.0.0
- Initial release with a WordPress-native OOP architecture, admin drag-and-drop editor, accessibility features, vanilla JavaScript slider engine, shortcode support, template overrides, and Gutenberg block support.
