我的自定义wordpress模板工作正常，直到它没有设置为静态主页。当我将自定义模板设置为我的主页时，所有div都搞砸了。我的所有内容都开始显示在footer内。
<?php
/*
* Template Name: school search
*
* Display latest posts and categories
*
* @package OWT school search
* @version Release: 1.0
* @since available since Release 1.0
*/
?>
<?php
get_header(); ?>
</header>
<div id="top" class="row" >
<div id="search-box" class="col-xs-12">
<form class="form-inline" name="search" method="post" action="<?php $_SERVER["PHP_SELF"] ?>">
<div class="form-group">
<label for="search-bar">Search School:</label>
<input name="search-bar" type="text" class="form-control" id="search-bar" placeholder="School Name or Street" list="datalist">
</div>
<div class="form-group">
<label for="state">State:</label>
<select name="state" class="form-control" id="state">
<option value="">Select State</option>
<option value="Uttar Pradesh">Uttar Pradesh</option>
<option value="Delhi">Delhi</option>
<option value="Haryana">Haryana</option>
<option value="Maharashtra">Maharashtra</option>
</select>
</div>
<div class="form-group">
<label for="city">City:</label>
<select name="city" class="form-control" id="city">
<option value="">Select City</option>
</select>
</div>
<div class="form-group">
<label for="area">Area:</label>
<select name="area" class="form-control" id="area">
<option value="">Select Area<option>
</select>
</div>
<button type="submit" class="btn btn-primary">Search</button>
</form>
</div>
</div>
<?php
$result = $wpdb->get_results ( "SELECT DISTINCT * FROM school_data, areas group by Name;" );
?>
<datalist id="datalist">
<?php
foreach ( $result as $print ) {
?>
<option value="<?php echo $print->Name ; ?>">
<option value="<?php echo $print->Address_1 ; ?>">
<option value="<?php echo $print->City ; ?>">
<option value="<?php echo $print->State ; ?>">
<?php } ?>
</datalist>
<?php
if($_SERVER['REQUEST_METHOD']=="POST"){
$searchBar = $_POST["search-bar"];
$state = $_POST["state"];
$city = $_POST["city"];
$area = $_POST["area"];
$state = $_POST["state"];
if($searchBar == "" && $state == "" && $city == "" && $area == "" && $state == ""){
echo "<div class='alert alert-danger' id='Msg'><strong>Error!</strong>Please fill at least one entry in the form above</div>";
}
else{
$sql = "SELECT a.*, b.State FROM school_data a, areas b WHERE (a.Name LIKE'%$searchBar%' OR a.Address_1 LIKE'%$searchBar%' OR a.City LIKE'%$searchBar%' OR b.State LIKE '%$searchBar%')";
$group_by = " group by a.Name";
if( $state == "" ){
$sql = $sql.$group_by;
}
else{
if( $city == "" ){
$sql = $sql." AND (b.State = '$state')".$group_by;
}
else{
if( $area == "" ){
$sql = $sql." AND (b.State = '$state' AND a.City = '$city')".$group_by;
}
else{
$sql = $sql." AND (b.State = '$state' AND a.City = '$city' AND a.Address_1 = '$area')".$group_by;
}
}
}
$result = $wpdb->get_results ( $sql ); ?>
<div id="main-container">
<div id="resultArea" class="row">
<div id="results" class="col-md-3">
<?php $num = 1;
foreach ( $result as $print ) { ?>
<div id="output">
<strong id="output-name">
<a href="javascript:geocodeAddress('<?php echo $print->Name; ?> ,<?php echo $print->City; ?>, <?php echo $print->State; ?>');"><?php echo $num; ?>. <?php echo $print->Name; ?></a>
</strong><br/>
<p><?php echo $print->Address_1; ?>, <?php echo $print->City; ?>, <?php echo $print->Pin; ?>, <?php echo $print->State; ?><hr></p>
</div>
<?php $num++; } ?>
</div>
<div id="map" class="col-md-9">
</div>
</div>
</div>
<?php }
}
else{ ?>
<div id="main-container">
<div id="resultArea" class="row">
<div id="results" class="col-md-3">
<div class="def-msg">
<ul>
<li>Type any address or school name in the first box, then click Search</li>
<li>You can select a Borough and Grade to better focus your results</li>
</ul>
</div>
</div>
<div id="map" class="col-md-9">
</div>
</div>
</div>
<?php }
?>
<script>
jQuery("#state").change(function($) {
var data = {
'action': 'my_action',
'selectedState': jQuery('#state').val()
};
jQuery.post(ajaxurl, data, function(cityResponse) {
document.getElementById("city").innerHTML = cityResponse;
});
});
jQuery("#city").change(function($) {
var data = {
'action': 'my_action',
'selectedCity': jQuery('#city').val()
};
jQuery.post(ajaxurl, data, function(response) {
document.getElementById("area").innerHTML = response;
});
});
var map;
function myMap() {
var mapProp = {
center: new google.maps.LatLng(20.5937, 78.9629),
zoom: 5,
};
map = new google.maps.Map(document.getElementById("map"), mapProp);
}
function geocodeAddress(address) {
var geocoder = new google.maps.Geocoder();
geocoder.geocode({address: address}, function(results, status) {
if (status == "OK") {
var marker = new google.maps.Marker({
position: results[0].geometry.location,
animation:google.maps.Animation.BOUNCE,
});
marker.setMap(map);
if (results[0].geometry.viewport) map.fitBounds(results[0].geometry.viewport);
else if (results[0].geometry.bounds) map.fitBounds(results[0].geometry.bounds);
else map.setCenter(results[0].geometry.location);
}
else alert("geocoder failed, status: "+status);
})
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=2-_I4Dc0KSh3VI_OCaCDcG68oq8&callback=myMap"></script>
现在这段代码运行正常，但每当我在末尾添加<?php get_footer(); ?>时，我的模板内容都会进入页脚