編譯html模板以完成網站

我習慣於使用ASP.NET和visual studio開發網站。我試圖在類似的問題上開發一個簡單的.html網站。我的意思是使用母版頁等，所以有代碼重用，可能會將這些模板文件部署到一組.html文件。編譯html模板以完成網站

例如

head.html

<script src="jquery.js" type="text/javascript"></script> 
<script src="jquery.ui.js" type="text/javascript"></script> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /> 
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js">

了header.html

<div data-role="header"> 
    <h1>Page Title</h1> 
</div><!-- /header -->

footer.html

<div data-role="footer"> 
    <h4>Page Footer</h4> 
</div><!-- /footer -->

的layout.html

<!DOCTYPE html> 
<html> 
<head> 
    <title>Page Title</title> 
     #include(head.html) 
</script> 
</head> 
<body> 

<div data-role="page"> 

    #include(header.html) 

    #include_body() 

    #include(footer.html) 

</div><!-- /page --> 
</body> 
</html>

的index.html

<div data-role="content"> 
    <p>Page content goes here.</p>  
</div><!-- /content -->

，並結合所有這些到一個輸出文件....

<!DOCTYPE html> 
<html> 
<head> 
    <title>Page Title</title> 

    <meta name="viewport" content="width=device-width, initial-scale=1"> 

    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /> 
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script> 
</head> 
<body> 

<div data-role="page"> 

    <div data-role="header"> 
     <h1>Page Title</h1> 
    </div><!-- /header --> 

    <div data-role="content"> 
     <p>Page content goes here.</p>  
    </div><!-- /content --> 

    <div data-role="footer"> 
     <h4>Page Footer</h4> 
    </div><!-- /footer --> 
</div><!-- /page --> 

</body> 
</html>

是否像這樣的東西存在嗎？我不熟悉紅寶石或任何東西...

來源

2013-02-08 Kyle

：一些基本的服務器滿足的要求，你可以做，例如。如果您熟悉ant並希望在部署之前編譯您的站點，請查看htmlBoilerplate構建腳本。最後，如果你覺得不好的屁股，並有資源來運行你自己的專用服務器，那麼是去紅寶石。 – mika

@mika以及我想使用純html的原因是僅僅將文件合併到服務器端處理。我只是想節省開發時間，而不是結合文件 – Kyle

看看SSI（服務器端包含）。您可以將HTML文件嵌入對方。 – isherwood

服務器端包含（SSI）可能會滿足您的需求。如果你是一個初學者，不想花錢，我會建議看WordPress的用PHP低成本和廣泛的文檔

<!--#include virtual="includes/my_file.html" -->

來源

2013-02-08 16:43:33 isherwood

你可以使用一個小小的PHP來使用includes來做到這一點。

頁眉，頁腳等可以作爲你的地方，你想顯示在該節中的所有新的.php文件被創建。

然後，在說你的index.php文件，你這樣做

<?php 
    include ('header.php'); 
?> 
<html> 
    <head> 
    </head> 
    <body> 
    </body> 
<?php 
    include ('footer.php'); 
?>

包含頁眉和頁腳PHP文件內的所有內容。

來源

2013-02-08 03:48:54

編譯html模板以完成網站

回答

相關問題