Title: CPS | Before / After Images
Author: Surbma
Published: <strong>2018 年 1 月 1 日</strong>
Last modified: 2025 年 1 月 1 日

---

搜索插件

![](https://ps.w.org/surbma-before-after/assets/banner-772x250.jpg?rev=2626251)

![](https://s.w.org/plugins/geopattern-icon/surbma-before-after_787661.svg)

# CPS | Before / After Images

 作者：[Surbma](https://profiles.wordpress.org/surbma/)

[下载](https://downloads.wordpress.org/plugin/surbma-before-after.2.2.zip)

 * [详情](https://cn.wordpress.org/plugins/surbma-before-after/#description)
 * [评价](https://cn.wordpress.org/plugins/surbma-before-after/#reviews)
 *  [安装](https://cn.wordpress.org/plugins/surbma-before-after/#installation)
 * [开发进展](https://cn.wordpress.org/plugins/surbma-before-after/#developers)

 [支持](https://wordpress.org/support/plugin/surbma-before-after/)

## 描述

With this plugin, you can display two similar images in one frame with a bar in 
the middle. So visitors can see the difference by moving the bar from left to right.
Typical usecase is, when you want to show a “before-after” state with two images.

The shortcode: `[surbma-before-after before_src="" before_alt="" after_src="" after_alt
="" with="" height=""]`

Parameters:

 * before_src: This is the URL of the left image. REQUIRED
 * before_alt: This is the ALT attribute of the left image.
 * after_src: This is the URL of the right image. REQUIRED
 * after_alt: This is the ALT attribute of the right image.
 * with: This is the width of the image.
 * height: This is the height of the image.

Only the two src parameters are required, the rest of them are optional.

**Do you want to contribute or help improving this plugin?**

You can find it on GitHub: [https://github.com/Surbma/surbma-before-after](https://github.com/Surbma/surbma-before-after)

**You can find my other plugins and projects on GitHub:**

[https://github.com/Surbma](https://github.com/Surbma)

Please feel free to contribute, help or recommend any new features for my plugins,
themes and other projects.

**Do you want to know more about me?**

Visit my webpage: [Surbma.com](https://surbma.com/)

## 安装

 1. Upload `surbma-before-after` folder to the `/wp-content/plugins/` directory
 2. Activate the Surbma – Before / After Images plugin through the ‘Plugins’ menu in
    WordPress
 3. That’s it. Now you can use the shortcodes. 🙂

## 常见问题

### What does Surbma mean?

It is the reverse version of my last name. 😉

## 评价

此插件暂无评价。

## 贡献者及开发者

「CPS | Before / After Images」是开源软件。 以下人员对此插件做出了贡献。

贡献者

 *   [ Surbma ](https://profiles.wordpress.org/surbma/)
 *   [ CherryPick Studios ](https://profiles.wordpress.org/cherrypickstudios/)

[帮助将「CPS | Before / After Images」翻译成简体中文。](https://translate.wordpress.org/projects/wp-plugins/surbma-before-after)

### 对开发感兴趣吗?

您可以[浏览代码](https://plugins.trac.wordpress.org/browser/surbma-before-after/)，
查看[SVN仓库](https://plugins.svn.wordpress.org/surbma-before-after/)，或通过[RSS](https://plugins.trac.wordpress.org/log/surbma-before-after/?limit=100&mode=stop_on_copy&format=rss)
订阅[开发日志](https://plugins.trac.wordpress.org/log/surbma-before-after/)。

## 更新日志

#### 2.2

Release date: 2025-01-01

FIX

 * Changed textdomain hook to init.
 * Security fix for shortcode: parameters are properly escaped.

OTHER

 * Code optimizations.

#### 2.1

Release date: 2020-09-15

FIX

 * Fixes jQuery call, so it is compatible with latest versions of WordPress (5.5)
   and jQuery.

TWEAK

 * Checked compatibility with the latest version of WordPress.
 * Changed minimum WordPress version and PHP requirements.

#### 2.0

Release date: 2019-07-19

With this version, the plugin is rebranded to CherryPick Studios or CPS with the
short version. CherryPick Studios is created by me, Surbma, so everything is the
same, but better. 🙂

NEW

 * Plugin author and contributor has changed to CherryPick Studios.

TWEAK

 * Checked compatibility with the latest version of WordPress.

#### 1.4

 * NEW – Plugin name change.

#### 1.3

 * TWEAK – Modified description and name symbols.

#### 1.2

 * TWEAK – Simple versioning.
 * TWEAK – Modified description and name symbols.

#### 1.1.0

 * Updated scripts and styles.
 * Added more description.
 * Code optimization.

#### 1.0.0

 * Initial release.

## 商业插件

该插件免费，但提供额外的付费商业升级或支持服务。 [查看帮助](https://www.facebook.com/groups/CherryPickStudios/)

## 额外信息

 *  版本 **2.2**
 *  最后更新：**1 年前**
 *  活跃安装数量 **10+**
 *  WordPress 版本 ** 5.5 或更高版本 **
 *  已测试的最高版本为 **6.7.5**
 *  PHP 版本 ** 7.4 或更高版本 **
 *  语言
 * [English (US)](https://wordpress.org/plugins/surbma-before-after/)
 * 标签
 * [after](https://cn.wordpress.org/plugins/tags/after/)[before](https://cn.wordpress.org/plugins/tags/before/)
   [image](https://cn.wordpress.org/plugins/tags/image/)[picture](https://cn.wordpress.org/plugins/tags/picture/)
   [surbma](https://cn.wordpress.org/plugins/tags/surbma/)
 *  [高级视图](https://cn.wordpress.org/plugins/surbma-before-after/advanced/)

## 评级

尚未提交反馈。

[Your review](https://wordpress.org/support/plugin/surbma-before-after/reviews/#new-post)

[查看全部评论](https://wordpress.org/support/plugin/surbma-before-after/reviews/)

## 贡献者

 *   [ Surbma ](https://profiles.wordpress.org/surbma/)
 *   [ CherryPick Studios ](https://profiles.wordpress.org/cherrypickstudios/)

## 支持

有话要说吗？是否需要帮助？

 [查看支持论坛](https://wordpress.org/support/plugin/surbma-before-after/)

## 捐助

您愿意支持这个插件的发展吗?

 [ 捐助此插件 ](https://surbma.com/donate/)