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.

contributers

{{<contributors "12bitvn/12bit.vn">}}

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
    137435
  • Fork
    19577
  • Issues
    268
  • Updated
    03-05-2019
Sửa lần cuối bởi Duoc Nguyen vào ngày 04-05-2019: xem commit, bài lỗi? sửa ngay
Cảm ơn các bạn đã đóng góp vào bài viết này:
Duoc Nguyen
  • : init

Đă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