FAIR

Federated and Independent Repositories

Blast Slider

Plugin Banner

Blast Slider

by felipewp0

Download
Description

Blast Slider lets you create customizable and responsive post carousels using the Gutenberg block editor, Elementor, or a simple shortcode. Perfect for showcasing recent posts, featured content, or blog categories.

Features:

  • Gutenberg block support
  • Elementor widget support
  • Shortcode [blast_slider] support with multiple attributes
  • Responsive layout with Swiper.js
  • Show/hide post title, image, date, and excerpt
  • Adjust number of posts and visible slides
  • Enable/disable loop and autoplay
  • Lightweight and blazing fast

Great for blogs, portfolios, news sites, and more.

Shortcode

You can use the [blast_slider] shortcode to display a customizable post carousel anywhere on your site — including inside the Classic Editor, widgets, page builders, or templates.

Basic Usage:
[blast_slider]

Available Attributes:

  • numberOfPosts — Total number of posts to display. Default: 6
  • autoplay — Enable automatic slide change. Accepts true or false. Default: false
  • autoplaySpeed — Time in milliseconds between slides (if autoplay is enabled). Default: 3000
  • theme — Visual theme of the slider. Accepts light or dark. Default: light
  • showTitle — Show the post title. Accepts true or false. Default: true
  • showImage — Show the featured image or a placeholder. Accepts true or false. Default: true
  • showDate — Display the post publication date. Accepts true or false. Default: true
  • showExcerpt — Show an excerpt of the post. Accepts true or false. Default: true
  • loop — Enable infinite loop for the slider. Accepts true or false. Default: false
  • slidesPerView — Number of visible slides at once. Default: 3
  • slidesPerGroup — Number of slides to move per navigation step. Default: 3
  • spaceBetween — Space between slides in pixels. Default: 20

Example:
[blast_slider numberOfPosts="8" slidesPerView="2" autoplay="true" autoplaySpeed="5000" loop="true" theme="dark"]

In PHP templates:
php
echo do_shortcode('[blast_slider numberOfPosts="4" showTitle="false"]');

Notes:
– If the number of posts is not divisible by slidesPerGroup and loop is enabled, the slider will be filled with empty slides to maintain smooth looping.
– When no posts are found, a fallback message is shown.
– If no featured image is set, a default placeholder image is displayed.

Development

This plugin uses source files located in the /src directory.
– JavaScript: /src/resources/js/blastslider.js
– CSS/SCSS: /src/resources/css/blastslider.css and /src/blocks/post-slider/style.scss
– Gutenberg block source: /src/blocks/post-slider/edit.jsx, save.jsx, index.js

The distributed production files are compiled and minified into the /build directory.
Example:
– /src/resources/js/blastslider.js /build/js/blastslider.min.js
– /src/resources/css/blastslider.css /build/css/blastslider.min.css

Developers can rebuild the /build directory from the /src source files using Node.js and npm:
1. Run npm install
2. Run npm run build to generate minified files.

Third-party libraries

  • Swiper v12.0.2 — MIT License — https://github.com/nolimits4web/swiper
  1. Upload the plugin files to the /wp-content/plugins/blast-slider directory, or install the plugin through the WordPress plugins screen directly.
  2. Activate the plugin through the ‘Plugins’ screen in WordPress.
  3. Use the Gutenberg block editor, Elementor, or the [blast_slider] shortcode to insert a carousel into your content.
Does this plugin require Gutenberg or Elementor?

You can use either Gutenberg or Elementor — the plugin supports both.

Can I use it with custom post types?

Not yet. The current version supports only standard WordPress posts.

Is it responsive?

Yes, the carousel is powered by Swiper.js and is fully responsive on all devices.

Why is a placeholder image rendered using <img> instead of wp_get_attachment_image()?

The placeholder image used by Blast Slider is a static local file included in the plugin. Since it is not part of the WordPress media library, it does not have an attachment ID, and therefore cannot be used with wp_get_attachment_image(). The <img> tag is rendered safely using wp_kses() to comply with WordPress security standards.

1.0.0

  • Initial release
  • Gutenberg and Elementor integration
  • Post carousel with loop, autoplay, and responsive layout
  • Shortcode with full attribute support
  • Settings for image, title, excerpt, and more
Back to top