Add Header and Footer to all pages

Asked

Viewed 4,960 times

0

I am creating a new version of a city guide portal, there are several pages and currently the staff uses the include of the . shtml:

include virtual="../header.htm"

include virtual="../footer.htm"

Is there any other way to pull the header and the footer on all pages, without using . shtml’s include and PHP’s include? Because all pages need to be in . html, the site has to be static, I can’t use wordpress or any cms... I’ve tried jquery include:

$(function(){
  $("#header").load("header.html"); 

  $("#footer").load("footer.html"); 
});

But the final code does not appear the full page in the source code, if I give a CTRL+U to see the source code, the header will be as div id="header" and /div, without appearing your content in the source code, this may generate some problem for SEO, no?

How do you include the header and the footer on all pages of websites that you develop?

Ah, and here in the company use windows...

php jquery html header

2 answers

1

include virtual is supported in IIS, but has cases that do not work in files .php, php itself already has two functions to include files, include and require.

For example:

<?php
require '../header.htm';

require '../footer.htm';
?>

However, I recommend you start thinking about the MVC (Model, View and Controller) architecture, read more on: What is MVC(Model, View, Controller)?

Note: I don’t recommend using jQuery to "include" for two reasons:

  1. The page will resize what will cause a bounce effect on the content and scroll
  2. There will be 3 requests and depending on the server can take almost 1 second to load each of them which would make it look like things are broken

  • so, today they already use include virtual . shtml, however, no longer want to use, and also do not want the site to be . php, they want everything in . html, is it possible to include header and footer using only html? or some javascript resource, not being the jquery that has already been mentioned above? , what is the good practice to include header/footer on a static site? only using include and require from php itself?

  • @Allyssondossantos all in html? But then why the [php] tag on your question? html is static, I don’t understand how everything will be in html.

  • I also did not understand why it is all in html, however, they want so... but then, the best option would be to use php include?

  • @Allyssondossantos The best short-term option would be php include or require. In the long term it would be the MVC that is an architecture (a way of doing things), see: http://answall.com/questions/55486/o-que-é-mvcmodel-view-controller

0

You could do this with jQuery. Put this code on index.html

<html>
   <head>
      <title></title>
      <script src="//code.jquery.com/jquery-1.10.2.js"></script>
      <script>
         $(function () {
            $("#header").load("header.html");
            $("#footer").load("footer.html");
         });
      </script>
   </head>
   <body>
      <div id="header"></div>
      <!--Remaining section-->
      <div id="footer"></div>
   </body>
</html>

Allysson, using this form does not cause any problem in matter of SEO since the page header.html and footer.html and also indexed by search engines, and only this your factor against this type of abortion using jQuery?

Browser other questions tagged php jquery html header

You are not signed in. Login or sign up in order to post.