0

The question is simple, but maybe the answer not.

I am wondering how can copy and paste my <footer>CONTENT HERE</footer> created by Bootstrap in all my pages automatically.

Is there some easy way to do that? Because on the Internet I only can read very complex ways.

Thanks

Edison Biba
  • 4,384
  • 3
  • 17
  • 33
  • php include ? http://php.net/manual/en/function.include.php So you can create your footer in once place and add it to every page... – fernando Sep 01 '16 at 12:41
  • Hi @mariusz I have never worked with PHP.. but let me check it. –  Sep 01 '16 at 12:44

3 Answers3

1

You seem to be confusing how the page gets rendered. CSS is used for styling content which is already there provided by the HTML, so Bootstrap cannot help you here. Bootstarp did not "create" the content of the footer, it jsut gives it some styling.

Depending on the back-end technology you use for generating pages (maybe Jade, EJS, PHP?), you need to do some sort of inclusion of the footer template.

Lazar Ljubenović
  • 18,976
  • 10
  • 56
  • 91
1

Here is a sample structure of how to include the layout structure in HTML page.

<!DOCTYPE html>
<html>
<head>
<?php include('includes/meta.php'); ?>    <!--[if IE]>
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <![endif]-->
<?php include('includes/page_title.php') ?>
    <!-- BOOTSTRAP CORE STYLE  -->
<?php include('includes/header_scripts.php'); ?>
</head>
<body>
  <?php include('includes/header.php'); ?>
    <!-- LOGO HEADER END-->
  <?php include('includes/header_menu.php'); ?>

<!-- MENU SECTION END-->
    <div class="content-wrapper">
      <div class="container">
        <div class="row pad-botm">
            <div class="col-md-12">
                <h4 class="header-line">Blank Page</h4>
            </div>
        </div>
    </div>
    </div>
     <!-- CONTENT-WRAPPER SECTION END-->
  <?php include('includes/footer.php'); ?>
  <!-- FOOTER SECTION END-->
    <!-- JAVASCRIPT FILES PLACED AT THE BOTTOM TO REDUCE THE LOADING TIME  -->
    <!-- CORE JQUERY  -->
  <?php include('includes/footer_scripts.php'); ?>

</body>
</html>

footer.php

<footer>CONTENT HERE</footer>

Like this if you put a separate file and call it in all the other pages and it will be created dynamically in all the pages if you edit or change in this file alone.

Like the above way you need to create all the pages and include it into your project file.

Folder Structure

Project Folder

  • includes(folder)
    • header.php
    • footer.php
  • index.php(file)
halfer
  • 19,824
  • 17
  • 99
  • 186
Naresh Kumar P
  • 4,127
  • 2
  • 16
  • 33
0

You can accomplish this with jquery.

Place this code in index.html

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

Here is a stack overflow page that can help you with this

Also if you are using php this will be more simple 

<html>
<body>

<h1>Welcome to my home page!</h1>
<p>Some text.</p>
<p>Some more text.</p>
<?php include 'footer.php';?>

</body>
</html>

Just create your footer in footer.php

Here is w3schools post if you want to know more about php and how to include this.

Community
  • 1
  • 1
Edison Biba
  • 4,384
  • 3
  • 17
  • 33
  • 1
    Note that this is useful only while testing the website without an actual server. Otherwise you'd have to provide the people using your website with the `footer.html` file. – Lazar Ljubenović Sep 01 '16 at 12:50
  • Thank you very much. I will check out it :) –  Sep 01 '16 at 12:59