jQueryでプログレス表示機能を実装したいが、エラーが出てうまく表示されない！

前提・実現したいこと

jQuery最高の教科書を見ながら、プログレス表示機能を実装していました。
一瞬数字の表示などはされるのですが、その後のヘッダーなどのレイアウトが崩れてしまいます。
検証ツールで見てみると、
Uncaught ReferenceError: imagesLoaded is not defined
と出ていました。
imageLoadedプラグインをうまくできていないのが原因と思われますが、解決方法がわかりませんでした。

発生している問題・エラーメッセージ

以下のコードを書いているところにUncaught ReferenceError: imagesLoaded is not definedとエラー文が出ていました。

imgLoad = imagesLoaded('body'),

html
1    <div class="progress" id="progress">
2      <span class="progress-bar"></span>
3      <span class="progress-text">0%</span>
4    </div>

css
1.progress {
2  background-color: rgb(0, 0, 0);
3  color: rgb(255, 255, 255);
4  height: 100%;
5  position: absolute;
6  width: 100%;
7}
8.progress-bar {
9  border-top: 1px solid rgb(160, 160, 160);
10  position: absolute;
11  top: 50%;
12  width: 0%;
13}
14.progress-text {
15  font-family: "Menlo", "Consolas", monospace;
16  font-size: 12px;
17  margin-top: 10px;
18  position: absolute;
19  text-align: center;
20  top: 50%;
21  width: 100%;
22}
23.progress-complete .progress-bar {
24  border-top-color: rgb(255, 255, 255);
25}
26

試したこと

imageLoadedをインストールする必要があるのかと思い、
https://imagesloaded.desandro.com/
上のサイトのダウンロードというところにある2つのファイルを制作中のファイルに入れてみましたが変わりませんでした。
入れる場所などが決まっている場合は教えていただきたいです。
imagesloaded.pkgd.min.jsとimagesloaded.pkgd.jsという名前の2つのファイルです。