How To: Add/Create "Before & After" blocks in SquareSpace

So I recently wanted to add a photo block that would allow my visitors to be able to slide back and forth a photograph so they can see before and afters. I personally use SquareSpace for my website and soon found out that it's not possible straight out of SS. A quick google search and I found this awesome page that explains how to install some code that would allow for this functionality to work on SS. As I started I was a little confused, I am by no means a coder, strictly a wedding photographer so when I read the information I freaked out a little. I screen recorded my process so that I could later on show you all, who would want to do this without the headache, to do it onto your own site! It was pretty easy but some of the wording could have been better explained. So again I made this so that you could see how to do it. 

The website with all the code, information and who really deserves the credit is:
MassExodus < it's hyper-linked