0
我的第一篇文章，所以原諒我，如果我沒有做到這一點，並且謝謝。如何將谷歌自定義搜索插入導航菜單'CentralizedMenu'
我想在最後一個項目「關於」右側的「Ali Shtarbanov的menuBar/centralizedMenu」中添加一個'Google Custom Search'框，並在監視器屏幕爲較小 - 此菜單將在較小的屏幕上摺疊/調整爲三格。我使用HTML，沒有PHP。
當我添加Google代碼只是創建一個空的空間，沒有搜索框。這是谷歌的功能代碼我加入的一個例子：他menuBar.html和輸出
<script>
(function() {
var cx = 'xxxxxxxxxxxxxxxxxxxxxxx:xxxxxxx’;
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = 'https://cse.google.com/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
<gcse:search></gcse:search>
代碼是在這裏： http://jsbin.com/cotewaxemi/edit?html,output 並粘貼在這裏：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>MenuBar</title>
<!-- Bootstrap Core CSS -->
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom CSS: You can use this stylesheet to override any Bootstrap styles and/or apply your own styles -->
<link href="css/custom.css" rel="stylesheet">
</head>
<body>
<!-- Navigation -->
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<div class="container">
<!-- Logo and responsive toggle -->
<div class="navbar-header"> <!--This div creates a navigation button visible on smaller screens -->
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span><!--These tags create the standard 3-lin button logo on top right corner -->
<span class="icon-bar"></span><!--Put the page less than full-screen to see this behavior -->
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse" id="navbar">
<ul class="nav navbar-nav">
<li><a href="#">Home</a></li>
<li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown1<span class="caret"></span></a><!--Requires the JavaScript files linked at the end-->
<ul class="dropdown-menu">
<li><a href="#">Item1</a></li>
<li><a href="#">Item2</a></li>
<li><a href="#">Item3</a></li>
</ul>
</li>
<li class="dropdown"><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Dropdown2<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">AnotherItem</a></li>
<li role="separator" class="divider"></li>
<li class="dropdown-header">Header:</li>
<li><a href="#">MoreItems</a></li>
<li><a href="#">MoreItems</a></li>
<li><a href="#">MoreItems</a></li>
</ul>
</li>
<li><a href="#">Tutorials</a></li>
<li><a href="#">About</a></li>
</ul>
</div>
<!-- /.navbar-collapse -->
</div>
<!-- /.container -->
</nav>
<!-- JavaScript is required for the dropdown menu -->
<!-- Placed at the end of the document so the pages load faster -->
<!-- jQuery -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.js"></script>
<!-- Bootstrap core JavaScript-->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.js"></script>
</body>
</html>
謝謝再次， Christina PS我想把一個鏈接放到我試圖做的事情上，但是因爲我是一個新成員，所以我說我不允許有這麼多的鏈接。
完美的謝謝！ ：D最後我能夠打勾接受 – ChristinaD