How to Google Search input box in PHP website

The search box is a very important part of any website which helps in making the website user-friendly. In this tutorial, we will learn how to create a Google search input box on the website using PHP programming. Google search box can be easily created by Google search query URL and PHP. When a user enters the keywords in the Google search input box and clicks on the search button then redirects to the Google website and displays the related content links to the keywords, website. If you create a Google search on your PHP website, it reduces the load on the website all related posts are displayed on the first page of Google. Along with user keywords, we can define the website name or website URL with search keywords.

How to create a Google Search box in PHP –

To create a Google search system or Google search input box in PHP, we first create an HTML input box.

The HTML input box is created to retrieve the value from the users by which the value taken is used with the Google search query. The HTML input box is create inside the HTML form . Along with the input box, A button is also created. By clicking on this button, keywords are searched on the Google website.

Let’s create a form with an input box and a submit button.

Google Search Box in HTML –

<div class="search_phase">
  <form action="" method="POST" target="_blank">
   
      <div class="col"><input type="text" placeholder="disabled" name="keywords" required=""></div>
      
      <div class="col">
        <button type="submit" name="keys_submit">
          <div id="search-circle"></div>
          <span></span>
        </button>
      
    </div>
  </form>
</div>

In the form above, we have an input box and which works like a Google search box, by clicking on a button, the user gets redirected to the live Google search. You must have noticed that some CSS classes have been used here, but CSS classes also have to be created

We use CSS classes to design the Google search box. Let's create CSS classes and design the HTML form input box, button.

Designing Google Search box -

<style> 

*
{
    outline: none;
}

.col
{
    display: table-cell;
    vertical-align: middle;
}

input, button
{
    font-family: Nunito;
    padding: 0;
    margin: 0;
    border: 0;
    background-color: transparent;
}

.search_phase
{
    width: 600px;
    padding: 2px;
    border-radius: 24px;
  border: 2px solid #dfe1e5;
    transform: scale(0.5);
}
.search_phase:hover{ 
 -moz-box-shadow: 0 0 10px  rgba(0,0,0,0.6);
      -webkit-box-shadow: 0 0 10px  rgba(0,0,0,0.6);
      -o-box-shadow: 0 0 10px  rgba(0,0,0,0.6);
}
input[type="text"]
{
    width: 100%;
    height: 100%;
    font-size: 50px;
}
button
{
    position: relative;
    display: block;
    width: 80px;
    height: 90px;
    cursor: pointer;
}

#search-circle
{
    position: relative;
    top: -8px;
    left: 0;
    width: 30px;
    height: 30px;
    margin-top: 0;
    border-width: 15px;
    border: 15px solid #4285f4;
    background-color: transparent;
    border-radius: 50%;
    transition: 0.5s ease all;
}

button span
{
    position: absolute;
    top: 68px;
    left: 43px;
    display: block;
    width: 30px;
    height: 15px;
    background-color: transparent;
    border-radius: 10px;
    transform: rotateZ(52deg);
    transition: 0.5s ease all;
}

button span:before, button span:after
{
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 45px;
    height: 15px;
    background-color: #4285f4;
    border-radius: 10px;
    transform: rotateZ(0);
    transition: 0.5s ease all;
}

</style>

What is Google search query URL-

, Google search query URL is used to search for keywords on the Google search engine. All search engines along with Google have their own search query URLs.

Google Search Query URL https://www.google.com/search?q

Example -

https://www.google.com/search?q=Techno+Smarter

By using the Google search query, we create a search input box using PHP programming

Google search box in PHP -

To create the Google search box on the PHP website, we create PHP scripts.

1. HTML form (input box + button).

2. HTML Form Designing.

3. PHP Scripts - User enters the values into the input box and the PHP post method handles those values. As you know, the Post method is known as a form handling method. The values are stored in a variable by the POST method. We use that values with Google search query URL and website name ( you can use website URL also ).


<?php   
$base="Techno Smarter"; // Change base here 
$search_URL="https://www.google.com/search?q="; // Google Search Query URL  
if(isset($_POST['keys_submit'])){ 
echo $keywords=$_POST['keywords'];
 header("location: ".$search_URL.$keywords.' '.$base );

}
?>

In the PHP scripts above, First, we created two variables, We stored the website name in the first variable and stored the Google search query URL in the second variable.

We added equals to sign (=) with Google search query URL. If condition is used to create form submit on the button. The form cannot be submitted without submit button pressed. We have used the header function and their values.