Wolai 使用教程:嵌入小组件库,打造精美、强大的知识库主页
NotionPet:国产嵌入式小组件库
什么是 NotionPet?

- 选择自己喜欢的小组件;
- 点击「创建组件」,随后根据自己的需求对小组件进行个性化配置;

NotionPet 小组件介绍
小组件类型
- 基础组件:目前已有 30 种 左右的基础组件,包括天气类、时钟类「卡片翻牌时钟、环形多彩时钟等」、番茄钟、日历类「简约日历、倒计时」、热力图类、计算器、图片类「基础图片幻灯片」、学习类「每日一句古诗词/英语」、资讯类「微博热搜」、自媒体辅助类「访客统计、页面点赞统计、LED 文字跑马灯」等多种组件。
- 动态 Icon 组件:目前已有 10 多种动态 Icon 组件。其中,动态 Icon 又可以细分为日历类(包括动态日历、手办日历)、文字类(包括基础渐变文字、气泡文字、盾牌文字等多种类型)

小组件使用展示
基础组件使用范例
动态 Icon 使用范例
除了上述组件以外,NotionPet 正在快速开发一些好看、实用的组件,比如 LED跑马灯、翻译组件等。
参考资料
- Wolai 云笔记
- NotionPet 官网
- 《强化你的仪表盘:试试 Notion 类工具的国产组件库 NotionPet》——专文测评
- 动态图标组件使用教程
- 如何在Notion、wolai、flowus中接入对外公开页面全埋点:NotionPet百度统计组件使用教程
Wolai 使用教程:嵌入小组件库,打造精美、强大的知识库主页的更多相关文章
- 整合常用功能的JS小组件库-v1.0
function Alex() { //给予video.js的页面滚动到视频元素范围内自动播放/出范围暂停播放-----01 this.video_autoplay = function (box) ...
- 小程序-文章:微信小程序常见的UI框架/组件库总结
ylbtech-小程序-文章:微信小程序常见的UI框架/组件库总结 1.返回顶部 1. 想要开发出一套高质量的小程序,运用框架,组件库是省时省力省心必不可少一部分,随着小程序日渐火爆,各种不同类型的小 ...
- 微信小程序常见的UI框架/组件库总结
想要开发出一套高质量的小程序,运用框架,组件库是省时省力省心必不可少一部分,随着小程序日渐火爆,各种不同类型的小程序也渐渐更新,其中不乏一些优秀好用的框架/组件库. 1:WeUI 小程序–使用教程 h ...
- 如何快速为团队打造自己的组件库(下)—— 基于 element-ui 为团队打造自己的组件库
文章已收录到 github,欢迎 Watch 和 Star. 简介 在了解 Element 源码架构 的基础上,接下来我们基于 element-ui 为团队打造自己的组件库. 主题配置 基础组件库在 ...
- 1、小程序Vant_WebApp组件库的安装步骤和简单使用
Vant 1.小程序对于npm的支持 目前,小程序当中已经支持使用npm安装的第三方包,通过使用这些第三方包,我们可以提高对小程序开发的效率,但是在小程序当中使用所谓的npm包有如下的三个限制 不能支 ...
- 推荐3个小程序开源组件库——Vant、iView、ColorUI
推荐3个小程序开源组件库 在进行小程序开发时,经常会遇到编写组件方面的阻碍,这让我们花费大量的时间在页面以及 CSS 样式编写上.因此可以使用开源组件库,有些复杂的组件可以直接拿来使用,节省开发时间, ...
- 5个最优秀的微信小程序UI组件库
开发微信小程序的过程中,选择一款好用的组件库,可以达到事半功倍的效果.自从微信小程序面世以来,不断有一些开源组件库出来,下面5款就是排名比较靠前,用户使用量与关注度比较高的小程序UI组件库.还没用到它 ...
- Wuss Weapp 一款高质量,组件齐全,高自定义的微信小程序 UI 组件库
Wuss Weapp 一款高质量,组件齐全,高自定义的微信小程序 UI 组件库 文档 https://phonycode.github.io/wuss-weapp 扫码体验 使用微信扫一扫体验小程序组 ...
- 微信小程序UI组件库 iView Weapp快速上手
概述 今天在网上突然看到iView新出了一个微信小程序的组件库iView Weapp,自己就上手试了一下,发现用起来还是不错的,把自己使用的过程与大家分享下. 一 预览iView组件 1.可以在手机上 ...
- wussUI v1.0.0小程序UI组件库 第一期开发已完成
经过了两个月不到的开发时间,我们phonycode团队顺利的发布了小程序的UI组件库 wuss-ui 的第一个版本.目前大体预览如下 介绍 wussUI 现在有大概27个组件左右, 目前基础组件都有了 ...
随机推荐
- java 通过反射以及MethodHandle执行泛型参数的静态方法
开发过程中遇到一个不能直接调用泛型工具类的方法,因此需要通过反射来摆脱直接依赖. 被调用静态方法示例 public class test{ public static <T> T get( ...
- Python第九章实验报告
一.实验对象:<零基础学Python>第九章异常处理及程序调试的实例 二.实验环境:IDLE Shell 3.9.7 三.实验目的:了解和掌握常用的异常处理语句 四.实验过程: 实例01 ...
- Python第七章实验报告
一.实验名称:<零基础学Python>第7章 面向对象程序设计 二.实验环境:IDLE Shell 3.9.7 三.实验内容:5道实例.4道实战 四.实验过程: 实例01 创建大雁类并定义 ...
- sap shift语法
shift xxx LEFT DELETING LEADING / RIGHT DELETING TRAILING mask 语法. xxx中的第一或最后一个字符出现在mask中,则xxx左移或者右 ...
- 1 关于win10原生系统下 OCRmyPDF安装使用
win10原生系统下 OCRmyPDF安装使用长期以来一直在代替freepic2pdf的工具,因为在图片转化PDF时,如果没有勾选该软件 添加OCR层 选项,印象中事后无法挂OCR层上去.福昕风腾,A ...
- python渗透测试入门——Scapy库
Scapy 是一个用来解析底层网络数据包的Python模块和交互式程序,该程序对底层包处理进行了抽象打包,使得对网络数据包的处理非常简便.该类库可以在在网络安全领域有非常广泛用例,可用于漏洞利用开发. ...
- vivo 短视频用户访问体验优化实践
作者:vivo 互联网运维团队- Hu Tao 本文介绍了vivo短视频用户访问体验优化的实践思路,并简单讲解了实践背后的几点原理. 一.背景 我们平时在看抖音快手视频的时候,如果滑动到某个视频画面一 ...
- 中国科学院2019年大学生数学夏令营考试试题 选做 (Mathematica练习)
目录 试题 1 6 9 solution to (1) solution to (2) 相关读物 试题 选择性地做一些,没有对答案.能机器算的我就不拿纸笔算了,当然实际考试是笔试... 不定期更新 1 ...
- koa中间件的实现原理
koa中间件的实现原理如何?先来看一个例子. koa的执行顺序是这样的: const middleware = async function (ctx, next) { console.log(1) ...
- 【LeetCode动态规划#04】不同的二叉搜索树(找规律,有点像智力题)
不同的二叉搜索树 力扣题目链接(opens new window) 给定一个整数 n,求以 1 ... n 为节点组成的二叉搜索树有多少种? 示例: 思路 题意分析 先找一下关系 当n = 1时,如果 ...