머리글과 바닥 글을 변경/추가하면 그 후에 모두 편집하지 않고도 내 머리글과 바닥 글을 내 페이지에서 모든 페이지로 업로드하는 방법을 알아 내려고합니다. CSS와 JS를 HTML 페이지에 사용하고 있습니다. check the main page here 수 있습니다. header.php
,한 번에 모든 페이지에 동일한 머리글과 바닥 글을 추가하는 방법은 무엇입니까? HTML
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Da Montanha | Esporte e Aventura em Curitiba</title>
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
<link href="css/custom.css" rel="stylesheet" type="text/css">
<link href="css/bootstrap.css" rel="stylesheet" type="text/css">
<link href="css/color.css" rel="stylesheet" type="text/css">
<link href="css/responsive.css" rel="stylesheet" type="text/css">
<link href="css/owl.carousel.css" rel="stylesheet" type="text/css">
<link href="css/font-awesome.min.css" rel="stylesheet" type="text/css">
<link href="css/datepicker.css" rel="stylesheet" type="text/css">
<link href="css/iconmoon.css" rel="stylesheet" type="text/css">
<link rel="icon" href="images/favicon.ico" type="image/x-icon">
<link href="https://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css">
<link href="https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,700,600" rel="stylesheet" type="text/css">
</head>
<body class="campers-theme">
<div id="wrapper">
<header id="header">
<section class="topbar-section">
<div class="container">
<div class="col-md-6">
<div class="top-social">
<ul>
<li><a href="https://instagram.com/DaMontanhaAventura" target="_blank"><i class="fa fa-instagram" target="_blank"></i></a></li>
<li><a href="https://www.youtube.com/channel/UC2xNehgiy7AJzThAxQJqA3A" target="_blank"><i class="fa fa-youtube-square" target="_blank"></i></a></li>
<li><a href="https://facebook.com/DaMontanhaAventura" target="_blank"><i class="fa fa-facebook-f" target="_blank"></i></a></li>
</ul>
<a href="mailto:[email protected]" class="email"><i class="fa fa-envelope-o"></i><span class="__cf_email__" data-cfemail="">[email protected]</span></a> <script data-cfhash="f9e31" type="text/javascript">/* <![CDATA[ */!function(t,e,r,n,c,a,p){try{t=document.currentScript||function(){for(t=document.getElementsByTagName('script'),e=t.length;e--;)if(t[e].getAttribute('data-cfhash'))return t[e]}();if(t&&(c=t.previousSibling)){p=t.parentNode;if(a=c.getAttribute('data-cfemail')){for(e='',r='0x'+a.substr(0,2)|0,n=2;a.length-n;n+=2)e+='%'+('0'+('0x'+a.substr(n,2)^r).toString(16)).slice(-2);p.replaceChild(document.createTextNode(decodeURIComponent(e)),c)}p.removeChild(t)}}catch(u){}}()/* ]]> */</script></a> </div>
</div>
<div class="col-md-6">
<div class="register-login">
<ul>
<li><a href="login.html"><i class="fa fa-key"></i>Login</a></li>
<li><a href="registrar-se.html"><i class="fa fa-unlock"></i>Registrar-se</a></li>
</ul>
</div>
</div>
</div>
</section>
<section class="logo-section">
<div class="container">
<div class="col-md-6"><strong class="logo"><a href="index.html"><img src="images/logo.png" alt="logo"></a></strong></div>
<div class="col-md-6">
<div class="book-section"> <a href="booking-form.html" class="btn-book">Orçamentos</a>
<div class="number-box"> <i class="fa fa-whatsapp"></i>
<div class="number-text"> <span>Entre em Contato</span> <strong>41 99613 6600</strong> </div>
</div>
</div>
</div>
</div>
</section>
<div id="cp-slide-search" class="cp_side-search">
<form method="get">
<input type="text" placeholder="Digite o que procura..." required>
<button type="submit"><i class="fa fa-search"></i></button>
</form>
</div>
<section class="main-navigation">
<nav class="navbar navbar-inverse">
<div class="container">
<div class="col-md-12">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button>
</div>
<div class="nav-outer">
<div id="navbar" class="collapse navbar-collapse">
<ul class="nav navbar-nav" id="nav">
<li class="active"><a href="#">Início</a>
</li>
<li><a href="Aventuras.html">Aventuras<i class="fa fa-caret-down"></i></a></li>
<li><a href="events-large.html">Eventos</i></a></li>
<li><a href="products.html">Loja</i></a></li>
<li><a href="#">Páginas<i class="fa fa-caret-down"></i></a>
<ul>
<li><a href="blog-large.html">Blog</i></a></li></li>
<li><a href="booking-form.html">Orçamento</a></li>
<li><a href="team.html">Nosso Time</a></li>
<li><a href="gallery-1.html">Galeria de fotos</a></li>
<li><a href="testimonials.html">Depoimentos</a></li>
</ul>
</li>
<li><a href="about.html">Sobre Nós</a></li>
<li><a href="contact.html">Contato</a></li>
</ul>
</div>
<div class="nav-right-col">
<div class="cart-box-outer">
<div class="dropdown">
<button class="dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> <i class="fa fa-shopping-cart"></i> </button>
<ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
<li>
<div class="cart-box"> <strong class="title">Você tem <a href="products-detail.html">1 item(s)</a> no seu carrinho.</strong>
<div class="cart-row">
<div class="thumb"><a href="products-detail.html"><img alt="img" src="images/cart-img.jpg"></a></div>
<div class="text-box"> <a class="close" href="#"><i class="fa fa-close"></i></a> <a href="products-detail.html">BestWedding Camping Equipment</a> <strong class="amount">1 x R$59.00</strong> </div>
</div>
<strong class="subtotal">Subtotal: <span>R$59.00</span></strong>
<div class="btn-row"> <a class="btn-checkout" href="products-detail.html">Checkout</a> </div>
</div>
</li>
</ul>
</div>
</div>
<div class="top-search"> <a href="#" class="search-icon" id="search-push"><i class="fa fa-search"></i></a> </div>
</div>
</div>
</div>
</div>
</nav>
</section>
</header>
<footer id="footer">
<section class="instagram">
<div class="container">
<h2>We’re on Instagram</h2>
</div>
<ul>
<li><a href="#"><img src="images/instagram/instagram-img-1.jpg" alt="img"></a></li>
<li><a href="#"><img src="images/instagram/instagram-img-2.jpg" alt="img"></a></li>
<li><a href="#"><img src="images/instagram/instagram-img-3.jpg" alt="img"></a></li>
<li><a href="#"><img src="images/instagram/instagram-img-4.jpg" alt="img"></a></li>
<li><a href="#"><img src="images/instagram/instagram-img-5.jpg" alt="img"></a></li>
<li><a href="#"><img src="images/instagram/instagram-img-6.jpg" alt="img"></a></li>
<li><a href="#"><img src="images/instagram/instagram-img-7.jpg" alt="img"></a></li>
<li><a href="#"><img src="images/instagram/instagram-img-8.jpg" alt="img"></a></li>
</ul>
</section>
<section class="footer-section-1">
<div class="container">
<div class="row">
<div class="col-md-4"> <strong class="footer-logo"><a href="#"><img src="images/footer-logo.png" alt="logo"></a></strong>
<p>Lorem ipsum dolor sit amet, consectetur adipis elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullam laboris nisi ut aliquip ex ea commodo conseque Duis aute irure dolor in reprehenderit</p>
<a href="about.html" class="btn-style-2">Read More</a> </div>
<div class="col-md-4">
<h3>More Services</h3>
<div class="row">
<div class="col-md-6">
<div class="footer-box">
<ul>
<li><a href="#">Free Parking</a></li>
<li><a href="#">Free Wifi Area</a></li>
<li><a href="#">Restaurant</a></li>
<li><a href="#">Free Hot Shower</a></li>
<li><a href="#">Swimming Pool</a></li>
<li><a href="#">Shaded Pitches</a></li>
</ul>
</div>
</div>
<div class="col-md-6">
<div class="footer-box">
<ul>
<li><a href="#">Laundry</a></li>
<li><a href="#">Hairdresser</a></li>
<li><a href="#">Digs Area</a></li>
<li><a href="#">Barbecue Station</a></li>
<li><a href="#">Ping Pong Table</a></li>
<li><a href="#">Coffee Bar</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="col-md-4">
<div class="footer-box">
<h3>Contact us</h3>
<address>
<ul>
<li> <span><i class="fa fa-home"></i></span>
<div class="text-box">
<p>123 Lorem Ipsum Avenue,<br>
Campers Road, NY, U.S.A.</p>
</div>
</li>
<li> <span><i class="fa fa-phone"></i></span>
<div class="text-box">
<p>Call us for any Query</p>
<strong>44</strong> </div>
</li>
<li> <span><i class="fa fa-envelope-o"></i></span>
<div class="text-box">
<p>Send us email for any Information</p>
<a href="mailto:"><span class="__cf_email__" data-cfemail="caa3a4aca58aa9aba7baafb8b9e4a9a5a7">[email protected]</span><script data-cfhash='f9e31' type="text/javascript">/* <![CDATA[ */!function(t,e,r,n,c,a,p){try{t=document.currentScript||function(){for(t=document.getElementsByTagName('script'),e=t.length;e--;)if(t[e].getAttribute('data-cfhash'))return t[e]}();if(t&&(c=t.previousSibling)){p=t.parentNode;if(a=c.getAttribute('data-cfemail')){for(e='',r='0x'+a.substr(0,2)|0,n=2;a.length-n;n+=2)e+='%'+('0'+('0x'+a.substr(n,2)^r).toString(16)).slice(-2);p.replaceChild(document.createTextNode(decodeURIComponent(e)),c)}p.removeChild(t)}}catch(u){}}()/* ]]> */</script></a> </div>
</li>
<li> <span><i class="fa fa-clock-o"></i></span>
<div class="text-box">
<p>Office Timings</p>
<strong>09:00 - 19:00</strong> </div>
</li>
</ul>
</address>
</div>
</div>
</div>
</div>
</section>
<section class="footer-section-2">
<div class="container">
<div class="row">
<div class="col-md-6">
<div class="footer-socila">
<ul>
<li><a href="#"><i class="fa fa-twitter"></i>twitter</a></li>
<li><a href="#"><i class="fa fa-facebook-f"></i>facebook</a></li>
<li><a href="#"><i class="fa fa-google-plus"></i>google plus</a></li>
<li><a href="#"><i class="fa fa-linkedin-square"></i>linkedin</a></li>
</ul>
</div>
</div>
<div class="col-md-6"><strong class="copy">2016 © Campers, Powered by: <a href="http://crunchpress.com/" target="_blank">Crunchpress</a></strong></div>
</div>
</div>
</section>
</footer>
</div>
<script src="js/jquery-1.12.2.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/owl.carousel.min.js"></script>
<script src="js/jquery.noconflict.js"></script>
<script src="js/theme-scripts.js"></script>
<script src="js/zebra_datepicker.js"></script>
<script src="js/function.js"></script>
<script src="../../cdnjs.cloudflare.com/ajax/libs/waypoints/2.0.3/waypoints.min.js"></script>
<script src="js/jquery.counterup.min.js"></script>
<script src="js/jquery.countdown.min.js"></script>
<script src="js/custom.js"></script>
<script type="text/javascript">/* <![CDATA[ */(function(d,s,a,i,j,r,l,m,t){try{l=d.getElementsByTagName('a');t=d.createElement('textarea');for(i=0;l.length-i;i++){try{a=l[i].href;s=a.indexOf('/cdn-cgi/l/email-protection');m=a.length;if(a&&s>-1&&m>28){j=28+s;s='';if(j<m){r='0x'+a.substr(j,2)|0;for(j+=2;j<m&&a.charAt(j)!='X';j+=2)s+='%'+('0'+('0x'+a.substr(j,2)^r).toString(16)).slice(-2);j++;s=decodeURIComponent(s)+a.substr(j,m-j)}t.innerHTML=s.replace(/</g,'<').replace(/>/g,'>');l[i].href='mailto:'+t.value}}catch(e){}}}catch(e){}})(document);/* ]]> */</script></body>
<!-- Mirrored from html.crunchpress.com/campers/blog-details.html by HTTrack Website Copier/3.x [XR&CO'2014], Thu, 24 Nov 2016 12:21:10 GMT -->
</html>
당신은 내가 이것을 사용하는 방법에 대한 튜토리얼에 대한 검색을 원하지 예를 –
에 대한 handlebars.js 같은 템플릿 엔진을 필요로하기 위하여려고하고있다 PHP없이 수행 할 경우 몇 가지를 알고 있다면, 알려 주시기 바랍니다 ! 도와 주셔서 대단히 감사합니다! –