[wordpress插件] Before After Image Slider Lite之前之前之后Image Slider Lite

The Before After Image Slider for WordPress allows you to easily show and compare two images.

适用于WordPress的After After Image Slider可让您轻松显示和比较两个图像。

See screenshots or demo for more information.

有关更多信息，请参见屏幕截图或演示。

The lite version contains the following features:

精简版包含以下功能：

• One mode (overlay)
• 一种模式（重叠）

• Define left and right alt-Attribute
• 定义左右alt属性

• Set width
• 设置宽度

• Set title
• 设置标题

• Shortcode generator (Note: You have to install the optional Favpress framework for this, see FAQ)
• 短代码生成器（注意：您必须为此安装可选的Favpress框架，请参阅FAQ）

• Define additional classes
• 定义其他类

Support

支持

Please use the support forum in case of any problems or questions before

在遇到任何问题之前，请使用支持论坛。

/>

/>

just giving a bad rating.

只是给一个不好的评价。

We really take this seriously.

我们真的很重视这一点。

Usage

用法

Please see the Other Notes section for more details on this.

有关更多详细信息，请参阅其他说明部分。

p>

>

HINT:

提示：

There is also a pro version available with direct support and additional features like more modes, Visual Composer support, setting

还有一个专业版可直接支持，并具有其他功能，例如更多模式，Visual Composer支持，设置

an inital value, linking images and more…

初始值，链接图像等等……

View pro version

查看专业版

Usage

用法

Shortcode Generator

简码生成器

To be a able to use the handy shortcode generator, you have to install the optional Favpress framework.


要能够使用方便的简码生成器，必须安装可选的Favpress框架。


Set FAQ for this.

为此设置常见问题解答。

Hint: After you’ve created your pages, you can safely deactivate (and remove) Favpress again.

提示：创建页面后，可以安全地停用（并删除）Favpress。

It is only needed for this editor functionality.

只有此编辑器功能才需要。

Note: The generator currently only works in the visual editor mode.

注意：生成器当前仅在可视编辑器模式下工作。

Shortcode

简码

The basic shortcode looks like this:

基本短代码如下：

[image-comparator][/image-comparator]
  [图像比较器] [/图像比较器]
 
You may use the following parameters:
您可以使用以下参数：
left (required) – Url or id of the left image.
 左（必填）–左图像的网址或ID。
left_alt – “alt” attribute of the left image.
  left_alt -左侧图片的“ alt”属性。
right (required) – Url or id of the right image.*
 右（必填）-右图像的网址或ID。* 
right_alt – “alt” attribute of the right image.
  right_alt -右侧图片的“ alt”属性。
title – Optional title.
 标题 –可选标题。
width Optional width, i.e. 70%.
 宽度可选宽度，即70％。
classes – Additional CSS classes.
 类 –其他CSS类。 
Hint Use ‘hover’ to enable a mouse hover effect.
提示使用“悬停”启用鼠标悬停效果。
Shortcode Examples
简码示例
Just images:
只是图像：
[image-comparator left="http://.../left.jpg" right="http://...ight.jpg"][/image-comparator]
  [image-comparator left =“ http：//.../left.jpg” right =“ http：//...ight.jpg”] [/ image-comparator]
 
When you know the media id of the images you can do it like this:
当您知道图像的媒体ID时，您可以这样做：
[image-comparator left="123" right="456"][/image-comparator]
  [图像比较器left =“ 123” right =“ 456”] [/ image-comparator]
 
(This will also let you translate the media using WPML.)
（这也使您可以使用WPML翻译媒体。）
Enable hover effect:
    
启用悬停效果：
    
[image-comparator classes=”hover”][/image-comparator]
[image-comparator classes =“ hover”] [/ image-comparator] 
Full example:
完整示例：
[image-comparator    
  [图像比较器    
left="http://test.moewe.io/before-after-image-slider-lite/wp-content/uploads/sites/12/2015/03/cobra_blend_right1.jpg"    
left =“ http://test.moewe.io/before-after-image-slider-lite/wp-content/uploads/sites/12/2015/03/cobra_blend_right1.jpg”    
left_alt="The cobra is red"    
left_alt =“眼镜蛇是红色的”    
right="http://test.moewe.io/before-after-image-slider-lite/wp-content/uploads/sites/12/2015/03/cobra_blend_left.jpg"    
right =“ http://test.moewe.io/before-after-image-slider-lite/wp-content/uploads/sites/12/2015/03/cobra_blend_left.jpg”    
right_alt="The cobra is black"    
right_alt =“眼镜蛇是黑色的”    
width="70%" classes="hover"    
width =“ 70％” classes =“ hover”    
title="With hover (just move the mouse)"]
title =“随着鼠标悬停（只需移动鼠标）”]
[/image-comparator]
[/图像比较器]