Migrating from 6.x to 7.0

Gutenslider 7.0 is a rebuild of the editor and the front end, made as a drop-in update: sliders you saved with 5.x and 6.x keep their settings, render without being opened again, and open in the new editor unchanged.

What stays the same

  • The block names (eedee/block-gutenslider, eedee/block-gutenslide) and every saved setting.
  • Old sliders open in the editor without “This block contains unexpected content” and without “Attempt recovery”. 22 migration tests open content saved with 5.x and 6.x and check that nothing changes.
  • The front-end class names, so custom CSS keeps matching (see class names).
  • The PHP filters gutenslider_attributes, gutenslide_attributes and gutenslider_arrows, and element.gutenslider.swiperInstance in JavaScript (see the developer notes).
  • Sliders built with Pro settings keep rendering, with or without an active license. Only the new shaped and WebGL effects need an active license to play; without it they play as slide or fade.

The new editor

  • The editor canvas shows the slider styled as the page shows it. Its arrows and dots page through the slides while you edit.
  • The Preview button runs the real front-end slider, with its effect and autoplay, inside the editor.
  • The device switch in the settings follows the editor’s preview device (desktop, tablet, mobile), and the other way round.
  • The content position is a 3 × 3 matrix in the toolbar. New slides come from the Media Library or start empty.
  • Transforms: turn a Gallery, Image or Cover block into a slider, and a slider back into a Gallery.

What changes on the front end

Area6.x7.0
ScriptA loader plus Swiper 9An Interactivity API module; Swiper 14 loads when a slider comes near the screen, with only the modules it uses (three or four requests)
jQueryLoadedNot used
CSSSeveral filesOne file, about 7 KB gzipped
LightboxlightGalleryNative <dialog> lightbox that grows out of the clicked image
Parallaxsimple-parallax-jsCSS
LayoutSet after the script ranRendered on the server, so the page does not shift
ImagesFull-width sizesSizes per device from the slides in view; the first image with high priority, the rest lazy
MotionAlways onAutoplay, parallax and WebGL transitions respect “reduce motion”

On the same pages, mobile Lighthouse went from a performance score of 66–88 with 6.1.2 to 95–99 with 7.0, the largest contentful paint from about 3.9 s to 2.1–3.2 s, and the layout shift from 0.52 to 0.

What moved between Free and Pro

Now in the free plugin: video slides, color and gradient overlays, shape dividers (shape, color, flip), the 11 arrow styles, space between slides and up to eight slides in view. New in Pro: six shaped effects, twenty WebGL transitions and animated dot styles. The full list is in Free vs Pro.

The lightbox stays free: it opens out of the clicked image, pages with arrows, keyboard and swipe, shows a counter and comes in light or dark. Pro adds its options to the same panel: thumbnails, a zoom button, a heading and text from the image’s title, caption or description, a fade opening and your own colors.

Your Pro license

A Pro license you already have works with 7.0 as it is: update the plugin, and the license stays active. Subscriptions keep the price you signed up with. Pro sliders never break when a license ends; the Pro effects then play as slide or fade.

Requirements

WordPress 6.6 or newer (tested up to 7.1) and PHP 7.4 or newer.

Checklist after updating

  1. Back up the site (files and database) before the update.
  2. Open your pages with sliders on a phone and a desktop: height, arrows, dots, autoplay.
  3. If you used custom CSS that targets lightGallery classes (.lg-…), move it to the new lightbox.
  4. If you used JavaScript on element.gutenslider.swiperInstance, wait for the gutenslider:init event before you use it: Swiper now loads when the slider comes near the screen. See the developer notes.
  5. Open one slider in the editor and use Preview to check the effect.

Something broke? Tell us in the support forum (Pro: by email) with the page URL. You can go back to 6.1.2 from the plugin’s “Advanced View” page on wordpress.org in the meantime.