-1

私はワードプレスのウェブサイトを複製している最中です。このサイトを作成した人は、wordpress を適切に使用していませんでした (サイトをゼロから作成するのではなく、テキスト エディターに大量の HTML コードを入力しただけです)。検索機能を除いて、すべてが完全に新しいサイトに複製されます。私はそれを機能させることができないようです。それを複製する方法について何か提案はありますか?

基本的に、ユーザーが検索ボックス (緑色の四角形) に入力を開始すると、少なくとも 3 文字を入力すると、フォームの下に結果が表示され始め、ユーザーがさらに文字を入力するとフィルタリングされます。ユーザーがEnterキーを押してフォームを送信しないように、フォームのデフォルトのアクションを防ぐことができます。これを行うためのプラグインがない場合は、おそらく php/javascript の方法があります:

文字が検索フィールドに入力されるたびに、php または javascript/jquery で次のような関数を呼び出します:
   -- ワードプレスの投稿を検索します文字列のカスタム投稿タイプ カテゴリの、その文字列を含むすべてのタイトルを返します。投稿のタイトルを使用するか、高度なカスタム フィールドを使用しているので、その名前フィールドで検索できます。
   -- その情報をフォームの下に表示します

複製しようとしているページは次のとおりです: http://www.jessicadesmond.com/sr/our-team/

編集 

    function getElementByClass (className, parent) {
  parent || (parent = document);
  var descendants= parent.getElementsByTagName('*'), i=-1, e, result=[];
  while (e=descendants[++i]) {
    ((' '+(e['class']||e.className)+' ').indexOf(' '+className+' ') > -1) && result.push(e);
  }
  return result;
}


function gid(a_id) {
    return document.getElementById (a_id)   ;
}

function close_all(){// hide all divs
    var searchers = getElementByClass("search-title", "");

    for (i=0;i<searchers.length; i++) {// to simplify the story I have here the hardcoded number of elements. In real life make it better.
        var o = gid("user_"+i);
        if (o) { //just to make sure this object really exists
            o.style.display = "none";
        }
    }
}


function find_my_div(){ // find and show
    close_all(); // close previous searhc results
    var o_edit = gid("edit_search");
    var str_needle = edit_search.value;
    str_needle = str_needle.toUpperCase();

    var searchers = getElementByClass("search-title", "");

    if (str_needle != "") {// we will not search for empty strings
        for (i=0;i<searchers.length; i++) {
        var o = gid("user_"+i);
        var s = gid("title_"+i);
        if (s) { //just to make sure this object really exists
            // we want case insensitive search, so bring the both parts to upper case and compare
            var str_haystack = s.innerHTML.toUpperCase();
            if (str_haystack.indexOf(str_needle) ==-1) {
                // not found, do nothing
            }
            else{
                // yes, we got it, show it
                o.style.display = "block";
            }   
        }
    }
}
}

そして、コンテンツを表示している HTML/PHP:

<div id="team-search">
    <p>Search for a professional by name, title, or practice</p>
    <form class="team-search" role="search" method="get" id="searchform" action="#">
        <input name="search" id="edit_search" type="text" class="edit_search" onchange="find_my_div()">
        <input type="submit" id="searchsubmit" value="search" class="searchbutton"/>
    </form>
</div>
<?php 
    $args = array(
        'post_type' => 'team',
        'taxonomy' => 'employee-type',
        'term' => 'attorneys',
        'posts_per_page' => -1
    );
    $att_query = new WP_Query($args);
    if( $att_query->have_posts() ) { 
        $i = 0 ?>
        <div id="listTeam">
            <?
            while ($att_query->have_posts()) : $att_query->the_post(); 
                ?>
                <div style="display: none;" class="entryTeam" id="user_<?php echo $i; ?>">
                    <div class="teamTitle">
                        <a href="<?php the_permalink(); ?>">
                            <img src="<?php echo the_field('photo'); ?>" style="visibility: visible; opacity: 1;">
                        </a>
                        <p class="search-title" id="title_<?php echo $i; ?>"><?php the_title(); ?></p>
                        <p><em><?php echo the_field('tagline'); ?></em></p>
                    </div>
                </div>
            <?php 
                $i++;
                endwhile; 
            ?>
        </div>
    <?php }
    wp_reset_query();
4

1 に答える 1