サイトのメイン中央に、検索ボックスを表示させたい

Question

###前提・実現したいこと
表題のとおりですが、ワードプレスで作ったサイトのメイン中央に
検索ボックスを表示させたいんです。

完成イメージはフォトACみたいな感じです
背景画像があって、検索ボックスがある、みたいな感じです
https://www.photo-ac.com/

###直面している問題と、試したこと

例えばこのテーマだとして
https://wordpress.org/themes/twentyseventeen/
（テーマは何でもいいです。こだわりません。他のやりやすいのがあればそれでの解説でも結構です）

●メインの背景画像があって、
●その中央に、検索ボックスをドーンと表示させたいんです。


サーチボックスの表示は
<?php get_search_form(); ?>
を指定のところに記述すればいいはずなのですが、「指定のところ」がわかりません


header.php内に
<?php get_template_part( 'template-parts/header/header', 'image' ); ?>
という記述があるので、もしかしたらこの前後かな？と思って
適当に文字とか入れてみたのですが何も表示されませんでした。

Answer 1

twentyseventeenのテンプレートの場合でしたら
headerの.wrapの中に<?php get_search_form(); ?>を追加してCSSで位置を調整すればいいと思います。
（ただしheader.phpは他のページに共通で読み込まれているため。他のページに表示したくない場合はindex.phpに直接入れるか、別ファイルを作成してindex.phpにインポートしたほうがいいです。）

header.php

<header id="masthead" class="site-header" role="banner">
  <?php get_template_part( 'template-parts/header/header', 'image' ); ?>

  <?php if ( has_nav_menu( 'top' ) ) : ?>
    <div class="navigation-top">
      <div class="wrap">
        <?php get_template_part( 'template-parts/navigation/navigation', 'top' ); ?>
        //.wrapの中がheaderのコンテンツです。
      </div><!-- .wrap -->
    </div><!-- .navigation-top -->
  <?php endif; ?>

</header><!-- #masthead -->

Comments

[glanglan]

アドバイスありがとうございます。header.php内
<?php get_template_part( 'template-parts/navigation/navigation', 'top' ); ?>
の下に
<?php get_search_form(); ?>
と入れてみたのですが、検索フォームはどこにも出てきませんでした。
何か原因は感がられますでしょうか？苦笑

[Higemura]

<?php get_search_form(); ?>を呼び出しているsearchform.phpはどうなっていますか？
actionのディレクトリが違うんだと思います。

[glanglan]

早速お返事ありがとうございます。

>searchform.phpはどうなっていますか？

デフォルトのまま何もいじってないです。
一応、「ああああ」とか普通の文字とかも入れてみたんですがやはり表示されませんでした。
このスペース(header.php)が、そもそも追記ができないようになってるんですかね？(そんなことあるんですかね？)

ちなみにsearchform.phpの記述は下記のとおりです
---------------------------

<?php
/**
* Template for displaying search forms in Twenty Seventeen
*
* @package WordPress
* @subpackage Twenty_Seventeen
* @since 1.0
* @version 1.0
*/

?>

<?php $unique_id = esc_attr( uniqid( 'search-form-' ) ); ?>

<form role="search" method="get" class="search-form" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<label for="<?php echo $unique_id; ?>">
<span class="screen-reader-text"><?php echo _x( 'Search for:', 'label', 'twentyseventeen' ); ?></span>
</label>
<input type="search" id="<?php echo $unique_id; ?>" class="search-field" placeholder="<?php echo esc_attr_x( 'Search &hellip;', 'placeholder', 'twentyseventeen' ); ?>" value="<?php echo get_search_query(); ?>" name="s" />
<button type="submit" class="search-submit"><?php echo twentyseventeen_get_svg( array( 'icon' => 'search' ) ); ?><span class="screen-reader-text"><?php echo _x( 'Search', 'submit button', 'twentyseventeen' ); ?></span></button>
</form>