Обновление: я также узнал, что это Safari в дополнение к Chrome.
Вот обновление на некоторую информацию, которую я нашел. Но сначала позвольте мне кратко go рассказать о проблеме, с которой мы столкнулись при поиске в заголовке. На нашем веб-сайте с помощью Google Chrome для мобильных устройств или Google Chrome для инкогнито для настольных компьютеров и касания значка поиска или значка меню в заголовке происходит анимация выделения, но окно поиска не заполняется. Вместо этого он добавляет хештег в конец URL-адреса и перемещает вас наверх. Чтобы решить эту проблему, вы должны обновить sh страницу. Кроме того, когда вы отправляете свой запрос и попадаете на страницу результатов поиска, затем нажимаете на меню или значок поиска, он добавляет хэштег, очищает результаты поиска и поднимает вас наверх. Ссылка sh на страницу решит проблему, но результатов вашего поиска там не будет. Я не могу повторить проблему через браузеры Mozilla Firefox или Web root Secure Anywhere для мобильных устройств. С учетом вышесказанного я сузил его до конкретного c браузера. Также хочу отметить, что сама страница результатов поиска не имеет проблем. Окно поиска и результаты работают так, как должны.
Кроме того, моя цель - заменить поиск нашей темы в заголовке пользовательским поиском Google, и я считаю, что могу sh выполнить это с помощью формы поиска. php файл? Я твердо верю, что это связано с формой поиска. php и / или файлом поиска. php (оба исходных кода перечислены ниже). Я провел некоторое исследование о том, как изменить файл searchform. php, чтобы добавить Google CSE, и все, что я могу найти, это устаревшие статьи.
Если вы еще не знаете, мы используем WordPress и настраиваем Google CSE. с Layout, установленным на Compact с использованием их темы по умолчанию, и добавили CSS для стилизации поля поиска и результатов. Я провел несколько тестов, и победил только один результат. Кроме того, я хочу отметить одну вещь при выполнении всех моих тестов, я очистил свой кеш через браузер и Supercacher для моего сайта. Смена темы сработала. Не было проблем с помощью Google Chrome для мобильных устройств или для инкогнито для настольных компьютеров. Наша тема BuddyBoss содержит файл поиска. php и форму поиска. php. Тема, на которую я переключился, имеет только файл searchform. php (не уверен, имеет ли это значение). Я удалил PHP в поисковой форме. php файл и добавил следующий код (используя мою дочернюю тему):
<script>
(function() {
var cx = 'CSE ID';
var gcse = document.createElement('script');
gcse.type = 'text/javascript';
gcse.async = true;
gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
'//cse.google.com/cse.js?cx=' + cx;
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(gcse, s);
})();
</script>
<gcse:searchbox-only resultsUrl="https://www.example.com/"></gcse:searchbox-only>
Я связался с Google по поводу проблемы, и они сказали, что я использую устаревшую код и дал мне ссылку, дающую подробную информацию об элементе управления API https://developers.google.com/custom-search/docs/element. Именно тогда я узнал, что приведенный выше код в моем файле searchform. php является предыдущей версией. Затем я следовал инструкциям Google:
<!-- Put the following javascript before the closing </head> tag
and replace 123:456 with your own Custom Search engine ID. -->
<script async src="https://cse.google.com/cse.js?cx=123:456"></script>
<!-- Place this tag where you want both of the search box and the search results to render -->
<div class="gcse-search"></div>
Затем я попытался сохранить поисковую форму. php код так же, как это делают наши разработчики тем:
<?php
/**
* The template for displaying search form
*
* @link https://developer.wordpress.org/themes/basics/template-hierarchy/#search-result
*
* @package BuddyBoss_Theme
*/
?>
<form role="search" method="get" class="search-form" action="<?php echo esc_url( home_url( '/' ) ); ?>">
<label>
<span class="screen-reader-text"><?php esc_html_e( 'Search for:', 'buddyboss-theme' ); ?></span>
<input type="search" class="search-field-top" placeholder="<?php echo esc_attr( apply_filters( 'search_placeholder', __( 'Search', 'buddyboss-theme' ) ) ); ?>" value="<?php echo get_search_query(); ?>" name="s" />
</label>
<input type="submit" class="search-submit" value="<?php echo esc_attr_e( 'Search', 'buddyboss-theme' ); ?>" />
</form>
Затем я создал свой собственный поиск. php в моей дочерней теме и заполнение его кодом "Получить код" из Google CSE
<script async src="https://cse.google.com/cse.js?cx=My ID"></script>
<div class="gcse-search"></div>
Вот файл поиска нашей темы. php, если кто-то может найти его полезным:
/**
* The template for displaying search results pages
*
* @link https://developer.wordpress.org/themes/basics/template-hierarchy/#search-result
*
* @package BuddyBoss_Theme
*/
get_header();
$blog_type = 'standard'; // standard, grid, masonry.
$class = 'bb-standard';
?>
<div 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__( "Showing results for '%s'", 'buddyboss-theme' ), '<span>' . get_search_query() . '</span>' );
?>
</h1>
</header><!-- .page-header -->
<div class="post-grid <?php echo esc_attr( $class ); ?>">
<?php
/* Start the Loop */
while ( have_posts() ) :
the_post();
/*
* Include the Post-Format-specific template for the content.
* If you want to override this in a child theme, then include a file
* called content-___.php (where ___ is the Post Format name) and that will be used instead.
*/
get_template_part( 'template-parts/content', apply_filters( 'bb_blog_content', get_post_format() ) );
endwhile;
?>
</div>
<?php
buddyboss_pagination();
else :
get_template_part( 'template-parts/content', 'none' );
?>
<?php endif; ?>
</main><!-- #main -->
</div><!-- #primary -->
<?php get_sidebar('search'); ?>
<?php
get_footer();
Реализация этого кода в поиске. php файл не работал. На данный момент я просто пробую разные вещи и проверяю их. Сейчас я пытаюсь ознакомиться с WordPress 'get_search_form (array $ args = array ()), чтобы увидеть, как я могу реализовать свой собственный Google CSE на нашем веб-сайте https://developer.wordpress.org/reference/functions/get_search_form/.
Я новичок в области кодирования и буду рад любым отзывам о том, что я могу сделать, или если кто-то может указать мне правильное направление! Я ценю время, которое вы мне оказываете, а также любую помощь, которую я получаю. Надеюсь, это будет легко исправить.
Это было очень долго, но я старался быть настолько описательным, насколько мог. Я надеюсь, что я был ясен, легок для понимания и ответил на все ваши вопросы. Спасибо!
Спасибо и всего наилучшего,
Джо sh