前言介紹
- 這款 WordPress 外掛「WP Swiper」是 2014-02-26 上架。
- 目前有 4000 個安裝啟用數。
- 上一次更新是 2025-01-10,距離現在已有 114 天。
- 外掛最低要求 WordPress 3.0.1 以上版本才可以安裝。
- 有 24 人給過評分。
- 論壇上目前有 2 個提問,問題解答率 100% ,不低,算是個很有心解決問題的開發者團隊了!
外掛協作開發者
外掛標籤
swiper | carousel | slider block | swiper block | carousel block |
內容簡介
WP Swiper Gutenberg Block 是最現代化的免費手機觸摸式滑塊,具有硬體加速轉換和驚人的本機行為。它旨在用於移動網站、移動 Web 應用程序和移動本機/混合應用程序。
訪問官方網站
新功能和建議聯繫我
!!! 重要 !!!
我內部使用此外掛程式建立精彩的滑塊。目前僅提供必要的 Swiper 選項。更多功能即將推出!
如果您急需某項功能,請與我聯繫。
如果您是設計師,並且有一個介面設計想法,請讓我知道。
後端用戶介面目前不是最美觀的東西。但它非常直觀且可以完成任務!該界面設置為一系列選項卡,每個選項卡控制一個幻燈片。單擊選項卡,您可以上傳圖像。單擊 WP Swiper 區塊,您可以控制幻燈片覆蓋圖層和彩色覆蓋圖層。
關於後端用戶介面的另一個備註,最初的想法是在編輯器內生成功能性滑塊。但是,conteneditable HTML 元素存在問題。我在官方 swiper github 存儲庫上提交了一個問題,要求他們解決問題。留下評論以優先解決。
如果要使用帶有文字的幻燈片。
選擇幻燈片,添加圖像,該圖像將在前端作為背景顯示。
如果要使用圖像滑塊,只需添加一個常規圖像區塊即可。
功能:
為整個滑塊添加圖像覆蓋層+控制不透明度
為整個滑塊添加彩色覆蓋層+控制不透明度
將圖像添加到滑塊中
將內容(文本、標題、任何東西)添加到滑塊中
為每個滑塊位置設置內容
即將添加更多功能:
控制滑塊高度
動畫效果
其他來自官方 swiper 文檔的功能
原文外掛簡介
WP Swiper Gutenberg Block is the most modern free mobile touch slider with hardware accelerated transitions and amazing native behavior. This powerful plugin is designed to be used in mobile websites, mobile web apps, and mobile native/hybrid apps, providing you with a range of features and customization options to help you create stunning slideshows, image galleries, and more.
Features:
Use any block available in Gutenberg to create your slider
Hardware accelerated transitions for fast and smooth animations
Customize every aspect of your slider, including navigation and pagination options, autoplay settings, and more
Mobile-first design ensures your sliders look great on any device
Multiple slide layouts to choose from, including horizontal and vertical options
Dynamic content support, including support for video slides and dynamic image sources
Easy to use and beginner-friendly, with a user-friendly interface and intuitive controls
Built with performance in mind, ensuring your sliders load quickly and efficiently
WP Swiper Gutenberg Block is the ultimate tool for creating visually stunning displays on mobile devices. Whether you’re creating a mobile website, mobile web app, or mobile native/hybrid app, WP Swiper Gutenberg Block has everything you need to create beautiful and engaging slideshows, image galleries, and more.
Download WP Swiper Gutenberg Block today and take your mobile displays to the next level!
Support my work and fuel my creativity by buying me a virtual coffee on BuyMeACoffee
New Features and suggestions Contact Me
NEW RELEASE
WP Swiper version 1.2.0 is now live! This update introduces major changes, including a streamlined configuration with the new data-swiper attribute, a new WP Swiper Settings page, optimized asset loading, and more. Please note that the legacy configuration method will be deprecated in future releases.
For more details on what’s new and how to migrate, check out the full update announcement on the WP Swiper Blog.
wpswiper_frontend_js_register_args Filter
The wpswiper_frontend_js_register_args filter allows users to customize parameters when enqueueing the frontend-js script. This filter enables you to modify the script’s dependencies, control whether it loads in the footer, and specify additional loading strategies such as async or defer.
Parameters
deps: (array) The script dependencies for frontend-js. Default value is ['wpswiper-bundle']. You can modify this to include additional dependencies or remove existing ones.
args: (array|bool) An optional array for additional script loading strategies. If provided, it may be an array with a strategy key (set to either 'async' or 'defer'). If not specified, it defaults to false, indicating that no special loading strategy is applied.
For more information, read the WordPress documentation on wp_enqueue_script.
Example Usage
To modify the default values, add the following code to your functions.php file or your custom plugin:
add_filter('wpswiper_frontend_js_register_args', function($args) {
// Modify script dependencies
$args['deps'] = ['wpswiper-bundle', 'jquery', 'your-custom-dependency'];
// Specify an additional loading strategy, such as async or defer
$args['args'] = ['in_footer' => false, 'strategy' => 'defer']; // Options: 'async' or 'defer'
return $args;
});
This filter provides flexibility in how the frontend-js script is loaded, allowing for optimizations tailored to your specific site needs.
!!! IMPORTANT !!!
I use this plugin internally to build awesome sliders. At the moment only essential Swiper options are available. More to come!!!
If you urgently need a feature, please reach out to me.
If you are a designer and have an interface design in mind, let me know.
The backend UI is not the prettiest thing at the moment. But it’s very intuitive and does the job! The interface is set up as a series of tabs, each tab controls a slide. Click on the tab and you may upload an image. Click on the WP Swiper block and you can control slider overlay + color overlay.
Another note re: backend UI, the original idea was generate the functional slider within the editor. But theres an issue with conteneditable HTML elements. I lodged an issue on official swiper github repo for them to resolve. Leave a comment for them to prioritise the solution.
If you want to use the slide with text.
Select slide, add image, the image gonna appear as a background on the frontend.
If you want to use the slider for images, just add a regular image block.
Features:
Add image overlay for the whole slider + control opacity
Add color overlay for the whole slider + control opacity
Add image to the slider
Add content (text, headings, anything…) to the slider
Position content for each slider
More Features to be added:
Control height of the slider
Animations
Other features from the official swiper docs
各版本下載點
- 方法一:點下方版本號的連結下載 ZIP 檔案後,登入網站後台左側選單「外掛」的「安裝外掛」,然後選擇上方的「上傳外掛」,把下載回去的 ZIP 外掛打包檔案上傳上去安裝與啟用。
- 方法二:透過「安裝外掛」的畫面右方搜尋功能,搜尋外掛名稱「WP Swiper」來進行安裝。
(建議使用方法二,確保安裝的版本符合當前運作的 WordPress 環境。
延伸相關外掛(你可能也想知道)
Logo Carousel Gutenberg Block 》Awesome Logo Carousel Block 是一個使用 Swiper Js 库開發的自定义 Gutenberg 块,可以以滑动的方式展示您客戶的徽標。它易於使用並可與Gutenberg块編輯器高...。
Marquee Carousel – CSS only Carousel 》總結:, 這個 WordPress 外掛提供了一個簡單且引人注目的輪播功能,讓您可以輕鬆捕捉訪客的注意力。您可以自定義字型、顏色、背景和速度,以配合您網站的設計...。