Is it possible to assemble standard layout for HTML pages?

Navigation
4

If I have two pages: pagina1.html and pagina2.html , which are very similar, can I use a layout.html page to determine common elements of each page? Also avoid repetition of tags as it happens in projects Asp.Net MVC, Ruby on Rails, etc ...

    
asked by anonymous 05.06.2015 / 04:54

3 answers

1

///// javascript function 

function url(link){
        document.getElementById("conteudo").setAttribute('src','paginas/'+link);
    }

//// HTML links 

<div onclick="url('inicio.html')">Início</div>
<div onclick="url('sobre.html')">Sobre</div>
<div onclick="url('contato.html')">contato</div>

///// IFRAME PLACE BETWEEN THE HEADER AND THE FOOTER OF YOUR WEBSITE WHERE THE CONTENT WILL APPEAR. 

<iframe id="conteudo">
</iframe>

REMEMBERING THAT YOU WILL TAKE IT BY CSS TO REMOVE THE EDGE OF THE IFRAME AND THE ROLLING BAR ALSO BE PREFERED.

    
14.08.2015 / 15:06
0

You can use Angular.js and Angular-route.js, would look like this:

HTML Page 

<html ng-app="TesteApp">
   <head>
     <meta charset="UTF-8">
     <title>Teste Rotas</title>
   </head>        
   <body>
    <a href="#/pagina-1">Pagina 1</a>
    <a href="#/pagina-2">Pagina 2</a>        
    <h1> Master Page </h1>

    <div ng-view>
      <!--Dentro da div ng-view , será renderizado nossas partials-->
    </div>

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.min.js"></script><scriptsrc="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular-route.js"></script>
    <script src="main.js"></script>
  </body>

Main.js file 

//Modulo do app
var app = angular.module("TesteApp", ['ngRoute']);

 //Configuração das rotas
 app.config(function ($routeProvider) {
   $routeProvider        
      .when("/pagina-1", { //URL
          templateUrl: "caminho/pagina-1.html", //Caminho da pagina HTML
          controller: "nomeController" //controller que será usado
      })
    .when("/pagina-2", { //URL
        templateUrl: "caminho/pafina-2.html", //Caminho da pagina HTML
        controller: "nomeController" //controller que será usado
    })
   .otherwise({ redirectTo: '/pagina-1' }); //Se não for nenhuma url , redireciona para esta
 });

    app.controller("nomeController",function($scope){ //Controller
       $scope.mensagem = "Olá"
 });

And as the URL changes, the pages will be rendered within the div with ng-view.

    
18.09.2015 / 01:02
-1

I usually use a standard page that I call MasterPage.html and add my fixed elements in it, and the other pages I'll call via include the way I need it.

Example has the default page with my Header and my fixed Footer and when clicking on some link in my menu I call the referring page that contains only the information on the page.

    
13.08.2015 / 18:57
maven configuration [closed] Is there a free database for product barcodes? [closed]