Wordpress search bar outputting only posts titles

Question

I would like to create a Wordpress search bar in PHP, displayed in just one page of my site (I am working on a new theme I have made). As result, the search bar should output only the permalinks (titles) of my posts that are related to the search keyword.
The issue I have now is that the search output is showing lorem ipsum text and the sidebar. Whatever keywords I search, that same output is showing up. (see screenshot).

Thank you very much for your help!

searchform.php

<form role="search" method="get" class="search-form" action="<?php echo home_url( '/' ); ?>">
  <label>
    <span class="screen-reader-text"><?php echo _x( 'Search for:', 'label' ) ?></span>
        <input type="search" class="search-field" placeholder="<?php echo esc_attr_x( 'search', 'placeholder' ) ?>" value="<?php echo get_search_query() ?>" name="s" title="<?php echo esc_attr_x( 'Search for:', 'label' ) ?>" />
  </label>
  <input type="submit" class="search-submit" value="<?php echo esc_attr_x( 'Search', 'submit button' ) ?>" />
</form>

search.php

<?php get_header(); ?>

  <section id="primary" class="content-area">
    <main id="main" class="site-main">

      <?php if ( have_posts() ) : ?>

        <header class="page-header">
          <h1 class="page-title"><?php
            /* translators: %s: search query. */
            printf( esc_html__( 'Search Results for: %s', 'materialpress' ), '<span>' . get_search_query() . '</span>' );
          ?></h1>
        </header><!-- .page-header -->

        <?php
        while ( have_posts() ) : the_post();
          /* Make sure the template is your content.php */
          get_template_part('content');

        endwhile;

        the_posts_navigation();

      else :
        /* Show no content found page */
        echo 'Not posts found';

      endif; ?>

      </main><!-- #main -->
    </section><!-- #primary -->

<?php get_sidebar(); get_footer();

mypage.php

<?php get_header(); ?>


<?php get_search_form(); ?>

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
  <div class="container">
    <div id="content_post">
      <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
        <?php the_content(); ?>
      </div>
    </div>    
  </div>

<?php endwhile; ?>
<?php endif; ?>

content-search.php

<?php get_header(); ?>

<?php if (have_posts()):  ?>

<div class="container">
  <?php while(have_posts()): the_post(); ?>
  <div class="row-posts-container">
    <div class="row-posts">
      <div class="posts col-lg-12 hidden-sm col-md-12 hidden-xs">
        <a href="<?php the_permalink(); ?>"><?php $first = str_replace(' | ', '<br />', get_the_title()); echo str_replace('REPLACE_ME', '<i>REPLACE_ME</i>', $first);?></a>
      </div>
    </div>
  </div>
  <?php endwhile; ?>
</div>

<?php endif; ?>

And what is the issue you are having? You have given us code, but not told us what the problem is with it, or what you have already done to fix it. Please review [How do I ask a good question](https://stackoverflow.com/help/how-to-ask). — FluffyKitten, Aug 26 '17 at 16:06
Can you paste the code inside the content.php file so I can help you. — Rajendran Nadar, Aug 26 '17 at 16:08
@RajendranNadar What is it exactly your are naming content.php file? Is it mypage.php? Should I paste all the codes in that file? — Lolo, Aug 26 '17 at 16:18
Are you making a new theme or its is an existing theme. If it is a theme from wordpress theme repo It will have a file called content.php to display contents like title, contect & meta — Rajendran Nadar, Aug 26 '17 at 16:22
I am working on a new theme that I built myself. Those three files are what I have to make the search bar working so far. — Lolo, Aug 26 '17 at 16:28
I would use get_template_part('content', 'search') and then have content-search.php file to format the individual search result item. — user8230352, Aug 26 '17 at 16:39
@user8230352 thank you for your answer! I did create a content-search.php file, there is no more lorem ipsum and sidebar in the search output. But now it outputs all my posts' titles (and pages' titles according to the search keyword..) at once, in an infinite scroll. I know the code I used is wrong but I don't know how to make it better at this point. I have edited my question, you can see the code I used. — Lolo, Aug 26 '17 at 17:25

user8230352 · Accepted Answer · 2017-08-26T17:43:23.580

The problem is that content-search.php also contains a header and a loop. It should only contain the sections of code you want to reuse for each item in the main loop, by using something like this in content-search.php:

  <div class="row-posts-container">
    <div class="row-posts">
      <div class="posts col-lg-12 hidden-sm col-md-12 hidden-xs">
        <a href="<?php the_permalink(); ?>"><?php $first = str_replace(' | ', '<br />', get_the_title()); echo str_replace('REPLACE_ME', '<i>REPLACE_ME</i>', $first);?></a>
      </div>
    </div>

score 0 · Answer 2 · answered Aug 27 '17 at 07:51

Do this are trying to access a wrong template file

while ( have_posts() ) : the_post();
     /* Make sure the template is your content.php */
      get_template_part('content', 'search');
endwhile;

You need to do this because the file name is content-search.php

Wordpress search bar outputting only posts titles

2 Answers2

Linked