Beskrivelse
This plugin enhances the Gutenberg Query Loop block by adding a new “Carousel” style
that transforms the list of posts or CPT into a horizontal scrolling carousel, using only modern CSS.
Features:
- Works with the native WordPress Query Loop block
- “Carousel” style selectable in the Styles panel of the block settings
- By default, the carousel allows scrolling by pagination of three posts per page.
- Navigation with built-in browser scroll buttons & markers
- Responsive, compatible with desktop & mobile devices.
🔍 Démo
Discover the plugin in action on our Demo Site
🌍 Translations
◆ English
◆ French
Discover our other plugins
◆ Easy Custom Event Tickets
◆ Editor Custom Color Palette
◆ Filter Bar Custom Post Type
◆ Rouergue Creation Top Notice Bar
◆ Rouergue Creation Events Sidebar
◆ Slider Galerie Native Responsive
Skærmbilleder
Selecting the “Carousel” style in the Query Loop block 
Example of the carousel display on the front-end
Installation
- From your site dashboard, go to Plugins -> Add New.
- Search for “Native Block Carousel Query Loop”
- Click install and activate the plugin
- In the block editor (Gutenberg), insert a Query Loop block
- In the block settings Styles Panel, select the Carousel style
- In the Block Settings, define a Custom Query Type, choose your Post Type, select a number of items per page greater than three, in Advanced settings disable Reload Entire Page.
FAQ
-
Is it compatible with all browsers?
-
The carousel uses recent CSS specifications.
Currently, it is supported by Chrome, Edge and Opera.Other browsers will display a standard Query Loop layout.
-
Does the plugin use JavaScript?
-
Yes, a very lightweight JavaScript is used solely to enable keyboard navigation with the arrow keys .
The carousel’s core functionality relies on native CSS. -
Yes.
- Right arrow (): next page
- Left arrow (): previous page
A loop mode allows you to return to the beginning or the end.
-
Can I change the slider width?
-
To change the slider width, you can:
- Embed the Query Loop block within a Column block.
- You can also customize the carousel width by overriding the plugin’s CSS file via your child theme,or via the tool in the Appearance/Customize/Custom CSS menu.
.wp-block-query.is-style-nbcql-carousel-query-loop{
width:720px;
max-width: 100%;
}
Anmeldelser
Der er ingen anmeldelser for denne widget.
Bidragsydere & udviklere
“Rouergue Creation Carousel Style Query Loop” er open source-software. Følgende personer har bidraget til dette plugin.
Bidragsydere
“Rouergue Creation Carousel Style Query Loop” er blevet oversat til 1 sprog. Tak til oversætterne for deres bidrag.
Oversæt “Rouergue Creation Carousel Style Query Loop” til dit eget sprog.
Interesseret i udvikling?
Gennemse koden, tjek SVN repository, eller abonner på udviklerloggen via RSS.
Ændringslog
1.0.1
Added
- Added keyboard navigation using the keys
- Added a loop mode for keyboard navigation
- Updated documentation
Corrected
- The Carousel style is not applied to the
Query Loop block when multiple CSS classes are present.
1.0
- First stable version
- Added the “Carousel” style for the Query Loop block