programing

Wordpress 테마(get_search_form() 사용)에서 플레이스 홀더 텍스트를 검색 상자에 추가하려면 어떻게 해야 합니까?

muds 2023. 3. 7. 22:10
반응형

Wordpress 테마(get_search_form() 사용)에서 플레이스 홀더 텍스트를 검색 상자에 추가하려면 어떻게 해야 합니까?

테마를 작성하려고 하는데 다음을 사용하여 헤더에 검색 상자를 표시합니다.

<?php get_search_form(); ?>

그 상자에 플레이스 홀더 텍스트를 표시할 수 있는 방법이 있습니까?

결국 테마 폴더에 "searchform.php"라는 파일이 없는 경우 Wordpress 디스플레이는 자리 표시자 텍스트를 포함하지 않는 기본 형식입니다.

<form role="search" method="get" id="searchform" action="<?php echo home_url( '/' ); ?>">
    <div><label class="screen-reader-text" for="s">Search for:</label>
        <input type="text" value="" name="s" id="s" />
        <input type="submit" id="searchsubmit" value="Search" />
    </div>
</form>

테마 폴더에 "searchform.php"라는 새 파일을 만들고 자리 표시자 텍스트를 포함하도록 기본 양식을 수정했습니다.

<form role="search" method="get" id="searchform" action="<?php echo home_url( '/' ); ?>">
    <div>
        <input type="text" value="" name="s" id="s" placeholder="Search gear, clothing, & more.." />
        <input type="submit" id="searchsubmit" value="Search" />
    </div>
</form>

테마 폴더에 searchform.devel을 만들어 코드를 배치합니다.

<form method="get" id="searchform" action="<?php bloginfo('url'); ?>">
<div>
<input class="text" type="text" value=" " name="s" id="s" />
<input type="submit" class="submit button" name="submit" value="<?php _e('Search');?>" />
</div>
</form>

클래스, 플레이스 홀더, 텍스트 등 원하는 것을 변경할 수 있지만 이름, ID, 양식 속성은 변경할 수 없습니다.

감사해요.

WP 코드에는 플레이스 홀더를 사용한 예가 있습니다.

테마가 HTML5를 지원하는 경우(테마가 HTML5를 사용하는 경우)add_theme_support('html5', array('search-form')), 다음의 HTML 폼을 출력합니다.이것은 WordPress 3.6 이후의 경우입니다.

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

HTML5 태그 및 속성을 사용하지 않으려면 JavaScript를 사용하여 플레이스 홀더를 작성할 수 있습니다.

공식 get_search_form은 funtions.php에 추가할 수 있는 유연한 변경에 대해 설명했습니다.

CodeX 커밋을 사용하여 여기를 체크합니다.

TL;DR

아래 코드를 확인합니다.

function wpdocs_my_search_form( $form ) {
// replace the new form on your own.
    $form = '<form role="search" method="get" id="searchform" class="searchform" action="' . home_url( '/' ) . '" >
    <div><label class="screen-reader-text" for="s">' . __( 'Search for:' ) . '</label>
    <input type="text" value="' . get_search_query() . '" name="s" id="s" />
    <input type="submit" id="searchsubmit" value="'. esc_attr__( 'Search' ) .'" />
    </div>
    </form>';
 
    return $form;
}

add_filter( 'get_search_form', 'wpdocs_my_search_form' );

언급URL : https://stackoverflow.com/questions/19870329/in-a-wordpress-theme-using-get-search-form-how-can-i-add-placeholder-text-t

반응형