すべてのページのヘッダーを1つのファイルから更新する

Dreamweaverのライブラリ要素はバグが多く、更新に関する多くの問題が発生するため、使用しないようにしました。他の誰もが、たとえば、各ページを手作業で編集することなく、どのようにすべてのHTMLページのヘッダーセクションを同時に更新しますか？すべてのページのヘッダーを1つのファイルから更新する

あなたがスタック上にPHPを持っている、とPHPを持つファイルを含めることができます：

出典

2017-10-31 user8758206

私はhttps://www.w3schools.com/howto/howto_html_include.aspを考えましたが、JSがないかどうか疑問に思っています。 – user8758206

サイトジェネレータ？ Jekyllは液体を使用していますが、インクルードステートメントがあります。https://jekyllrb.com/docs/includes/ – Asthmatic

もっと簡単な方法があると思ったのですが、 – user8758206

はここではないのJavaScriptのある機能が含まれ、3つの方法だ

<?php 
include('header.html');

長い時間前に標準にするために使用この方法で新しいサイトはもうこれをやってはいけません。

ジキルのようなサイトジェネレータを使用できます。ジキルは世代に液体文を解析します

は

{% include header.html %}

これは、サイトの世代の種類が

あなたは角のように、JavaScriptのフレームワークを使用することが近代的であるstaticcms。角度で、あなたのページは、コンテナのdivの内側に配置されます、そしてあなたは、コンテナの外のすべてのページ（ヘッダー、ナビゲーション、フッター）に現れるものを置くことができます。

個人的に

<!DOCTYPE html> 
<html> 
<head> 
    <!-- SCROLLS --> 
    <!-- load bootstrap and fontawesome via CDN --> 
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" /> 
    <link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.0.0/css/font-awesome.css" /> 

    <!-- SPELLS --> 
    <!-- load angular and angular route via CDN --> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.min.js"></script> 
     <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular-route.js"></script> 
    <script src="script.js"></script> 
</head> 
<body> 

    <!-- HEADER AND NAVBAR --> 
    <header> 
     <nav class="navbar navbar-default"> 
     <div class="container"> 
      <div class="navbar-header"> 
       <a class="navbar-brand" href="/">Angular Routing Example</a> 
      </div> 

      <ul class="nav navbar-nav navbar-right"> 
       <li><a href="#"><i class="fa fa-home"></i> Home</a></li> 
       <li><a href="#about"><i class="fa fa-shield"></i> About</a></li> 
       <li><a href="#contact"><i class="fa fa-comment"></i> Contact</a></li> 
      </ul> 
     </div> 
     </nav> 
    </header> 

    <!-- MAIN CONTENT AND INJECTED VIEWS --> 
    <div id="main"> 

     <!-- angular templating --> 
     <!-- this is where content will be injected --> 

    </div> 

</body> 
</html>

https://scotch.io/tutorials/single-page-apps-with-angularjs-routing-and-templating

、私は角度を使用します。職場では、私たちのサイトはJekyllで構築されたアプリケーションに反応します。私はFacebookがPHP、またはCodeIgniterのようなPHPフレームワークを使用していると仮定します。

出典

2017-10-31 15:30:23 Asthmatic

は、実際にはいくつかのファイルを含めるだけです。もっと単純な解決法はないと私は非常に驚いています。私はむしろこれらのページの速度に影響するAngularなどの外部ライブラリを含める必要はありません – user8758206

もちろん、それはHTMLとdivを埋めるためにjavascriptを使用する方法があると言ったように、唯一の方法ではありません。しかし、あなたの質問は、他の人たちがどのようにそれをやるのかを尋ねました。そして、これは私がwebdevsビルドが業界に含まれているのを見た最も一般的な方法です – Asthmatic

すべてのページのヘッダーを1つのファイルから更新する

答えて

関連する問題