这里我们可以使用 WordPress 的 WP API 提供的搜索端点 .. 先打开 Postman 这个工具 .. 它是 Chrome 浏览器的一个插件，你可以在 Chrome 商店找到这款插件 ..

这个搜索的地址是网站的地址 .. 加上 wp-json/posts?filter[s]= .. 这个等号后面的东西就是要搜索的关键词 .. 搜索一下 阿甘正传 ..

前面这里的方法选择 GET .. 然后点击 发送 .. 这样会发出请求 .. 服务端收到请求，会给我们返回结果 .. 在下面你会看到这个结果 .. 数据的格式用的是 JSON ... 一个数组 .. 里面的项目都是一个对象 .. 对象里有一些属性 .. 使用这些属性我们可以得到对应的值 ..

WP API 给我们返回来的搜索结果的格式 Semantic UI 的 Search 模块并不认识 .. 我们需要去改造一下它 .. 比如在这个结果里添加一个 results 属性 .. 这个属性的值是一个数组 .. 数组里的项目是这些搜索结果 ..

Search 模块会自动把请求发送给 API 里的 search 这个动作 .. 先去定义一下这个动作 .. $.fn.api.settings.api .. 它的值是一个对象 .. 在这个对象里添加一个 search 属性，这个 search 就是 Search 模块需要的动作 .. Search 模块会自动去执行 search 这个动作 ..

$.fn.api.settings.api = {'search': 'http://web-stack.wordpress.ninghao.local/wp-json/posts?filter[s]{query}'}

WP API 提供的搜索用的端点的地址是 wp-json/posts?filter[s] 加上 filter 参数，这里的小 s 表示搜索 .. 等号后面是搜索的关键词 .. 这个关键词可以定义成 Semantic API 需要的变量 .. 这个变量的名字是 query ..

因为 Search 模块期待的数据格式，跟我们的服务端返回来的数据格式不太一样，这里就是 WP API 返回来的数据 ... 所以我们需要去转化一下这个返回来的数据 .. 这个 Search 模块是基于 Semantic API 做的，所以 API 的相关的设置都可以用在这个模块里面 .. 先给这个 search 方法一个对象参数 ... 然后把 api 相关的设置放在一个 apiSettings 属性里面 ..

它的值又是一个对象 .. 处理服务端响应回来的数据，可以使用 onResponse 这个方法 .. 输入 onResponse .. 它的值是一个匿名函数 .. 接收一个参数 .. 设置成 wpResponse .. 它表示的就是服务端给我们的数据 ..

在这个函数里，定义一个变量 .. 叫做 response .. 它的值可以按照 Search 模块需要的数据格式重新组织一下从服务端得到的搜索结果 .. 先是一个对象 .. 这个对象里有一个 results 属性 .. 属性的值就是服务端得到的搜索结果 .. 这里可以使用 wpResponse 表示 ..

在下面再返回这个重新组织好的搜索结果 .. return response; 保存 .. 在搜索框里输入要搜索的关键词 .. 在这里会显示从服务端返回的搜索结果 ..

$('.ui.search').search({
apiSettings: {
onResponse: function (wpResponse) {
var response = {
results: wpResponse
}
return response;
}
}
});