wavifyという波を表現するjQueryプラグインをWordPressで使うための表記方法を知りたいです

wavifyという波を表現するjQueryのプラグインがあります。

HTMLで作成したサイトで使用するときちんと動くのですが、WordPressに移行させると動きません。
テンプレートタグを使ったり、function.phpでなんとかしようとしてみたりしましたが、初心者のためきちんと理解できていないせいもあり、動きません。

お詳しい方、WordPress用にどこをどう書き直すべきか、詳しく教えて頂けましたらとても嬉しいです。

以下、元々のコードになります。

HTML
1<body>
2
3  <svg version="1.1" xmlns="http://www.w3.org/2000/svg"><path id="wave" d=""/></svg>
4
5  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
6  <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/2.0.1/TweenMax.min.js"></script>
7  <script src="js/jquery.wavify.js"></script>
8  <script type="text/javascript" src="wavify.js"></script>
9</body>

CSS
1svg {
2  height: 350px;
3  width: 100%;
4  position: absolute;
5  top: 250px;
6  left: 0;
7}

Js
1$('#wave').wavify({
2  height: 60,
3  bones: 5,
4  amplitude: 40,
5  color: '#08a9e4',
6  speed: .20
7});

ちなみに、スタイルシートの読み込みは、以下のようにしております。
他のものに対してはきちんとスタイルがあたっています。

HTML
1<head>
2
3  <!-- CSS -->
4  <link rel="stylesheet" href="https://unpkg.com/ress@4.0.0/dist/ress.min.css">
5  <!-- <link rel="stylesheet" href="style.css"> -->
6  <link rel="stylesheet" href="<?php echo get_stylesheet_uri(); ?>">
7</head>

どうぞ、よろしくお願い致します　m(__)m