Este questionamento é muito grande e passível de múltiplas respostas porem não obtive respostas em fórum de discussões. Bem gostaria de saber como construir a seguinte pagina utilizando PHP (mas construi utilizando html):
ela possui o seguinte código HTML:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Titulo</title>
<script type="text/javascript" src="../Bootstrap/js/jquery-1.11.1.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript" src="../Bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="../datepicker/js/bootstrap-datepicker.js"></script>
<script type="text/javascript" src="../Jquery-Validate/jquery.validate.min.js"></script>
<script type="text/javascript" src="../Javascript/ActionsJS.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="../Bootstrap/css/bootstrap.min.css" media="screen" />
<link rel="stylesheet" type="text/css" href="../datepicker/css/datepicker.css" media="screen" />
<link rel="stylesheet" type="text/css" href="../CSS/StyleSheet.css"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top" role="navigation"><!--------- START Navbar --------->
<div class="container">
<div class="navbar-header"><!-- START Brand and toggle get grouped for better mobile display -->
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Meu Site</a>
</div><!-- END Brand and toggle get grouped for better mobile display -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"><!-- START Collect the nav links, forms, and other content for toggling -->
<ul class="nav navbar-nav navbar-right">
<li><button type="button" class="btn btn-info navbar-btn" data-toggle="modal" data-target="#login_modal">Login</button></li>
<li><button type="button" class="btn btn-info navbar-btn" data-toggle="modal" data-target="#create_account_modal">Create Account</button></li>
</ul>
<form class="navbar-form span7 text-center" role="search" id="search-form" action="../action.php" method="get">
<div class="input-group">
<input class="form-control" type="text" id="search_input" name="search_input" placeholder="Search" />
<div class="input-group-btn">
<button class="btn btn-default" type="submit" name="search_form_submit" value="search">Search</button>
</div>
</div>
</form>
</div><!-- END Collect the nav links, forms, and other content for toggling -->
</div>
</nav><!--------- END Navbar --------->
<div class="wrapper" role="main"><!-- START Content -->
<div class="container"><!-- START Related Tags -->
<div class="row">
<div id="right_sidebar" class="col-md-2 pull-right"><!-- START Right Sidebar -->
<div class="row">
<h4>Duraçao</h4>
<div class="radio">
<label><input type="radio" name="duratrion" value="dur-0" checked="checked">Indeterminado</label>
</div>
<div class="radio">
<label><input type="radio" name="duratrion" value="dur-1">1 Dia</label>
</div>
<div class="radio">
<label><input type="radio" name="duratrion" value="dur-2">3 Dias</label>
</div>
<div class="radio">
<label><input type="radio" name="duratrion" value="dur-3">5 Dias</label>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
para que eu possa intercambiar este pequenos elementos entre outras páginas (.php) veja meu exemplo rudimentar: Criei este arquivo header.php (que renderiza o navbar em vermelho)
<?php
echo'
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Titulo</title>
<script type="text/javascript" src="../Bootstrap/js/jquery-1.11.1.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript" src="../Bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="../datepicker/js/bootstrap-datepicker.js"></script>
<script type="text/javascript" src="../Jquery-Validate/jquery.validate.min.js"></script>
<script type="text/javascript" src="../Javascript/ActionsJS.js"></script>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<link rel="stylesheet" type="text/css" href="../Bootstrap/css/bootstrap.min.css" media="screen" />
<link rel="stylesheet" type="text/css" href="../datepicker/css/datepicker.css" media="screen" />
<link rel="stylesheet" type="text/css" href="../CSS/StyleSheet.css"/>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
</head>
<body>
<nav class="navbar navbar-default navbar-fixed-top" role="navigation"><!--------- START Navbar --------->
<div class="container">
<div class="navbar-header"><!-- START Brand and toggle get grouped for better mobile display -->
<button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Meu Site</a>
</div><!-- END Brand and toggle get grouped for better mobile display -->
<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"><!-- START Collect the nav links, forms, and other content for toggling -->
<ul class="nav navbar-nav navbar-right">
<li><button type="button" class="btn btn-info navbar-btn" data-toggle="modal" data-target="#login_modal">Login</button></li>
<li><button type="button" class="btn btn-info navbar-btn" data-toggle="modal" data-target="#create_account_modal">Create Account</button></li>
</ul>
<form class="navbar-form span7 text-center" role="search" id="search-form" action="../action.php" method="get">
<div class="input-group">
<input class="form-control" type="text" id="search_input" name="search_input" placeholder="Search" />
<div class="input-group-btn">
<button class="btn btn-default" type="submit" name="search_form_submit" value="search">Search</button>
</div>
</div>
</form>
</div><!-- END Collect the nav links, forms, and other content for toggling -->
</div>
</nav><!--------- END Navbar --------->
</body>
</html>
';
?>
Creio que está não é a melhor forma e gostaria de saber qual seria uma forma adequada, onde eu pude-se chamar estes pequenos .php (contendo o navbar "vermelho" o sidebar em "verde") e construir uma pagina unica ainda tem outros pontos que seriam 1º o fato de que estou replicando a tag nas paginas header.php e sidebar.php como eu poderia ser mais eficiente neste apecto? 2º o conteudo da tag é diferentes entre cada pagina 3º em caso de login do usuario como alteraria os botões Login e Create account no .php para um botão logout?