Drupal网站中自带的搜索框中，form采取了post方式，然后跳转到search/node/xxx这样的页面，我们在添加AMP和MIP版本的时候post form都遇到跨域提交的报错问题，暂时还没有解决，但可以自定义一个搜索框form，采取get方式，然后也是跳转到search/node/xxx这样的页面，下面把实施步骤记录下来：
在AMP版本对应的主题ampsubtheme_example下新建一个block：search form for amp，放置在所有AMP页面顶部，PHP代码内容如下：
<?php
global $language_url;
$prefix_url = $language_url->prefix;
$path = ($prefix_url == '') ? "" : "/$prefix_url";
global $base_url;
$button = t("Search");
$output = "<form action=\"$base_url$path/search_redirect\" method=\"get\" target=\"_top\">
<input type=\"text\" name=\"keyword\">
<input type=\"submit\" value=\"$button\">
</form>
";
print $output;
?>
在MIP版本对应的主题mipsubtheme_example下新建一个block：search form for mip，放置在所有MIP页面顶部，PHP代码内容如下：
<?php
global $language_url;
$prefix_url = $language_url->prefix;
$path = ($prefix_url == '') ? "" : "/$prefix_url";
global $base_url;
$button = t("Search");
$output = "<mip-form method=\"get\" url=\"$base_url$path/search_redirect\">
<input type=\"text\" name=\"keyword\">
<input type=\"submit\" value=\"$button\">
</mip-form>
";
print $output;
?>
2017-6-13补充：百度mip表单默认引入了css style "display: block;"导致按钮与输入框不在同一行，可以在上面两个input中加入class=search_form，再在miptheme的mip-custom-styles.css文件中添加.search_form {display: inline-block;}就可以让输入框和按钮在同一行了。
再新建一个页面用于跳转到search/node/xxx，路径设置为“/search_redirect”，PHP代码内容如下：
<?php
global $language_url;
$prefix_url = $language_url->prefix;
$path = ($prefix_url == '') ? "" : "/$prefix_url";
global $base_url;
$query_string = $_SERVER['QUERY_STRING'];
$keyword = substr($query_string,strpos($query_string,'keyword=')+strlen('keyword='));
$http_referer = $_SERVER['HTTP_REFERER'];
if (strpos($http_referer,'?amp') != FALSE || strpos($http_referer,'&') != FALSE) {
$amp_mip = '?amp';
} elseif (strpos($http_referer,'?mip') != FALSE || strpos($http_referer,'&mip') != FALSE) {
$amp_mip = '?mip';
} else {
$amp_mip = '';
}
if ($keyword != NULL) {
$url = "$base_url$path/search/node/$keyword$amp_mip";
header("location: $url");
}
?>
这样浏览者在AMP和MIP页面顶部的搜索框中输入关键词、按“搜索”提交后，会把keyword转交到search_redirect页面，再由search_redirect页面跳转到搜索结果页search/node/xxx对应的AMP和MIP版本页面。
而搜索结果页面中又带有Drupal搜索模块提供的搜索表单，导致搜索结果页面不符合AMP和MIP标准，浏览者在这个新表单中输入内容也无法获得搜索结果，可以通过在AMP和MIP主题中去掉搜索结果页中的这个表单来解决，具体办法是修改对应主题中的template.php：
AMP版本的ampsubtheme_example主题修改：
<?php
/**
* Preprocess all templates.
*/
function ampsubtheme_example_preprocess(&$vars, $hook) {
$vars['ampsubtheme_path_file'] = DRUPAL_ROOT . '/' . drupal_get_path('theme', 'ampsubtheme_example');
}
/**
* Implements hook_preprocess_HOOK() for HTML document templates.
*
* Example of a preprocess hook for a subtheme that could be used to change
* variables in templates in order to support custom styling of AMP pages.
*/
function ampsubtheme_example_preprocess_html(&$variables) {
}
function ampsubtheme_example_page_alter(&$page) {
// kpr($page); //use this to find the item you want to remove - you need the devel running.
// Remove the search form from the search results page.
if (arg(0) == 'search') {
if (!empty($page['content']['system_main']['search_form'])) {
hide($page['content']['system_main']['search_form']);
}
}
}
MIP版本的mipsubtheme_example修改：
<?php
/**
* Preprocess all templates.
*/
function mipsubtheme_example_preprocess(&$vars, $hook) {
$vars['mipsubtheme_path_file'] = DRUPAL_ROOT . '/' . drupal_get_path('theme', 'mipsubtheme_example');
}
/**
* Implements hook_preprocess_HOOK() for HTML document templates.
*
* Example of a preprocess hook for a subtheme that could be used to change
* variables in templates in order to support custom styling of AMP pages.
*/
function mipsubtheme_example_preprocess_html(&$variables) {
}
function mipsubtheme_example_page_alter(&$page) {
// kpr($page); //use this to find the item you want to remove - you need the devel running.
// Remove the search form from the search results page.
if (arg(0) == 'search') {
if (!empty($page['content']['system_main']['search_form'])) {
hide($page['content']['system_main']['search_form']);
}
}
}
另外，AMP和MIP版本的html.tpl.php中需要分别添加对form的支持：
AMP版本添加下面一行到<head></head>之间：
<script async custom-element="amp-form" src="https://cdn.ampproject.org/v0/amp-form-0.1.js"></script>
MIP版本添加下面一行到</body>之前：
<script src="https://mipcache.bdstatic.com/static/v1/mip-form/mip-form.js"></script>
我已经在自己的博客中这样实现了。准备后面再实施到其它系列网站中，系列网站设置后可以通过drush来批量设置和清除缓存让设置生效。
补充：在有自定义模块的系列网站中，在drupal_example_com.module文件中增加一下内容：
function drupal_example_com_block_info() {
$blocks=array();
$blocks['search_form_for_amp']=array(
'info'=> t('Search').' '.t('Form').' '.t('For').' '.t('AMP'),
'cache'=>DRUPAL_NO_CACHE,
'weight'=>0,
'status'=>1,
'region'=>'header',
'visibility'=>BLOCK_VISIBILITY_NOTLISTED,
'pages'=>'',
);
return $blocks;
}
function drupal_example_com_block_view($delta = '') {
$block=array();
switch($delta){
case 'search_form_for_amp':
$block['subject'] = '';
if(user_access('access content')){
global $language_url;
$prefix_url = $language_url->prefix;
$path = ($prefix_url == '') ? "" : "/$prefix_url";
global $base_url;
$button = t("Search");
$output = "<form action=\"$base_url$path/search_redirect\" method=\"get\" target=\"_top\">
<input type=\"text\" name=\"keyword\">
<input type=\"submit\" value=\"$button\">
</form>
";
$block['content']=$output;
}
break;
default:
}
return $block;
}
function drupal_example_com_menu() {
$items= array();
$items['search_redirect'] = array (
'title'=>'search redirect',
'page callback'=>'search_redirect',
'access arguments'=>array('access content'),
);
return $items;
}
function search_redirect() {
global $language_url;
$prefix_url = $language_url->prefix;
$path = ($prefix_url == '') ? "" : "/$prefix_url";
global $base_url;
$query_string = $_SERVER['QUERY_STRING'];
$keyword = substr($query_string,strpos($query_string,'keyword=')+strlen('keyword='));
$http_referer = $_SERVER['HTTP_REFERER'];
if (strpos($http_referer,'?amp') != FALSE || strpos($http_referer,'&') != FALSE) {
$amp_mip = '?amp';
} elseif (strpos($http_referer,'?mip') != FALSE || strpos($http_referer,'&mip') != FALSE) {
$amp_mip = '?mip';
} else {
$amp_mip = '';
}
if ($keyword != NULL) {
$url = "$base_url$path/search/node/$keyword$amp_mip";
header("location: $url");
}
}
在批量设置的sh文件中设置block、清除缓存：
drush sql-query "UPDATE block SET status='0',region='-1' WHERE module='drupal_example_com' AND delta='search_form_for_amp' AND theme='responsive_bartik';" drush sql-query "UPDATE block SET status='1',region='header',weight='0' WHERE module='drupal_example_com' AND delta='search_form_for_amp' AND theme='ampsubtheme_example';" drush cc all
其它的修改template.php、html.tpl.php等与前面单个站点设置是一样的。
评论