• Testing out the documented features of HEXO & JS in the bamboo theme

    Consolidated from: https://yuang01.github.io/

    The purpose of this post is to see if everything documented actually works…

    Requires fancybox.js true

    一行一个图片

    一行多个图片(不换行)

    多行多个图片(每行2~8个图片)

    多行多个图片(每行2~8个图片)

    组合使用

    Buttons

    融入段落中按钮

    不设置任何参数的 按钮 适合融入段落中。 不设置任何参数的 按钮 适合融入段落中。 不设置任何参数的 按钮 适合融入段落中。 不设置任何参数的 按钮 适合融入段落中。 不设置任何参数的 按钮 适合融入段落中。 ### 空心和实心按钮 示例博客 示例博客 ### 大点的按钮和样式 开始使用 ### 环形按钮 开始使用 ### warning等颜色按钮 开始使用 开始使用 开始使用 开始使用 开始使用 ### warning等颜色空心按钮 开始使用 开始使用 开始使用 开始使用 开始使用 ### warning等颜色空心环形居中按钮 开始使用 开始使用 ### 带有头像和名称的按钮

    一行三个

    一行四个

    一行五个

    Rounded buttons 环形图标按钮

    环形图标居中按钮

    环形图标填充按钮

    Card Views 圆形图标按钮

    Checkbox 进度条示例

    纯文本测试

    支持简单的 markdown 语法

    支持自定义颜色

    绿色 + 默认选中

    黄色 + 默认选中

    青色 + 默认选中

    蓝色 + 默认选中

    增加

    减少

    Radio

    纯文本测试

    支持简单的 markdown 语法

    支持自定义颜色

    绿色

    黄色

    青色

    蓝色

    warning色

    success色

    danger色

    info色

    Progress Bars 进度条

    进度条测试

    进度条测试

    进度条测试

    进度条测试

    进度条测试

    Accordion Box

    查看图片测试

    Cyan 青色-默认打开

    查看默认打开的折叠框

    这是一个默认打开的折叠框。

    Green 查看代码

    查看代码测试

    这里写代码高亮部分

    Yellow 查看列表

    查看列表测试
    • haha
    • hehe

    Red 查看嵌套

    查看嵌套测试
    查看嵌套测试2
    查看嵌套测试3

    hahaha

    Tab 事例

    。。。

    !!!

    Inline Image 标签

    段落中插入图片

    这是 一段话。

    这又是 一段话。

    这又是 一段话。

    自定义图片并添加描述

    自定义图片
    自定义图片

    指定宽度

    随机生成风景(alt描述可有可无)
    随机生成风景(alt描述可有可无)
    随机生成二次元壁纸
    随机生成二次元壁纸

    设置占位背景色

    随机生成呆萌酱
    随机生成呆萌酱

    超链接标签

    ### 上述事例代码

    Post Link

    Include links to other posts.

    1
    2
    {% post_path filename %}
    {% post_link filename [title] [escape] %}

    //TODO: fix bug on post_path & post_link where it fails to find the post…

    You can ignore permalink and folder information, like languages and dates, when using this tag.

    For instance: {% post_link how-to-bake-a-cake %}.

    This will work as long as the filename of the post is how-to-bake-a-cake.md, even if the post is located at source/posts/2015-02-my-family-holiday and has permalink 2018/en/how-to-bake-a-cake.

    You can customize the text to display, instead of displaying the post’s title.

    Do not escape title.

    {% post_link Markup-manual 'bold custom title' false %}

    bold custom title

    Note 标签

    note演示效果

    markdown默认写法,左边框颜色,随着主题色改变

    我有一只小毛驴,我从来都不骑。

    适合引用一段话

    这是一个警告

    这是一个错误

    这是一个成功

    这是一个信息

    ## Noteblock 演示效果

    标题(可选)

    noteblock base

    标题(可选)

    noteblock quote

    标题(可选)

    noteblock warning

    标题(可选)

    noteblock success

    标题(可选)

    noteblock danger

    标题(可选)

    noteblock info

    Title 演示

    演示

    我是标题


    你好啊,未来越来越好哦

    我是标题


    你好啊,加油哦

    我是标题


    我是标题


    titleB 演示

    我是标题bbb

    我是标题bbb

    我是标题bbb

    Paragraph 段落文本

    段落文本演示

    我是一个文本高亮大萨达所多撒多撒多撒大多多撒多撒多撒大所多撒大多

    我是一个文本高亮大萨达所多撒多撒多撒大多多撒多撒多撒大所多撒大多

    我是一个文本高亮大萨达所多撒多撒多撒大多多撒多撒多撒大所多撒大多

    我是一个文本高亮大萨达所多撒多撒多撒大多多撒多撒多撒大所多撒大多

    我是一个文本高亮大萨达所多撒多撒多撒大多多撒多撒多撒大所多撒大多

    我是一个文本高亮大萨达所多撒多撒多撒大多多撒多撒多撒大所多撒大多

    我是一个文本高亮大萨达所多撒多撒多撒大多多撒多撒多撒大所多撒大多

    我是一个文本高亮大萨达所多撒多撒多撒大多多撒多撒多撒大所多撒大多

    我是一个文本高亮大萨达所多撒多撒多撒大多多撒多撒多撒大所多撒大多

    我是一个文本高亮大萨达所多撒多撒多撒大多多撒多撒多撒大所多撒大多

    我是一个文本高亮大萨达所多撒多撒多撒大多多撒多撒多撒大所多撒大多

    我是一个文本高亮大萨达所多撒多撒多撒大多多撒多撒多撒大所多撒大多

    我是一个文本高亮大萨达所多撒多撒多撒大多多撒多撒多撒大所多撒大多

    我是一个文本高亮大萨达所多撒多撒多撒大多多撒多撒多撒大所多撒大多

    Text 文本样式标签

    Text文本样式标签演示


    下划线 的文本

    着重号 的文本

    波浪线 的文本

    删除线 的文本

    键盘样式的文本 command + D

    密码样式的文本:这里没有验证码

    text color 文字颜色

    这是一个简单的文字我是一个文字高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文字高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文字高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文字高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文字高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文字高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文字高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文字高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文字高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文字高亮,唱着我们心肠的曲折

    我是一个居中文字高亮

    这是一个简单的文字我是一个文字高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文字高亮,唱着我们心肠的曲折

    text highlighting 文本高亮

    文本高亮演示效果
    这是一个简单的文字我是一个文本高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文本高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文本高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文本高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文本高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文本高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文本高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文本高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文本高亮,唱着我们心肠的曲折
    这是一个简单的文字我是一个文本高亮,唱着我们心肠的曲折

    Simple TABLE

    col 1 col 2 col 2
    cell 1,1 cell 1,2 left 1,3
    default 2,1 right 2,2 cell 2,3

    Timeline 时间线演示

    2021-01-01 1.0.3 -> 1.0.3

    1. 我是一个测试文字ghghgh
    2. 我是一个测试问题二’qweqw’,请问企鹅请问请问佛挡杀fgfgf佛第三节课。
    3. 我是一个测试问题三’fgfgfg’,请问企鹅请问请问佛挡杀trtrtr佛第三节课。

    2020-08-15 1.0.2 -> 1.0.2

    这是一段测试文字

    2020-08-08 1.0.0 -> 1.0.0

    1. 我是一个测试文字ghghgh
    2. 我是一个测试问题二’qweqw’,请问企鹅请问请问佛挡杀fgfgf佛第三节课。
    3. 我是一个测试问题三’fgfgfg’,请问企鹅请问请问佛挡杀trtrtr佛第三节课。

    Media

    Video视频

    video演示


    100%宽度

    50%宽度

    25%宽度

    Audio 音频

    YouTuber

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    {% youtuber video 5ROIU_9dYe4 %}

    start: 0,
    allowfullscreen: 1,
    autoplay: 0,
    hl: en,
    cc_lang_pref: en,
    cc_load_policy: 1,
    color: white,
    controls: 1,
    disablekb: 0,
    enablejsapi: 1,
    fs: 0,
    iv_load_policy: 3,
    loop: 0,
    modestbranding: 1,
    playsinline: 0,
    privacy_mode: yes,
    rel: 0,
    showinfo: 0,
    origin: blog.richiebartlett.com,
    widget_referrer: blog.richiebartlett.com
    {% endyoutuber %}

    Vimeo

    {% vimeo 56695094 %}

    Site-Card 演示

    Wikipedia

    {% wikipedia title:User_interface wikiButton:true lang:en sentences:5 %}

    Wikipedia

    Twitter

    {% twitter https://twitter.com/MillsReggie/status/1475339348170375171 %}

    FootNotes

    Easy to add internal references similar to Wikipedia within the article. Simply add a bracketed carot number (e.g. [ ^1 ]) in the paragraph. At the end of the article, place a section with each of the brackets and references like below:

    1
    2
    3
    4
    5
    ## Footnotes

    [ ^1 ]: [Frequently Asked Questions (FAQs) - U.S. Energy Information Administration (EIA)](https://www.eia.gov/tools/faqs/faq.php?id=97&t=3#:~:text=How%20much%20electricity%20does%20an,about%20877%20kWh%20per%20month.)
    [ ^2 ]: [Amazon.com: 2600W Power Supply for ASIC Miner](https://www.amazon.com/2600W-Supply-Compatible-BITMAIN-Antminer/dp/B08RHXSMMP/ref=sr_1_fkmr0_1?dchild=1&keywords=asic+miner+2600+watt&qid=1622263558&sr=8-1-fkmr0)
    [ ^3 ]: [Bank of America prioritized internal cloud. Now it's evaluating third-party providers](https://www.ciodive.com/news/bank-of-america-prioritized-internal-cloud-now-its-evaluating-third-party/565228/)

    https://github.com/guorant/hexo-footnote

    CodeBlocks

    Hi-World
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    // https://hexo.io/docs/syntax-highlight.html
    /*
    ```[language] [title] [url] [link text] [additional options]
    */

    let string = "Hello World";

    string += " all!";

    alert( string );

    Github 卡片

    Github用户卡片

    表格中加入用户卡片

    单个项目卡片

    表格中加入单个项目卡片

    GIST

    {% gist 18938572f5df000ebe06fbd1872e4e39 useHexo.md %}

    Post Excerpt

    Use text placed before the <!-- more --> tag as an excerpt for the post. excerpt: value in the front-matter, if specified, will take precedent.

    Example:

    1
    2
    3
    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
    <!-- more -->
    Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

    HEXO helpers

    https://hexo.io/docs/helpers

    HEXO variables

    https://hexo.io/docs/variables

    Prev:
    MathJax (LaTeX)
    Next:
    Building a New Blog for RichieBartlett.com
    Table of Contents
    Table of Contents