Mô tả
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
Ảnh màn hình
Cài đặt
- 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.
Hỏi đáp
-
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.
-
Is the carousel’s default pagination configurable?
-
The number of posts displayed per carousel page is determined by the MAX NUMBER OF COLUMNS
setting in the Query Loop block’s post template. -
Can multiple carousels be displayed on the same page?
-
Yes, you can display several different carousels on the same page.
-
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%;
}
Đánh giá
Không có đánh giá nào cho plugin này.
Người đóng góp & Lập trình viên
“Rouergue Creation Carousel Style Query Loop” là mã nguồn mở. Những người sau đã đóng góp vào plugin này.
Những người đóng góp
“Rouergue Creation Carousel Style Query Loop” đã được dịch qua 1 ngôn ngữ. Cảm ơn những người tham gia dịch vì đóng góp của họ.
Dịch “Rouergue Creation Carousel Style Query Loop” sang ngôn ngữ của bạn.
Muốn tham gia phát triển?
Duyệt code, check out SVN repository, hoặc theo dõi nhật ký phát triển qua RSS.
Nhật ký thay đổi
1.0.2
Modified
- Optimizing loading styles & JS script
- Recourse when the user has not disabled page reload in the advanced settings of the request loop block
- The number of carousel columns is no longer three by default, but is defined in the query loop block settings.
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