| 1 |
=== GutSlider - All in One Slider and Carousel Blocks for Gutenberg === |
| 2 |
Contributors: binsaifullah |
| 3 |
Tags: slider, carousel, slider block, gutenberg slider, image slider |
| 4 |
Requires at least: 6.5 |
| 5 |
Tested up to: 7.1 |
| 6 |
Stable tag: 3.2.0 |
| 7 |
Requires PHP: 7.4 |
| 8 |
License: GPLv2 or later |
| 9 |
License URI: https://www.gnu.org/licenses/gpl-2.0.html |
| 10 |
|
| 11 |
Build responsive sliders and carousels in the block editor - image, video, post, testimonial, logo and before-after slider blocks. |
| 12 |
|
| 13 |
== Description == |
| 14 |
|
| 15 |
**GutSlider is an all-in-one slider and carousel plugin for the WordPress block editor.** Build hero sliders, post carousels, video galleries, testimonial sliders, logo strips, before-after comparisons and scrolling marquees right on the page. No shortcodes, no page builder, no code. |
| 16 |
|
| 17 |
Pick a ready-made design, drop in your content, and see the result live in the editor. Every block is built with native Gutenberg components, so it feels like part of WordPress. |
| 18 |
|
| 19 |
**Fast by design.** Scripts and styles load only on pages that use a slider. Each page gets one minified CSS file instead of inline styles, and there is no jQuery. Swiper JS handles smooth, hardware-accelerated sliding. |
| 20 |
|
| 21 |
[youtube https://www.youtube.com/watch?v=Hob3WgBTVZI] |
| 22 |
|
| 23 |
👉 **[See every block live in the demos](https://demos.gutslider.com/)** · **[Compare Free and Pro](https://gutslider.com/pricing/)** |
| 24 |
|
| 25 |
### ✨ Why Choose GutSlider |
| 26 |
|
| 27 |
* 🎨 **Design picker in every block** - start from a polished, ready-made design and adjust it in the sidebar. |
| 28 |
* 🧩 **Slide any content** - images, video, headings, buttons or any other block. |
| 29 |
* 🖱️ **Interactive motion** - slides that react to the mouse with depth, 3D tilt and spotlight effects, plus magnetic buttons. |
| 30 |
* ⚡ **Lightweight** - conditional asset loading, one CSS file per page, no jQuery. |
| 31 |
* 📱 **Fully responsive** - separate Desktop, Tablet and Mobile values for spacing, columns, typography and more. |
| 32 |
* 🎛️ **Complete slider controls** - autoplay, loop, speed, effects, centered mode, free mode and columns. |
| 33 |
* 🧭 **Custom navigation and pagination** - styles, positions, sizes, colours and gaps. |
| 34 |
* ♿ **Accessible** - keyboard support, pause buttons and respect for the reduced-motion setting. |
| 35 |
* 🔤 **Google Fonts and typography** - a full typography panel on every text element. |
| 36 |
* 📚 **Block patterns library** - ready-made slider layouts you can insert and edit. |
| 37 |
* 🔌 **Enable or disable blocks** - switch off the blocks you don't use from the GutSlider dashboard. |
| 38 |
* 🌍 **Translation ready** - fully internationalised and RTL friendly. |
| 39 |
|
| 40 |
### 🆓 Free Slider and Carousel Blocks |
| 41 |
|
| 42 |
* **[Static Slider](https://gutslider.com/static)** - a hero slider with image, heading, text and buttons, entrance animations for each element, pointer effects (depth, 3D tilt, spotlight) and magnetic buttons. |
| 43 |
* **[Flexible Slider](https://gutslider.com/flexible)** - slide any block content, with Hero and Cards designs and full background controls. |
| 44 |
* **[Testimonial Slider](https://gutslider.com/testimonial)** - reviews with photo, rating, name and designation. |
| 45 |
* **[Photo Carousel](https://gutslider.com/photo)** - image carousel with lightbox and a 3D Coverflow design. |
| 46 |
* **[Logo Carousel](https://gutslider.com/brand-logos)** - client and brand logo carousel. |
| 47 |
* **[Before After Slider](https://gutslider.com/before-after)** - drag, fade or toggle between two images, with labels and several designs. |
| 48 |
* **[Video Carousel](https://gutslider.com/videos)** - YouTube and Vimeo videos. Add many links at once, and titles and thumbnails fill in by themselves. |
| 49 |
* **[Blog Post Slider](https://gutslider.com/post-slider)** - dynamic post slider with query controls, related posts and Magazine Hero and Card Carousel designs. |
| 50 |
* **[Marquee](https://gutslider.com/marquee)** - an endlessly scrolling strip for logos, text or images, with Logo Strip, Text Ticker and Announcement Bar designs, a steady pixel speed, separators, fade edges, slow down or stop on hover, and a live motion preview in the editor. |
| 51 |
|
| 52 |
### 🚀 GutSlider Pro: Make Every Slider Stand Out |
| 53 |
|
| 54 |
The free blocks cover the essentials. **[GutSlider Pro](https://gutslider.com/pricing/)** adds premium blocks, premium designs and features for sliders that get noticed, rank better and convert. |
| 55 |
|
| 56 |
**15 extra premium blocks** |
| 57 |
|
| 58 |
* **[Shader Slider](https://demos.gutslider.com/fashion-slider/)** - WebGL shader transitions between slides. |
| 59 |
* **[Shutters Slider](https://demos.gutslider.com/shutters-slider/)** - slides open and close like window shutters. |
| 60 |
* **[Slicer Slider](https://demos.gutslider.com/slicer-slider/)** - images slice apart as they change. |
| 61 |
* **[Fashion Slider](https://demos.gutslider.com/fashion-slider/)** - bold, editorial slider for fashion and lifestyle brands. |
| 62 |
* **[Triple Slider](https://demos.gutslider.com/triple-slider/)** - three images moving together. |
| 63 |
* **[Card Slider](https://demos.gutslider.com/card-slider/)** - stacked, swipeable cards. |
| 64 |
* **[Hover Slider](https://demos.gutslider.com/hover-slider/)** - hover a title to reveal its image. |
| 65 |
* **[Tinder Slider](https://gutslider.com/pricing/)** - swipe cards left and right. |
| 66 |
* **[Spring Carousel](https://demos.gutslider.com/spring-carousel/)** - springy, physics-style motion. |
| 67 |
* **[Panorama Carousel](https://demos.gutslider.com/panorama-carousel/)** - a curved, panoramic view. |
| 68 |
* **[3D Carousel](https://demos.gutslider.com/3d-carousel/)** - a rotating 3D ring of slides. |
| 69 |
* **[Material Carousel](https://demos.gutslider.com/material-slider/)** - Material-style expanding slides. |
| 70 |
* **[Marquee Carousel](https://demos.gutslider.com/marquee-carousel/)** - a continuous image marquee. |
| 71 |
* **[WooCommerce Product Carousel](https://demos.gutslider.com/product-carousel/)** - sell more with product sliders. |
| 72 |
* **[WooCommerce Product Categories Carousel](https://demos.gutslider.com/product-categories-carousel/)** - guide shoppers to your categories. |
| 73 |
|
| 74 |
**Premium designs for the free blocks** |
| 75 |
|
| 76 |
* **Static Slider** - Split Hero, Glass Card and Card Carousel. |
| 77 |
* **Flexible Slider** - Split, Fullscreen, Stacked Cards and Ticker. |
| 78 |
* **Testimonial Slider** - Center Cards, Avatar Switcher, Marquee Wall, Swipe Deck, 3D Coverflow and Glow Cards. |
| 79 |
* **Photo Carousel** - Showcase, Polaroid Stack, Film Ticker and Expanding Panels. |
| 80 |
* **Before After** - Glass Handle, Rounded Card, Split Labels and Dark Studio. |
| 81 |
* **Video Carousel** - Cinema, Playlist and Video Cards. |
| 82 |
* **Blog Post Slider** - Overlay Grid, Featured + List and Minimal Timeline. |
| 83 |
* **Marquee** - Testimonials, Image Strip and Tag Cloud. |
| 84 |
|
| 85 |
**Premium features** |
| 86 |
|
| 87 |
* 🔍 **SEO schema markup** - video rich results (VideoObject) for the Video Carousel and ItemList markup for the Blog Post Slider. |
| 88 |
* 🎬 **Before-after video comparisons** - compare two videos playing in sync, not just images. |
| 89 |
* 🖼️ **Multiple comparisons in one block** - switch between before-after pairs with thumbnails. |
| 90 |
* ▶️ **Auto-play and fullscreen** for before-after comparisons. |
| 91 |
* 🎥 **Video extras** - play in a lightbox, preview on hover, silent looping backgrounds, custom thumbnails and custom end times. |
| 92 |
* 🎬 **Content reveal** for the Static Slider - subtitle, title, description and buttons play in one cinematic sequence. Choose words rise, letters flip, blur in or mask reveal, and a slow, normal or fast pace. It replays on every slide and waits until the slider is on screen. |
| 93 |
* ✨ **Content animations and background effects** for the Flexible Slider. |
| 94 |
* 🌊 **Marquee motion** - up to three rows moving in opposite directions, marquees that move with page scroll, drag or swipe to move, and reverse or speed up on scroll. |
| 95 |
* 🗂️ **Slide names as tabs** - turn any Flexible Slider into a tabbed showcase. |
| 96 |
* 📱 **Per-device slide visibility and responsive background images.** |
| 97 |
* 🔗 **Wrapper links** - make a whole slide clickable. |
| 98 |
* 🧭 **Remote navigation** - control a slider from buttons anywhere on the page. |
| 99 |
* 🧷 **Detached content and thumbnail gallery navigation** for the Static and Blog Post sliders. |
| 100 |
* 💬 **Priority support** from the team that builds GutSlider. |
| 101 |
|
| 102 |
👉 **[Upgrade to GutSlider Pro](https://gutslider.com/pricing/)**. Your existing free sliders keep working as they are, and the Pro options unlock in the same sidebar. |
| 103 |
|
| 104 |
### 🔗 Useful Links |
| 105 |
|
| 106 |
* [All Demos](https://demos.gutslider.com/) |
| 107 |
* [Documentation](https://gutslider.com/) |
| 108 |
* [Get GutSlider Pro](https://gutslider.com/pricing/) |
| 109 |
|
| 110 |
== Installation == |
| 111 |
|
| 112 |
**From your WordPress dashboard** |
| 113 |
|
| 114 |
1. Go to *Plugins > Add New* and search for **GutSlider**. |
| 115 |
2. Click *Install Now*, then *Activate*. |
| 116 |
|
| 117 |
**Manual installation** |
| 118 |
|
| 119 |
1. Upload the `slider-blocks` folder to the `/wp-content/plugins/` directory. |
| 120 |
2. Activate the plugin through the *Plugins* screen in WordPress. |
| 121 |
|
| 122 |
**Getting started** |
| 123 |
|
| 124 |
1. Edit any post or page, click the block inserter (+) and open the **GutSlider Blocks** category. |
| 125 |
2. Add the slider or carousel block you need and configure it from the sidebar. |
| 126 |
3. Visit *GutSlider* in the admin menu to enable or disable individual blocks. |
| 127 |
|
| 128 |
== Frequently Asked Questions == |
| 129 |
|
| 130 |
= Is GutSlider free? = |
| 131 |
Yes. All the blocks listed under "Free Slider and Carousel Blocks" are free forever. GutSlider Pro is an optional upgrade that adds extra blocks and features. |
| 132 |
|
| 133 |
= What do I get with GutSlider Pro? = |
| 134 |
Pro adds 15 premium slider and carousel blocks (including WooCommerce product carousels), premium designs for every free block, SEO schema markup, before-after video comparisons, video lightbox and hover previews, content animations, remote navigation and priority support. See [the pricing page](https://gutslider.com/pricing/). |
| 135 |
|
| 136 |
= Will my sliders break if I upgrade to Pro or stop using it? = |
| 137 |
No. Pro builds on the free plugin, so your existing sliders stay the same. Pro options simply unlock in the same sidebar. |
| 138 |
|
| 139 |
= Do I need to know how to code? = |
| 140 |
No. Every slider is built visually in the block editor with drag-and-drop content and sidebar settings. |
| 141 |
|
| 142 |
= Are the sliders responsive? = |
| 143 |
Yes. Every slider and carousel is fully responsive, and most settings have separate Desktop, Tablet and Mobile values. |
| 144 |
|
| 145 |
= Will it slow down my site? = |
| 146 |
No. GutSlider only loads its scripts and styles on pages where a slider block is used, writes a single minified CSS file per page, and does not use jQuery. |
| 147 |
|
| 148 |
= Does GutSlider work with any theme? = |
| 149 |
Yes. It works with both block themes and classic themes, and has been tested with the most popular WordPress themes. |
| 150 |
|
| 151 |
= Does it work in the Site Editor and with block patterns? = |
| 152 |
Yes. The blocks work in posts, pages, templates, template parts and reusable patterns. |
| 153 |
|
| 154 |
= Which slider library does GutSlider use? = |
| 155 |
Swiper JS - a modern, touch-friendly slider library. No jQuery is required. |
| 156 |
|
| 157 |
= Can I create a slider from my blog posts or products? = |
| 158 |
Yes. The free Blog Post block builds a slider or carousel from your posts. WooCommerce product and product category carousels are available in GutSlider Pro. |
| 159 |
|
| 160 |
= I updated the plugin and now I see a block error. What should I do? = |
| 161 |
Open the post or page in the editor and click **Attempt Block Recovery**, then update the post. This resolves block validation notices left over from a markup change. |
| 162 |
|
| 163 |
= How do I report a bug or request a feature? = |
| 164 |
Use the plugin's [support forum](https://wordpress.org/support/plugin/slider-blocks/) on WordPress.org. |
| 165 |
|
| 166 |
== Screenshots == |
| 167 |
|
| 168 |
== External Services == |
| 169 |
|
| 170 |
**Google Fonts** - When you select a Google Font in a block's typography settings, the font stylesheet is requested from `https://fonts.googleapis.com` and the font files from `https://fonts.gstatic.com` on the pages where that block appears. Visitors' IP address and browser user agent are sent to Google as part of that request. No request is made if you only use system or theme fonts. |
| 171 |
Google Terms of Service: https://policies.google.com/terms - Google Privacy Policy: https://policies.google.com/privacy |
| 172 |
|
| 173 |
**YouTube and Vimeo** - The Video Carousel block embeds videos from YouTube (`https://www.youtube.com`, `https://www.youtube-nocookie.com`) and Vimeo (`https://player.vimeo.com`) on the pages where it is used, and loads their thumbnails from `https://i.ytimg.com` and `https://i.vimeocdn.com`. In the editor, the "Get title and thumbnail" option asks your own site's oEmbed proxy, which contacts YouTube or Vimeo. Visitors' IP address and browser user agent are sent to these services when a video or thumbnail loads. The GutSlider dashboard also shows a GutSlider video from `https://www.youtube-nocookie.com`; nothing is loaded from YouTube until you press play. |
| 174 |
YouTube Terms of Service: https://www.youtube.com/t/terms - Google Privacy Policy: https://policies.google.com/privacy - Vimeo Terms: https://vimeo.com/terms - Vimeo Privacy Policy: https://vimeo.com/privacy |
| 175 |
|
| 176 |
== Third Party Libraries == |
| 177 |
|
| 178 |
* [Swiper JS](https://swiperjs.com/) (MIT) - slider and carousel engine. |
| 179 |
* [fslightbox](https://fslightbox.com/) - image lightbox for the Photo Carousel block. |
| 180 |
|
| 181 |
== Changelog == |
| 182 |
= 3.2.0 = |
| 183 |
* Added: Design picker with ready-made designs in the Static, Flexible, Testimonial, Photo, Before After, Video, Blog Post and Marquee blocks |
| 184 |
* Added: Marquee - rewritten motion engine with a steady speed in pixels per second, new designs, separators, item width and alignment, fade edges, slow down on hover, and a "Preview motion" button in the editor |
| 185 |
* Added: Marquee - add items from several images at once, plus ready-made text, logo, image, testimonial and tag items |
| 186 |
* Added: Video Carousel - add many videos at once, fetch title and thumbnail automatically, and upload date for schema |
| 187 |
* Added: Before After - fade and toggle modes, label options and new designs |
| 188 |
* Added: Flexible Slider - Background panel for each slide, and Hero and Cards designs |
| 189 |
* Added: Blog Post Slider - more designs, now working as sliders, with related posts and "highlight the current post" |
| 190 |
* Added: Static Slider - Motion Effects panel with pointer effects (depth, 3D tilt, spotlight) and magnetic buttons |
| 191 |
* Added: Free vs Pro comparison page in the GutSlider dashboard |
| 192 |
* Added (Pro): Marquee Testimonials, Image Strip and Tag Cloud designs, multiple rows, and scroll and drag motion |
| 193 |
* Added (Pro): Video search results markup, Blog Post schema markup, before-after video comparisons, multiple comparisons, auto-play and fullscreen, video lightbox and hover preview, content animation, background effects and tab pagination |
| 194 |
* Added (Pro): Static Slider Content reveal - subtitle, title, description and buttons play in one sequence, with four reveal styles and three speeds |
| 195 |
* Improved: Static Slider entrance animations now wait until the slider is on screen |
| 196 |
* Improved: Compact Border control with only the solid, dashed and dotted styles |
| 197 |
* Improved: Settings that don't apply to the chosen design or mode are now hidden |
| 198 |
* Improved: Accessibility - pause button, keyboard support and reduced-motion support for moving content |
| 199 |
* Fixed: Static Slider - "Fade" animation had no effect, animation delays slowed button hover colours, and the primary button's delay setting followed the secondary button |
| 200 |
* Fixed: Static Slider showed unsaved changes each time it was opened |
| 201 |
* Fixed: Nested links in linked slides, empty background images, and blocks showing unsaved changes when a post is reopened |
| 202 |
* Fixed: Flexible Slider crash when "Fit Content" is turned on |
| 203 |
|
| 204 |
= 3.1.0 = |
| 205 |
* Added: Redesigned dashboard with live block, usage and front-end weight figures |
| 206 |
* Added: New start screen when a slider block is first inserted, with a pattern shortcut |
| 207 |
* Added: Blocks can be switched on and off straight from the dashboard |
| 208 |
* Improved: Release notes and getting-started progress now reflect the real state of the site |
| 209 |
|
| 210 |
= 3.0.0 = |
| 211 |
* Optimized for performance |
| 212 |
* Custom taxonomy supports for blog post block |
| 213 |
* Clean Dashboard with clear settings |
| 214 |
* Settings UI is improved |
| 215 |
|
| 216 |
= 2.13.2 = |
| 217 |
* Fixed: Sorting setting issue |
| 218 |
|
| 219 |
= 2.13.1 = |
| 220 |
* Updated: Deprecated components updated to the latest APIs |
| 221 |
* Checked: Compatibility with WordPress 7.0 |
| 222 |
|
| 223 |
= 2.13.0 = |
| 224 |
* Added: New Marquee block |
| 225 |
|
| 226 |
= 2.12.0 = |
| 227 |
* Added: Patterns library |
| 228 |
* Added: Testimonial block visibility option for all elements |
| 229 |
* Improved: Sorting component |
| 230 |
* Updated: Block icon colours changed to native |
| 231 |
|
| 232 |
= 2.11.4 = |
| 233 |
* Fixed: Bricks Builder conflict |
| 234 |
|
| 235 |
= 2.11.3 = |
| 236 |
* Fixed: Dynamic block fatal error |
| 237 |
|
| 238 |
= 2.11.2 = |
| 239 |
* Fixed: Fatal error |
| 240 |
|
| 241 |
= 2.11.1 = |
| 242 |
* Fixed: apiVersion updated |
| 243 |
|
| 244 |
= 2.11.0 = |
| 245 |
* Info: Prepared for the new review process |
| 246 |
|
| 247 |
= 2.10.1 = |
| 248 |
* Fixed: Photo Carousel style overriding issue |
| 249 |
* Fixed: Classic theme assets loading issue |
| 250 |
|
| 251 |
= 2.10.0 = |
| 252 |
* Redesign: Admin dashboard redesigned with a clean and elegant layout |
| 253 |
* Updated: Compatibility with the latest Pro version |
| 254 |
|
| 255 |
= 2.9.17 = |
| 256 |
* Added: Detach Content support for the Blog Post block |
| 257 |
* Fixed: Video custom poster style issues |
| 258 |
|
| 259 |
= 2.9.16 = |
| 260 |
* Added: Remote Navigation for Static, Flexible, Photos, Videos, Testimonials, Brand Logos and Blog Post blocks |
| 261 |
|
| 262 |
= 2.9.15 = |
| 263 |
* Added: Global link for the Testimonial block |
| 264 |
* Added: Custom thumbnail support for the Videos block |
| 265 |
* Fixed: Static Slider secondary button rendering issue |
| 266 |
|
| 267 |
= 2.9.14 = |
| 268 |
* Added: Global link for the Static and Flexible Slider blocks |
| 269 |
|
| 270 |
For the full release history, see [changelog.txt](https://plugins.svn.wordpress.org/slider-blocks/trunk/changelog.txt). |
| 271 |
|
| 272 |
== Upgrade Notice == |
| 273 |
|
| 274 |
= 3.2.0 = |
| 275 |
Big design update: a design picker in every block, a rebuilt Marquee, interactive motion effects for the Static Slider, faster video setup and many fixes. Existing sliders keep working without block recovery. |
| 276 |
|
| 277 |
= 2.13.2 = |
| 278 |
Fixes the sorting setting issue. Compatible with WordPress 7.0. |
| 279 |
|
