im using this code for my website ajax live search for post title

The HTML (could be part of page content)

<input type="text" name="keyword" id="keyword" onkeyup="fetch()"></input>

<div id="datafetch">Search results will appear here</div>

The JavaScript ( goes to the theme's functions.php )

// add the ajax fetch js
add_action( 'wp_footer', 'ajax_fetch' );
function ajax_fetch() {
<script type="text/javascript">
function fetch(){

        url: '<?php echo admin_url('admin-ajax.php'); ?>',
        type: 'post',
        data: { action: 'data_fetch', keyword: jQuery('#keyword').val() },
        success: function(data) {
            jQuery('#datafetch').html( data );



And finally the AJAX call goes to the theme's functions.php

// the ajax function
add_action('wp_ajax_data_fetch' , 'data_fetch');
function data_fetch(){

    $the_query = new WP_Query( 
        'posts_per_page' => -1, 
        's' => esc_attr( $_POST['keyword'] ), 
        'post_type' => 'post' 

    if( $the_query->have_posts() ) :
        while( $the_query->have_posts() ): $the_query->the_post();

$myquery = esc_attr( $_POST['keyword'] );
$a = $myquery;
$search = get_the_title();
if( stripos("/{$search}/", $a) !== false) {?>
            <h4><a href="<?php echo esc_url( post_permalink() ); ?>"><?php the_title();?></a></h4>


but i need some extra results! i want to search in Tags,Contents,Title instead of just title. and also show every results in spesific section. like this image: enter image description here

and also do not duplicate results be displayed

do you guys have any ideas?

  • Please edit your question to include the code you're using (even if it's directly copied from another answer in this site). That will help us answer your question.
    – Pat J
    Jul 1, 2021 at 1:05
  • 1
    Hi Pat, i did it.. Jul 1, 2021 at 6:59


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Browse other questions tagged or ask your own question.