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 with ``` code and ```
{{% /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

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Star
    151333
  • Fork
    22497
  • Issues
    391
  • Updated
    01-11-2019

Đăng ký nhận email từ 12bit.vn

Để không bao giờ bỏ lỡ bất cứ điều gì hay ho.

Bình luận

Hỗ trợ markdown