Hi friends,
Firstly, I appreciate your tremendous work and interactive learning
I have purchased a responsive multi purpose HTML5 theme package and it is great. I almost have customized all the desired pages of concern out of it. the only issue I have right now is with footer. I finally choosed one of the package footers and customized it to my needs, I just removed the un-necessary parts of it and included others. I didn’t modify the style sheet or anything else. I just edited the footer, and now it looks like the following when I put it in empty HTML page.
My question: with all the staff and various pages included in the theme package, I’m confused how to link this footer to all the pages I made without having to copy and paste manually all the code to all the pages. and also to make it easier for me in the future when I add or remove an item from the footer, then I can make it from the footer file without doing that with all pages which it will take a lot of time.
Please note that I’m familiar now with HTML and CSS and I use code editor along with Dreamweaver v2021 which works perfectly with your templates without issues.
Also, is their HTML code I can include in the head side of any page which will define the footer I designed below and will load it from the store location
I really appreciate your kind assistance in this regards
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>footer</title>
</head>
<!-- Stylesheets
============================================= -->
<link href="https://fonts.googleapis.com/css?family=Lato:300,400,400i,700|Poppins:300,400,500,600,700|PT+Serif:400,400i&display=swap" rel="stylesheet" type="text/css" />
<link rel="stylesheet" href="css/bootstrap.css" type="text/css" />
<link rel="stylesheet" href="style.css" type="text/css" />
<link rel="stylesheet" href="css/dark.css" type="text/css" />
<link rel="stylesheet" href="css/font-icons.css" type="text/css" />
<link rel="stylesheet" href="css/animate.css" type="text/css" />
<link rel="stylesheet" href="css/magnific-popup.css" type="text/css" />
<link rel="stylesheet" href="css/custom.css" type="text/css" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<body>
<footer>
<!-- Footer
============================================= -->
<footer id="footer" class="dark" style="background: url('images/footer-bg.jpg') repeat; background-size: cover;">
<div class="container">
<!-- Footer Widgets
============================================= -->
<div class="footer-widgets-wrap">
<div class="row col-mb-50">
<div class="col-md-8">
<div class="widget clearfix">
<div class="row col-mb-30">
<div class="col-6 col-lg-3 widget_links">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">FAQs</a></li>
<li><a href="#">Support</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
<div class="col-6 col-lg-3 widget_links">
<ul>
<li><a href="#">test</a></li>
<li><a href="#">test</a></li>
<li><a href="#">test</a></li>
<li><a href="#">test</a></li>
<li><a href="#">test</a></li>
</ul>
</div>
<div class="col-6 col-lg-3 widget_links">
<ul>
<li><a href="#">test</a></li>
<li><a href="#">test</a></li>
<li><a href="#">test</a></li>
<li><a href="#">test</a></li>
<li><a href="#">test</a></li>
</ul>
</div>
<div class="col-6 col-lg-3 widget_links">
<ul>
<li><a href="#">test</a></li>
<li><a href="#">test</a></li>
<li><a href="#">test</a></li>
<li><a href="#">test</a></li>
<li><a href="#">test</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="col-md-4"> </div>
</div>
</div><!-- .footer-widgets-wrap end -->
</div>
<!-- Copyrights
============================================= -->
<div id="copyrights">
<div class="container">
<div class="row justify-content-between col-mb-30">
<div class="col-12 col-lg-auto text-center text-lg-left">
<div class="copyrights-menu copyright-links clearfix">
</div>
Copyrights © 2006-2021 test<br>
test<br>
Published by test
</div>
<div class="col-12 col-lg-auto text-center text-lg-right">
<p class="text-left">Connect withtest<br>
founder and publisher</p>
<a href="https://www.linkedin.com/in/test" class="social-icon inline-block si-small si-borderless mb-0 si-twitter">
<i class="icon-linkedin"></i>
<i class="icon-linkedin"></i><br>
</a>
<a href="https://www.youtube.com/user/test" class="social-icon inline-block si-small si-borderless mb-0 si-gplus">
<i class="icon-youtube"></i>
<i class="icon-youtube"></i>
</a>
<a href="https://.blogspot.com/" class="social-icon inline-block si-small si-borderless mb-0 si-pinterest">
<i class="icon-blogger"></i>
<i class="icon-blogger"></i>
</a>
<a href="https://twitter.com/test" class="social-icon inline-block si-small si-borderless mb-0 si-vimeo">
<i class="icon-twitter"></i>
<i class="icon-twitter"></i>
</a>
<a href="mailto:e@test.com" class="social-icon inline-block si-small si-borderless mb-0 si-github">
<i class="icon-mail"></i>
<i class="icon-mail"></i>
</a>
</div>
</div>
</div>
</div><!-- #copyrights end -->
</footer><!-- #footer end -->
</div><!-- #wrapper end 'images/footer-bg.jpg'-->
<!-- Go To Top
============================================= -->
<div id="gotoTop" class="icon-angle-up"></div>
<!-- JavaScripts
============================================= -->
<script src="js/jquery.js"></script>
<script src="js/plugins.min.js"></script>
<!-- Footer Scripts
============================================= -->
<script src="js/functions.js"></script>
</footer>
</body>
</html>