How to Add and Customize a WordPress Slider Using Shortcodes
One of the easiest ways to display dynamic content in WordPress is by using shortcodes.
Shortcodes allow developers and website administrators to place dynamic functionality inside pages, posts, widgets, and other supported areas without manually writing complex code.
Liyanit Responsive Slider includes shortcode support, making it easy to display sliders throughout a WordPress website.
Basic Slider Shortcode
The basic shortcode is:
[liyan_gs_slider id="123"]The id represents the Slider Post ID.
For example, if your slider ID is 123, you can place the shortcode inside your WordPress content:
[liyan_gs_slider id="123"]Once the page is published, the slider will be rendered automatically.
Enable Autoplay
You can enable or disable autoplay using the autoplay attribute.
Example:
[liyan_gs_slider id="123" autoplay="true"]To disable autoplay:
[liyan_gs_slider id="123" autoplay="false"]This gives website owners control over whether slides should automatically change.
Change Transition Speed
The speed attribute allows you to override the default transition speed.
Example:
[liyan_gs_slider id="123" speed="5000"]The value is specified in milliseconds.
Enable Navigation
Navigation arrows can be enabled through the navigation attribute:
[liyan_gs_slider id="123" navigation="true"]This allows visitors to manually move between slides.
Enable Pagination
Pagination dots can also be displayed:
[liyan_gs_slider id="123" pagination="true"]Pagination is useful when you want visitors to understand how many slides are available and quickly navigate between them.
Display Multiple Slides
The slides_per_view attribute can be used to control the number of visible slides.
Example:
[liyan_gs_slider id="123" slides_per_view="3"]This can be particularly useful for product showcases, service cards, testimonials, or featured posts.
Add Space Between Slides
You can customize the spacing between slides using space_between.
Example:
[liyan_gs_slider id="123" space_between="20"]This allows you to create more visual separation between individual slides.
Add a Custom CSS Class
Developers can also provide a custom CSS class:
[liyan_gs_slider id="123" class="homepage-slider"]This makes it easier to target a specific slider with custom CSS.
Complete Example
Multiple attributes can be combined into a single shortcode:
[liyan_gs_slider id="123" autoplay="true" speed="5000" navigation="true" pagination="true" slides_per_view="3" space_between="20"]This gives developers considerable control over slider behavior without modifying the plugin’s core files.
Developer Hooks and Filters
For developers who need more advanced customization, Liyanit Responsive Slider also provides actions and filters.
Developers can use hooks to customize slider settings, slide markup, image attributes, and CSS classes.
This makes the plugin suitable not only for regular WordPress users but also for developers working on custom WordPress themes and websites.
Gutenberg Support
The plugin also provides Gutenberg block support, allowing users to select and display a slider directly from the WordPress block editor.
This provides an alternative to manually entering shortcodes.
Conclusion
Shortcodes provide a simple and flexible way to add dynamic slider functionality to WordPress websites.
With Liyanit Responsive Slider, developers can control autoplay, transition speed, navigation, pagination, visible slides, spacing, and CSS classes directly through shortcode attributes.
For more advanced requirements, developer hooks and Gutenberg support provide additional flexibility.
