Shortcodes

Bên cạnh những shortcode đã được tích hợp sẵn trong Hugo, tụi mình còn build thêm một số shortcode để phục vụ cho việc thể hiện nội dung bài viết được rõ ràng và sinh động hơn.

codepen

{{<codepen username pen_id height_in_px>}}

Nếu không set giá trị height thì height mặc định sẽ là 500px. Ví dụ:

{{<codepen tatthien LgMKpm 400>}}

alert

Thay vì dùng {{< >}} chúng ta sẽ dùng {{% %}} để có thể sử dụng Markdown bên trong shortcode.

{{% alert type %}}
Nội dung bên trong. **Tự tin dùng markdown đi các bạn!**
{{% /alert %}}

success

{{% alert success %}}
Chúc mừng! **bạn đã được tăng lương**.
{{% /alert %}}

Chúc mừng! bạn đã được tăng lương.

warning

{{% alert warning %}}
Chú ý ngã 4
{{% /alert %}}

Chú ý ngã 4

danger

{{% alert danger %}}
Xin đừng hút thuốc
{{% /alert %}}

Xin đừng hút thuốc

info

{{% alert info %}}
https://12bit.vn là nơi chia sẻ kiến thức lập trình web.
{{% /alert %}}

https://12bit.vn là nơi chia sẻ kiến thức lập trình web.

runkit

{{% runkit %}}
your code block here
{{% /runkit %}}
const object1 = {}; Reflect.set(object1, 'property1', 42); console.log(object1.property1); // expected output: 42 const array1 = ['duck', 'duck', 'duck']; Reflect.set(array1, 2, 'goose'); console.log(array1[2]); // expected output: "goose"

caniuse

{{<caniuse features="proxy">}}

mermaid

{{< mermaid >}}
graph TB
    c1-->a2
    subgraph one
    a1-->a2
    end
    subgraph two
    b1-->b2
    end
    subgraph three
    c1-->c2
    end
{{< /mermaid >}}
graph TB c1-->a2 subgraph one a1-->a2 end subgraph two b1-->b2 end subgraph three c1-->c2 end

image-zoom

{{< zoom-img src="/img/articles/default-thumb-1200-630.png" >}}

oembed

{{< oembed url="https://open.spotify.com/playlist/37i9dQZEVXbc3uyDjJcA7l" title="ahhi" >}}

gh-repos

{{<gh-repos "vuejs/vue">}}

vuejs/vue

This is the repo for Vue 2. For Vue 3, go to https://github.com/vuejs/core

  • Star
    203663
  • Fork
    33730
  • Issues
    635
  • Updated
    tháng 5 19, 2023