前言介紹
- 這款 WordPress 外掛「Sravnitel」是 2017-01-20 上架。
- 目前有 10 個安裝啟用數。
- 上一次更新是 2017-02-27，距離現在已有 2989 天。超過一年沒更新，安裝要確認版本是否可用。以及後續維護問題！
- 外掛最低要求 WordPress 4.5.5 以上版本才可以安裝。
- 有 1 人給過評分。
- 還沒有人在論壇上發問，可能目前使用數不多，還沒有什麼大問題。
外掛協作開發者
外掛標籤
page | posts | images | visual composer | before after slider |
內容簡介
Sravnitel 是一款由 Elphel Inc. 基於 jQuery 插件 jquery.sravnitel.js 開發的 WordPress 外掛。
功能
比較 2 張或更多張圖片
可縮放和移動圖片
可設定初始縮放和位移
支援觸控事件：點擊、拖曳和手勢縮放
使用提示
在視窗區域點擊可快速切換左右圖片
在右上方的縮放訊息處點擊可將圖片縮放至適合視窗大小
若需使用多個本外掛，請為每個實例指定唯一的編號：[sravnitel id=’test1′ …]，[sravnitel id=’test2′ …]
工作範例
Elphel's Blog: Lapped MDCT-based image conditioning with optical aberrations correction, color conversion, edge emphasis and noise reduction
簡單範例
將圖片縮放至視窗大小，不顯示標題：
[sravnitel images=”ID0,ID1,ID2″ width=640 height=480]
將圖片縮放至視窗大小，顯示標題和開關按鈕：
[sravnitel images=”ID0,ID1,ID2″ width=640 height=480 showtitles=true showtoggle=true]
將圖片縮放至視窗大小，顯示標題：
[sravnitel images=”ID0,ID1,ID2″ width=640 height=480 showtitles=true zoom=0]
將圖片縮放至 30%，顯示標題，並使左上角座標為視窗中心：
[sravnitel images=’ID0,ID1,ID2′ width=640 height=480 showtitles=true zoom=0.3 center_x=0 center_y=0]
短碼參數
id – int – 0 – 包含
images – str – ” – (必填) 圖片 ID 列表，以逗號分隔
width – int – 530 – 視窗寬度（像素）
height – int – 300 – 視窗高度（像素）
showtitles – bool – false – 顯示/隱藏標題
showtoggle – bool – false – 顯示/隱藏按鈕，用於切換左右圖片
index_l – int – 0 – 設定左邊的圖片，此參數為圖片 ID 在列表中的索引，從 0 開始
index_r – int – 1 – 設定右邊的圖片，此參數為圖片 ID 在列表中的索引，從 0 開始
zoom – float – 0 – 設定初始縮放大小，0 表示縮放至視窗大小，1.0 表示 100%
center_x – int – 0 – 設定初始左上角座標（原始圖片座標系），以視窗中心為基準
center_y – int – 0 – 設定初始左上角座標（原始圖片座標系），以視窗中心為基準
原文外掛簡介
Sravnitel is a WordPress plugin by Elphel Inc. based on a jQuery plugin jquery.sravnitel.js.
Features
Compare 2+ images
Zoom and pan
Initial zoom and offset
Touch events: click, drag, pinch to zoom
Tips
Click on the view area to quickly switch between left and right image
Click on the zoom info in the top right to zoom-to-fit the view area
To place several instances of the plugin assign unique ids: [sravnitel id=’test1′ …], [sravnitel id=’test2′ …]
Working demo
Elphel’s Blog: Lapped MDCT-based image conditioning with optical aberrations correction, color conversion, edge emphasis and noise reduction
Quick examples
Fit image into the view window, w/o titles:
[sravnitel images=”ID0,ID1,ID2″ width=640 height=480]
Fit image into the view window, with titles and toggle button:
[sravnitel images=”ID0,ID1,ID2″ width=640 height=480 showtitles=true showtoggle=true]
Also fit image, with titles:
[sravnitel images=”ID0,ID1,ID2″ width=640 height=480 showtitles=true zoom=0]
Zoom 30%, with titles, x=0 and y=0 in the center of the view window:
[sravnitel images=’ID0,ID1,ID2′ width=640 height=480 showtitles=true zoom=0.3 center_x=0 center_y=0]
Shortcode Parameters
id – int – 0 – wrapper’s
images – str – ” – (required) list of images ids (attachment_id), comma separated
width – int – 530 – view window width px
height – int – 300 – view window height px
showtitles – bool – false – show/hide titles
showtoggle – bool – false – show/hide button – switch between left and right image
index_l – int – 0 – init, left image – is the index of the images array, starting from 0
index_r – int – 1 – init, right image – is the index of the images array, starting from 0
zoom – float – 0 – init, zoom, 0 – fit to view window, 1.0 – 100%
center_x – int – 0 – init, x coordinate of the original image to be placed in the center of the view window
center_y – int – 0 – init, y coordinate of the original image to be placed in the center of the view window
各版本下載點
- 方法一：點下方版本號的連結下載 ZIP 檔案後，登入網站後台左側選單「外掛」的「安裝外掛」，然後選擇上方的「上傳外掛」，把下載回去的 ZIP 外掛打包檔案上傳上去安裝與啟用。
- 方法二：透過「安裝外掛」的畫面右方搜尋功能，搜尋外掛名稱「Sravnitel」來進行安裝。
（建議使用方法二，確保安裝的版本符合當前運作的 WordPress 環境。
1.0 | 1.1 | 1.2 | 1.3 | trunk |
延伸相關外掛（你可能也想知道）
Twenty20 Image Before-After 》Twenty20 是由 Zurb 團隊開發的 TwentyTwenty 腳本的 WordPress 外掛。, 這啟發了我們一些新的想法，如何為我們自己的需求做類似的兩張圖片之間滑動來顯示「...。
Ultimate Before After Image Slider & Gallery – BEAF 》yout for your Before and After Image comparisons., Unlimited Before After Slider & Gallery, You can add unlimited Before After Sliders and Gall...。
Before After Image Comparison Slider for Elementor 》der-for-elementor/">Before After Image Comparison Slider for Elementor 是一個 Elementor 頁面建構器的圖片比較滑動外掛。這個外掛可以讓你創建比較兩張 ...。
BA Plus – Before & After Image Slider FREE 》BA Plus – Before & After Image Slider 是一款 WordPress 外掛，允許您在同一框架中比較兩張或多張不同的圖片。, 試用演示版，看看它是如何運作的...。
Before After Image Comparison Slider for WPBakery Page Builder 》Before After Image Comparison Slider for WPBakery（一款WPBakery Page Builder的圖片比較插件）可用於創建其效果，將兩個圖像進行比較。, 本插件使用WPBak...。
Beaf – Photo Comparison Block 》「Image Comparison Gutenberg Block」是一款使用 Gutenberg 原生元件開發的自訂區塊。您可以輕鬆展示圖片比較，並以不同風格和設置進行自定義。, 概述 觀看...。
Image Before After Addon for Elementor – WPTD 》Elementor 最佳的圖像 Before After 外掛, WPTD Image Before After 是專為 Elementor 設計的高級圖像比較外掛。您可以輕鬆地透過選擇來比較兩張圖像。此外，...。
WP Before After Slider 》WP Before After Slider 讓您更輕鬆地展示原始和新圖像之間的差異，讓客戶更容易理解。使用這個快速且易於使用的外掛節省您的時間。, 這是一個強大且有用的外...。
Before After Image Comparison Slider 》Before After Image Comparison Slider 外掛可協助您製作一個圖像比較滑動器，用以顯示圖像之前與之後的樣子。, 功能, , 完全響應式設計, 易於使用, 簡單安裝...。
Advanced Before After Slider 》進階 Before and After Slider 外掛提供一種虛擬的方式，以同一畫面顯示兩張圖片。使用者可以手動移動滑桿，同時比較兩張圖片。此外掛可幫助在同一畫面中顯示...。