View source for Template:Before after

<div class="ba-slider" style="max-width:{{{width|640}}}px;">[[File:{{{before}}}|link=|alt={{{beforelabel|Then}}}]]<span class="ba-after-wrap">[[File:{{{after}}}|link=|alt={{{afterlabel|Now}}}]]</span><span class="ba-label ba-label-before">{{{beforelabel|Then}}}</span><span class="ba-label ba-label-after">{{{afterlabel|Now}}}</span></div><div class="ba-caption">{{{caption|}}}</div><noinclude>
'''Before/after image slider.''' Drag to wipe between a historic photo and a modern re-shot. Align the pair first with the free [https://nearmark.co.uk/rephoto Rephoto app] (download and how-to).

<pre>
{{Before after
| before = Old_photo.jpg
| after  = New_photo.jpg
| caption = Optional caption
| beforelabel = Then
| afterlabel  = Now
| width = 640
}}
</pre>

Both images should be the same size and crop. Full guide and a live demo: [[Help:Before-after slider]].
</noinclude>