Comparison Slider

外掛說明

Image Comparison Slider plugin light and easy After & Compare tool. Give user the flexibility to display image comparison slider.

Main Features

Image Comparison Slider Translations

Get Image Comparison Slider plugin for free! Just translate Comparison Slider to the one of new languages.
Contact us if you want to make translation.

  • English

First Start

Ready to begin with Image Comparison Slider? Let’s go!

Part one

Click Add new comparison

Part two

First you need is to upload the Images, choose which one you want to be on the right and click Select Image under the right part of the slider. Repeat the same with the other one.

To set captions simply click on Edit Captions near the image you upload

Slider Settings
* After that, customize the other Image Comparison Slider appearance options:
* Width – set slider width in pixels or percents
* Line Position (Pro Option) – Choose comparison line to be Horizontal or Vertical
* Icon – elect round or rectangular divider
* Border Depth – set border width in pixels
* Image Slider Settings
* Border Color – establish the needed color with current colorpicker
* Add Background color – select the color for icon background
* Choose Icon – set icon image from the list in popup
* Image Comparison Slider Settings
* Add Point – check here to create comparizon point on the pages for comparing
* Add – click to create a new one
* Remove All – permits you to delete all points at one click
* Remove – vanish the point you need
* Name point field – after user click on the point on the front-end he/she will see the label of the point
* Besides you can customize captions appearance:

Caption Settings
* Font – elect the font family
* Font Size – establish caption text size
* Font Color – Set the color for your captions
* Font Style – select which one you need Bold, Italic or Line
* Caption Position Settings
* Position (Pro Option) – choose caption position
* Set the needed padding for you captions in pixels –

Positioning
* Padding Top
* Padding Bottom
* Padding Left
* Padding Right

Don’t forget to Above the Settings click Save to make plugin remember your changes.

Part Three

Then copy the shortcode below the downloaded pics and insert it inside your post or page text editor and publish. And the Slider is done!

Cooperation

We invite plugin developers and agencies to collaborate.
At the moment, we have successful experience with WooBeWoo plugins developers.

Together, we carried out integration with plugins:
WooCommerce Product Table plugin https://woobewoo.com/plugins/table-woocommerce-plugin/
WooCommerce Product Filter plugin https://woobewoo.com/plugins/woocommerce-filter/
WooCommerce Currency Switcher https://wordpress.org/plugins/woo-currency/

We will be happy to answer all proposals for integration and cooperation!

螢幕擷圖

  • Comparison Slider admin interface

  • WordPress Slider plugin example

安裝方式

To install a plugin via FTP, follow next instructions

  1. Download the Comparison Slider plugin
  2. Unarchive the Comparison Slider plugin
  3. Copy the folder with Comparison Slider plugin
  4. Open ftp \wp-content\plugins\
  5. Paste the plug-ins folder in the folder
  6. Go to admin panel => open item “Plugins” => activate the Comparison Slider by Supsytic plugin

To install a plugin via WordPress Plugins page

  • In order to install the plugin go to your WordPress admin area -> Plugins -> Add New
  • Search Comparison Slider By pareslider.com and Install
  • Activate Slider and go to it’s tab on the left panel

使用者評論

2020 年 10 月 25 日
there is a small problem with the after image caption(it would not move like before the title), but it has a friendly backend.
閱讀全部 1 則使用者評論

參與者及開發者

以下人員參與了開源軟體〈Comparison Slider〉的開發相關工作。

參與者

將〈Comparison Slider〉外掛本地化為台灣繁體中文版

對開發相關資訊感興趣?

任何人均可瀏覽程式碼、查看 SVN 存放庫,或透過 RSS 訂閱開發記錄

變更記錄

= 1.0.5 / 19.02.2024
* Minor issues fix

= 1.0.4 / 26.04.2022
* Notice fix

= 1.0.3 / 22.04.2020
* Minor issues fix

= 1.0.2 / 17.09.2018
* Responsive mode issue fix
* Minor issues fix

= 0.2 / 18.01.2018
* Submit plugin to WordPress.org