I'm creating a website and I've drawn the search bar. The problem is that I do not know how to activate it or that it works with my site in html. There is an easy way using google search boxes on our site but the design I drew for the search bar is different from google. Does anyone help?
Ignore the two blue vertical scratches. I want to create this search bar I just do not know how to create and after it works.
To use your own search box in Google Custom Search, you must create a custom search engine . Go to "Appearance" and select the "Layout" tab. 
Choosethe"results only" option and then click "save and get code" You will be taken to a page where is the code that you should paste into the page source where you want the results to appear on your site. There is a button "Specify details of search results". By clicking this button, there will be a field with the parameter to pass the query to the search, which by default is "q". This parameter must be equal to the value of the "name" attribute of the text field of your search box. The "action" attribute of the form in your search box should be the same as the address of the page where you want the search to appear, that is, where you pasted the above code.
<form method="post" action="pagina_de_resultados.html">
<input type="text" name="q" value="Pesquisar...">
<input type="submit" value="Pesquisar">
</form>