Chia sẻ Blog

Light ModeDark Mode

Blog chia sẻ về thủ thuật.

[Jekyll] Hiển thị Liquid code trong bài viết

Published 4 years ago - 1 min read

liquid code

Khi bạn muốn trình bày một bài viết mà có mã Liquid code trong đó, thông thường Jekyll có thể hiểu lầm code và đưa nó vào để thi hành lệnh và tạo ra file HTML, thậm chí còn tạo ra một số lỗi dẫn tới không thể tạo ra bài đăng được. Để giải quyết vấn đề này làm như sau:

#1. Sử dụng thẻ raw

Ta chỉ cần đặt đoạn code cần hiển thị vào giữa {{ "{% raw " }}%}{{ "{% endraw " }}%}.

Ví dụ như muốn trình bày :

{% for post in site.posts %}
        <span class="post-meta">{{ post.date | date: "%b %-d, %Y" }}</span>
        <h2>
          <a class="post-link" href="{{ post.url | prepend: site.baseurl }}" title="{{ post.title | escape }}">{{ post.title | escape }}</a>
        </h2>
    {% endfor %}

Thì trong markdown là:

{% raw %}  {% for post in site.posts %}
        <span class="post-meta">{{ post.date | date: "%b %-d, %Y" }}</span>
        <h2>
          <a class="post-link" href="{{ post.url | prepend: site.baseurl }}" title="{{ post.title | escape }}">{{ post.title | escape }}</a>
        </h2>
    {% endfor %}  {% endraw %}

#2. Sử dụng {{ "" }}

Nhưng nếu bạn muốn hiển thị code {% raw %}{% endraw %} trong bài viết thì sử dụng cách trên không được. Mà ta phải thêm {{ " trước {% hoặc {{ , và " }} trước %} hoặc }} :

{{ "{% raw " }}%}  
.........  
{{ "{% endraw " }}%}
  • Ví dụ: Muốn hiển thị {{ "{% this " }}%} thì code markdown là:
{{ "{{ " }}"{{ "{% this" }} " }}{{ "}}%}
  • Ví dụ: Muốn hiển thị {{ "{{ this " }}}} thì code markdown là:
{{ "{{ " }}"{{ "{{ this" }} " }}{{ "}}}}

#3. Kết luận

Chỉ khi nào cần hiển thị code {% raw %}{% endraw %} trong bài viết thì ta sử dụng hướng dẫn #2, các trường hợp còn lại sử dụng hướng dẫn #1