Hey there! I'm facing an issue with implementing a Bootstrap carousel on my website. Despite trying out several examples from Bootsnip and even the one from the official Bootstrap website, the carousel slides are not working as expected. Any ideas on what could be causing this? At first, I suspected it might be due to the JavaScript link, but upon checking, everything seems fine.
HTML CODE
<!DOCTYPE html>
<html>
<head>
<title>The Beckwood - Scunthorpe</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Satisfy" rel="stylesheet">
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="assets/css/style.css">
</head>
<body>
<div id="wrap">
<div class="header-main">
<nav class="navbar navbar-default">
<div class="container">
<a class="navbar-brand" href="index.html" >
<img src="assets/img/logo.png">
</a>
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav navbar-right">
<li><a id="activenav" href="index.html">HOME</a></li>
<li><a href="menu.html">MENU</a></li>
<li><a href="gallery.html">GALLERY</a></li>
<li><a href="about.html">ABOUT</a></li>
<li><a href="book.html">BOOK A TABLE</a></li>
<li><a href="contact.html">CONTACT</a></li>
</ul>
</div>
</div>
</nav>
<div class="hero">
<h1 id="welcome">Welcome to The Beckwood.</h1>
<p>The Beckwood is a family run pub located in scunthorpe offering quality homemade food, carverys, events and live sports.</p>
<div class="btn btn-primary"><a href="menu.html">View Menu</a></div>
<div class="btn btn-primary"><a href="menu.html">Book a table</a></div>
</div>
</div>
</div>
...
...
<footer id="myFooter">
<div class="container">
<div class="row">
<div class="col-sm-3">
<img id="footerlogo" src="assets/img/logo.png">
</div>
<div class="col-sm-4">
<h5>Opening Times</h5>
<p class="opening hours"></p>
<p>Tue-Thu ~ 12:00 - 23:00</p>
<p>Friday ~ 12:00 - 00:00</p>
<p>Saturday ~ 12:00 - 00:00</p>
<p>Sunday ~ 12:00 - 22:30</p>
</div>
<div class="col-sm-1">
<h5>Navigation</h5>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="menu.html">Menu</a></li>
<li><a href="gallery.html">Gallery</a></li>
<li><a href="about.html">About</a></li>
<li><a href="book.html">Book</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div>
<div class="col-sm-4">
<div class="social-networks">
<a href="#" class="twitter"><i class="fa fa-twitter"></i></a>
<a href="#" class="facebook"><i class="fa fa-facebook"></i></a>
<a href="#" class="google"><i class="fa fa-instagram"></i></a>
</div>
<img class="center" src="assets/img/hygeine.png">
</div>
</div>
</div>
<div class="footer-copyright">
<p>© 2018 The Beckwood.</p>
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.2.1.min.js" type="text/javascript"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script src="validator.js"></script>
<script src="contact.js"></script>
</body>
</html>