Title: Before After Pictures
Author: host1967
Published: <strong>16. Februar 2011</strong>
Last modified: 25. Februar 2011

---

Plugins suchen

Dieses Plugin wurde **nicht mit den 3 neuesten Hauptversionen von WordPress getestet**.
Es wird möglicherweise nicht mehr gepflegt oder unterstützt und kann bei der Verwendung
mit neueren WordPress-Versionen zu Kompatibilitätsproblemen führen.

![](https://s.w.org/plugins/geopattern-icon/beforeafter-pictures.svg)

# Before After Pictures

 Von [host1967](https://profiles.wordpress.org/host1967/)

[Herunterladen](https://downloads.wordpress.org/plugin/beforeafter-pictures.0.2.1.zip)

 * [Details](https://de.wordpress.org/plugins/beforeafter-pictures/#description)
 * [Rezensionen](https://de.wordpress.org/plugins/beforeafter-pictures/#reviews)
 *  [Installation](https://de.wordpress.org/plugins/beforeafter-pictures/#installation)
 * [Entwicklung](https://de.wordpress.org/plugins/beforeafter-pictures/#developers)

 [Support](https://wordpress.org/support/plugin/beforeafter-pictures/)

## Beschreibung

Before After Pictures plugin integrates [jQuery Before/After Plugin](http://www.catchmyfame.com/2009/06/25/jquery-beforeafter-plugin/)
in the wordpress. It can be used to show the difference between edited and original
photo, before and after photos of changes, etc.

Please check ‚Other Notes‘ for the Usage instructions to see how to use it on your
blog

Demosites: http://www.ansichten-und-aussichten.de/beforeafter-pictures/

[Operation with default theme](http://www.ansichten-und-aussichten.de/beforeafter-pictures/)

[Operation with TwentyTen theme](http://www.ansichten-und-aussichten.de/beforeafter-pictures/)

Author info:
 Holger Stroeder

#### Limitations

 * Both iomages must have the same size in pixels
 * Before/After Pictures works only on single posts and pages

#### Usage

 * Set the default options on the admin page of the plugin
 * Write the content of your post other than the images
 * Upload the before and after images to wordpress or any other webspace and remember
   the path/url
 * Switch to ‚Visuell‘ mode of the post editor area
 * Click ‚Before/After Pictures‘ button
 * Fill in the information in the popup screen (id, before and after image must 
   be set), empty attributes can be deleted

or

 * Switch to ‚HTML‘ mode of the post editor area
 * Click ‚Before/After Pictures‘ button
 * Fill in the information in the editor area (id, before and after image must be
   set), empty attributes can be deleted
 * Parameters:
    [beforeafterpics id=“ image_before=“ image_after=“ animateintro=“
   introdelay=“ introduration=“ showfulllinks=“ /]

id: If you want to place multiple [beforeafter] sections on one page, every shortcode
must have an unique id. (required if more than one image in the post)
 image_before:
path/url to the image file must be set. (required) image_after: path/url to the 
image file must be set. (required) animateintro: Whether or not to have the drag
bar start completely to the right of the container and gradually move by itself 
to the midpoint. (optional) introdelay: If animateIntro is true, the number of milliseconds
to wait before beginning the automatic drag bar move to the center of the image.(
optional) introduration: If animateIntro is true, the number of milliseconds it 
will take for the drag bar to go from the right side of the image to the middle 
of the image. (optional) showfulllinks: Whether or not to display links below the
image that a visitor can click on that will automatically show the full before or
full after image. (optional)

## Screenshots

[⌊Before/After Pictures button in Visual Editor⌉⌊Before/After Pictures button in
Visual Editor⌉[

Before/After Pictures button in Visual Editor

[⌊Before/After Pictures popup screnn⌉⌊Before/After Pictures popup screnn⌉[

Before/After Pictures popup screnn

[⌊Before/After Pictures button in HTML Editor⌉⌊Before/After Pictures button in HTML
Editor⌉[

Before/After Pictures button in HTML Editor

[⌊Before/After Pictures shortcodes in editor⌉⌊Before/After Pictures shortcodes in
editor⌉[

Before/After Pictures shortcodes in editor

[⌊Before/After Pictures option page⌉⌊Before/After Pictures option page⌉[

Before/After Pictures option page

[⌊Before/After Pictures example⌉⌊Before/After Pictures example⌉[

Before/After Pictures example

## Installation

#### Requirements

 * WordPress: 2.9 or newer

#### Basic Installation

 * Plugin folder in the WordPress plugins folder must be `beforeafter-pictures`
 * Upload folder `before-after-pics` to the `/wp-content/plugins/` directory
 * Activate the plugin through the ‚Plugins‘ menu in WordPress
 * Check Before/After Pictures Option page
 * Check out ‚Other Notes‘ for usage instruction.

## FAQ

 * Example delivered: Just copy and paste the following into a new article and check
   if everything is fine…
    [beforeafterpics id=’1′ image_before=’/wp-content/plugins/
   beforeafter-pictures/images/example-before.jpg‘ image_after=’/wp-content/plugins/
   beforeafter-pictures/images/example-after.jpg‘ /]

## Rezensionen

Zu diesem Plugin liegen noch keine Rezensionen vor.

## Mitwirkende und Entwickler

„Before After Pictures“ ist Open-Source-Software. Folgende Menschen haben an diesem
Plugin mitgewirkt:

Mitwirkende

 *   [ host1967 ](https://profiles.wordpress.org/host1967/)

[Übersetze „Before After Pictures“ in deine Sprache.](https://translate.wordpress.org/projects/wp-plugins/beforeafter-pictures)

### Interessiert an der Entwicklung?

[Durchstöbere den Code](https://plugins.trac.wordpress.org/browser/beforeafter-pictures/),
sieh dir das [SVN-Repository](https://plugins.svn.wordpress.org/beforeafter-pictures/)
an oder abonniere das [Entwicklungsprotokoll](https://plugins.trac.wordpress.org/log/beforeafter-pictures/)
per [RSS](https://plugins.trac.wordpress.org/log/beforeafter-pictures/?limit=100&mode=stop_on_copy&format=rss).

## Änderungsprotokoll

#### 0.2.1

 * enabled for usage on single pages

#### 0.2

 * minor changes to fix WordPress 3.1 issue(s)
 * added activation and deactivation functions for options
 * default values for option page delivered

#### 0.1

 * initial release

## Meta

 *  Version **0.2.1**
 *  Zuletzt aktualisiert **vor 16 Jahren**
 *  Aktive Installationen **10+**
 *  WordPress-Version ** 2.9 oder höher **
 *  Getestet bis **3.1.4**
 *  Sprache
 * [English (US)](https://wordpress.org/plugins/beforeafter-pictures/)
 * Schlagwörter
 * [after](https://de.wordpress.org/plugins/tags/after/)[before](https://de.wordpress.org/plugins/tags/before/)
   [images](https://de.wordpress.org/plugins/tags/images/)[photo effects](https://de.wordpress.org/plugins/tags/photo-effects/)
   [photos](https://de.wordpress.org/plugins/tags/photos/)
 *  [Erweiterte Ansicht](https://de.wordpress.org/plugins/beforeafter-pictures/advanced/)

## Bewertungen

Es wurden noch keine Rezensionen eingereicht.

[Deine Rezension](https://wordpress.org/support/plugin/beforeafter-pictures/reviews/#new-post)

[Alle Rezensionen anzeigen](https://wordpress.org/support/plugin/beforeafter-pictures/reviews/)

## Mitwirkende

 *   [ host1967 ](https://profiles.wordpress.org/host1967/)

## Support

Möchtest du etwas mitteilen? Brauchst du Unterstützung?

 [Support-Forum anzeigen](https://wordpress.org/support/plugin/beforeafter-pictures/)

## Spenden

Möchtest du die Weiterentwicklung dieses Plugins unterstützen?

 [ Für dieses Plugin spenden ](http://www.ansichten-und-aussichten.de/beforeafter-pictures/)