文本,vitepress如何配置搜索框

简介: 文本,vitepress如何配置搜索框

vitepress搭建并部署网站 | AlbertZhang的文档网站 (bugdesigner.cn)

参考资料如上:

今天想在vitepress头部上配置一下搜索框:

直接来到config.js目录下

在config.js文件下添加如下代码:

   // 设置搜索框的样式
    search: {
      provider: "local",
      options: {
        translations: {
          button: {
            buttonText: "搜索文档",
            buttonAriaLabel: "搜索文档",
          },
          modal: {
            noResultsText: "无法找到相关结果",
            resetButtonTitle: "清除查询条件",
            footer: {
              selectText: "选择",
              navigateText: "切换",
            },
          },
        },
      },
    },

这样搜索框出现了


相关文章
|
自然语言处理 JavaScript 前端开发
使用Pagefind为VitePress文档添加离线全文搜索能力
前言 VitePress 相信大家都或多或少听说过或者用过了 默认 UI相比 VuePress2.x 好看,启动速度也快(由Vite驱动,当然VuePress也可以切换构建引擎至Vite) 做内容定制也相对简单,笔者的很多静态文档站点(使用VuePress1.x),文章内容多的时候启动非常的慢,于是就从之前的 VuePress 迁移到了 VitePress,并做了一个博客主题 @sugarat/theme => 之前也有过介绍一个简约风的VitePress博客主题 但是 VitePress 官方目前还没有内置开箱即用的搜索能力(相关PR还在施工中)
1245 0
|
XML 安全 IDE
【C/C++ 实用工具】CppCheck:静态代码检测工具,让你的代码更安全
【C/C++ 实用工具】CppCheck:静态代码检测工具,让你的代码更安全
4160 2
Failed to execute script ‘xxx‘ due to unhandled exception:No module named ‘ctypes‘
Failed to execute script ‘xxx‘ due to unhandled exception:No module named ‘ctypes‘
847 0
|
前端开发 搜索推荐 开发者
如何快速创建一个轻量美观的导航站?Typecho + MijiNav组合轻松完成
在信息过载的数字化时代,打造一个高质量、美观的网址导航页至关重要。本文推荐使用Typecho + MijiNav组合,轻松实现个性化导航网站。Typecho作为轻量级博客系统,安装简单、资源占用低;MijiNav主题设计现代、响应式适配多设备,并支持灵活自定义。通过三步:安装Typecho、配置MijiNav主题、自定义内容,非开发者也能快速搭建专业级导航页,满足个人与企业需求。
1453 40
|
存储 数据可视化 数据处理
optisystem输出到matlab的数据结构
optisystem输出到matlab的数据结构
|
数据采集 机器学习/深度学习 人工智能
Sitcom-Crafter:动画师失业警告!AI黑科技自动生成3D角色动作,剧情脚本秒变动画
Sitcom-Crafter 是一款基于剧情驱动的 3D 动作生成系统,通过多模块协同工作,支持人类行走、场景交互和多人交互,适用于动画、游戏及虚拟现实等领域。
1015 4
|
资源调度 JavaScript 搜索推荐
《VitePress 简易速速上手小册》第9章 VitePress 的扩展与插件(2024 最新版)
《VitePress 简易速速上手小册》第9章 VitePress 的扩展与插件(2024 最新版)
1130 0
|
JavaScript 前端开发 API
vue3 v-md-editor markdown编辑器(VMdEditor)和预览组件(VMdPreview )的使用
本文介绍了如何在Vue 3项目中使用v-md-editor组件库来创建markdown编辑器和预览组件。文章提供了安装步骤、如何在main.js中进行全局配置、以及如何在页面中使用VMdEditor和VMdPreview组件的示例代码。此外,还提供了一个完整示例的链接,包括编辑器和预览组件的使用效果和代码。
vue3 v-md-editor markdown编辑器(VMdEditor)和预览组件(VMdPreview )的使用
|
机器学习/深度学习 搜索推荐 数据可视化
小白入门机器学习必学案例分享。
小白入门机器学习必学案例分享。
1435 0
小白入门机器学习必学案例分享。
|
小程序 网络协议 物联网
小程序AP配网和AK配网教程(开源)
小程序AP配网和AK配网教程(开源)
1503 0