styled-roam 使用教程

styled-roam 使用教程

styled-roam 😉 Roam Research [[roam/js]] extension for Writing with your lovely cards and beautiful theme 项目地址: https://gitcode.com/gh_mirrors/st/styled-roam

1. 项目介绍

styled-roam 是一个为 Roam Research 开发的自定义 CSS 和 JavaScript 扩展项目。通过这个扩展，用户可以为 Roam Research 添加个性化的主题和功能，从而提升写作和笔记体验。

2. 项目快速启动

要快速启动 styled-roam，请按照以下步骤操作：

1. 在 Roam Research 中添加一个代码块，并使用以下代码：

   window.URLScriptServer = 'https://styled-roam.vercel.app/';
   window.styledRoamDisabledFeatures = [
       // 'CardListMode',
       // 'CardFlowMode',
       // 'TreeTableMode',
       // 'DocumentMode',
       // 'CalendarMode',
       // 'DownloadMode',
       // 'FocusMode',
   ];
   var existing = document.getElementById('styled-roam');
   if (!existing) {
       var extension = document.createElement('script');
       extension.src = window.URLScriptServer + 'js/index.js';
       extension.id = 'styled-roam';
       extension.async = true;
       extension.type = 'text/javascript';
       document.getElementsByTagName('head')[0].appendChild(extension);
   }
   

2. 按下页面上的“BIG RED”按钮以启用脚本。

3. 应用案例和最佳实践

• 配合主题使用：styled-roam 可以与各种主题配合使用，例如 Candy 主题。在 CSS 文件中引入主题样式：

  @import url('https://styled-roam.vercel.app/Candy.css');
  

• 自定义功能：通过禁用 window.styledRoamDisabledFeatures 数组中的某些功能，用户可以自定义 styled-roam 的行为。

4. 典型生态项目

• Roam Research 相关扩展：dvargas92495/roam-js-extensions、Roamcult Themes、palashkaria/roam-modifiers、roamhacker/roam42、yoyooyooo/roam-enhance 等项目提供了 Roam Research 的更多扩展和定制选项，与 styled-roam 互补。

styled-roam 😉 Roam Research [[roam/js]] extension for Writing with your lovely cards and beautiful theme 项目地址: https://gitcode.com/gh_mirrors/st/styled-roam