Google 自定义搜索引擎在 IE 下无法显示搜索结果的问题貌似终于解决了

因为使用了 WordPress 的多站点模式,而其内置的搜索功能只能搜索一个子博客,于是修改主题模板中的搜索框,使用 Google 自定义搜索引擎(Custom Search Engine, CSE)替代。可是却发现使用的 V2 版 CSE 在 IE 下无法返回搜索结果(页面空白)。今天发现这个问题终于消失了。

这个问题已经出现很长时间了。在全系列 IE,包括最新的 IE10 中都是一样。不知道这个问题与伟大的墙有没有关系。既然好了,在这里把之前的处理方法记下来,然后全面改成 Google 自定义搜索。

1. 给 WordPress 添加 Google 自定义搜索引擎

为了方便实现,使用了 Google CSE 的 v2 版代码。在 WordPress 中新建一个静态页面模板,把主要内容掏空,将 CSE 代码放进去。搜索页建成。页面地址是:

https://cnzhx.net/search/

要让 WordPress 主题中的搜索框的搜索调用 Google 的搜索引擎,还需要改动搜索框中的提交地址。将现用的 Twenty Eleven 主题的 searchform.php 中那个搜索框代码,

<form method="get" id="searchform" action="<?php echo esc_url( home_url( '/' ) ); ?>">
    <label for="s" class="assistive-text"><?php _e( 'Search', 'twentyeleven' ); ?></label>
    <input type="text" class="field" name="s" id="s" placeholder="<?php esc_attr_e( 'Search', 'twentyeleven' ); ?>" />
    <input type="submit" class="submit" name="submit" id="searchsubmit" value="<?php esc_attr_e( 'Search', 'twentyeleven' ); ?>" />
 </form>

改成,

<form method="get" id="searchform" action="//cnzhx.net/search/">
    <label for="s" class="assistive-text"><?php _e( 'Search', 'twentyeleven' ); ?></label>
    <input type="text" class="field" name="q" id="s" placeholder="<?php esc_attr_e( 'Search', 'twentyeleven' ); ?>" />
    <input type="submit" class="submit" id="searchsubmit" value="<?php esc_attr_e( 'Search', 'twentyeleven' ); ?>" />
 </form>

这样一来,搜索某个词,比如 TEST,就相当于访问

https://cnzhx.net/search/?q=TEST

页面。然后前面新建的放置了 CSE 代码的页面就会调用自定义搜索引擎来展示相应的搜索结果。前面说出问题就是,在 IE 中,搜索结果页面里没有内容。

这样做的好处是,WordPress 的内置搜索还保留着呢,

https://cnzhx.net/?s=TEST

就是内置搜索。

2. 当时为了解决 IE 空白问题而采取的措施

当初发现 IE 在显示 Google 自定义搜索结果时有问题,就把展示出来的那个搜索框做成了条件式的,即,

<![if IE]>
<form method="get" id="searchform" action="<?php echo esc_url( home_url( '/' ) ); ?>">
    <label for="s" class="assistive-text"><?php _e( 'Search', 'twentyeleven' ); ?></label>
    <input type="text" class="field" name="s" id="s" placeholder="<?php esc_attr_e( 'Search', 'twentyeleven' ); ?>" />
    <input type="submit" class="submit" name="submit" id="searchsubmit" value="<?php esc_attr_e( 'Search', 'twentyeleven' ); ?>" />
</form>
<![endif]>

<![if !IE]>
<form method="get" id="searchform" action="//cnzhx.net/search/">
    <label for="s" class="assistive-text"><?php _e( 'Search', 'twentyeleven' ); ?></label>
    <input type="text" class="field" name="q" id="s" placeholder="<?php esc_attr_e( 'Search', 'twentyeleven' ); ?>" />
    <input type="submit" class="submit" id="searchsubmit" value="<?php esc_attr_e( 'Search', 'twentyeleven' ); ?>" />
</form>
<![endif]>

后来发现 IE10 不认这个 if IE 的语句了,只好按照提示在 WordPress 主题模板的 <head> 中增加了一条让 IE10 以 IE9 模式工作的语句:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE9">

这样,IE 用户使用搜索框的时候用的是 WordPress 内置搜索,其它用户用的是 Google 自定义搜索。

希望以后不需要再用到上面的 2 了。©

本文发表于水景一页。永久链接:<https://cnzhx.net/blog/google-cse-ie-problem-fixed/>。转载请保留此信息及相应链接。

雁过留声,人过留名

您的电子邮箱地址不会被公开。 必填项已用 * 标注

特别提示:与当前文章主题无关的讨论相关但需要较多讨论求助信息请发布到水景一页讨论区的相应版块,谢谢您的理解与合作!请参考本站互助指南
您可以在评论中使用如下的 HTML 标记来辅助表达: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>