JetSearch 是由 Crocoblock 团队开发的一款高级 WordPress AJAX 实时搜索插件，专为提升网站搜索体验而设计，兼容 Elementor、Gutenberg、Bricks 等主流页面构建器。
重要连结
- Crocoblock: https://crocoblock.com/plugins/jetsearch/
- JetSearch 更新日志: https://crocoblock.com/changelog/?plugin=jet-search
- JetSearch 知识库: https://crocoblock.com/knowledge-base/plugins/jetsearch/
JetSearch 搜索栏 CSS
/* 移除输入框获得焦点时默认出现的蓝色外边框 */
.jet-ajax-search .jet-ajax-search__form input:focus-visible{
outline: none;
}
/* 控制搜索结果区域不超出边界，防止背景色溢出 */
.jet-ajax-search .jet-ajax-search__results-area {
overflow: hidden;
}
/* 为搜索结果项添加浅色分割线以提升视觉区分度，
但排除最后一项以避免出现双边框 */
.jet-ajax-search .jet-ajax-search__results-area .jet-ajax-search__results-list .jet-ajax-search__results-list-inner .jet-listing-grid__items .jet-listing-grid__item:not(:last-child){
border-bottom: 1px solid var(--gk-border-light);
}
/* 将搜索结果项的内边距设为0，因为BricksBuilder未提供相关UI调整选项 */
.jet-ajax-search .jet-ajax-search__results-area .jet-listing-grid__item {
padding: 0;
}
/* 移除"显示全部结果"按钮的默认焦点指示器（阴影效果）以保持样式统一 */
.jet-ajax-search .jet-ajax-search__results-holder .jet-ajax-search__full-results:focus {
box-shadow: none;
}
/* JetSearch插件bug修复：隐藏原本会占据空间的空消息容器 */
.jet-ajax-search .jet-ajax-search__results-area .jet-ajax-search__message:empty {
display: none;
}已知问题与Bug
自定义 Listing 模板下 jet-ajax-search__message 元素异常占据空间，导致 UI 错位
在Brickbuilder编辑器中使用JetSearch插件时，当Results Area > Listing设置为自定义Listing模板，系统会错误地为jet-ajax-search__message元素添加”show”这个CSS Class。
jet-ajax-search__message元素原本设计用于在搜索结果为空时显示错误信息，”show”类应该仅在无搜索结果时动态添加。
这个bug导致jet-ajax-search__message元素在不需要显示时也占据了页面空间，影响了页面布局和设计效果。
/*
:empty 选择器确保元素仅在真正有内容时（比如无结果的错误消息）才显示，
避免空白时影响页面结构。
*/
.jet-ajax-search__message:empty {
display: none;
}