# Trang chủ

## Giới thiệu

Trang chủ hay còn gọi là “Homepage” là trang đầu tiên khi người dùng truy cập vào website của bạn. Đây là trang web mặc\
định khi bạn truy cập vào địa chỉ website thì chỉ chứa tên miền đó.

Mục đích của trang chủ trên website là giúp điều hướng người dùng đến các trang khác bằng cách nhấp vào các liên kết hay\
các danh mục trên trang chủ hoặc gõ vào thanh tìm kiếm trên trang. Từ đó, bạn sẽ được chuyển hướng đến các trang đích.

Trang chủ của 1 website cơ bản thì sẽ bao gồm các nội dung sau:

### Thẻ meta trang chủ

Thẻ Meta là các đoạn văn bản mô tả nội dung của trang, các thẻ này không xuất hiện trên chính trang mà chỉ xuất hiện\
trong phần mã nguồn của trang. Về cơ bản chúng giúp cho các công cụ tìm kiếm hiểu rõ hơn về nội dung của một trang web,\
do vậy rất tốt cho SEO.

Dưới đây là cách thức lấy thẻ meta trang chủ của website:

```
{% block meta %}
    {{ headTitle('Trang chủ').setSeparator(' - ').setAutoEscape(false)|raw }}
    <meta name="keywords" content="Trang chủ">
    <meta name="description" content="Trang chủ">
    <link rel="canonical" href="{{ getCurrentUrl(true) }}" />
    <meta property="og:url" content="{{ getCurrentUrl(true) }}">
    <meta property="og:image" content="{{ getBusinessLogo() }}">
    <meta property="og:type" content="website">
    <meta property="og:title" content="Trang chủ">
{% endblock %}

```

### Banner trang chủ

Banner website có thể hiểu là những ô vuông trên đó có slogan, logo, ký hiệu và các thông điệp được đặt trên những vị\
trí bắt mắt của một website, giúp thu hút lượng người truy cập qua đó vào website để nâng cao doanh số bán hàng.

Dưới đây là cách thức lấy banner trang chủ của website:

```
{% set banner_home = getBannerByPositionCode('BANNER_HOME') %}
{% if(banner_home is not empty) %}
     {% for c in banner_home %}
        {{ c.viewLink }}
        {{ c.imageSrc }}
        {{ c.target }}
        {{ c.name }}
        {{ c.intro }}
        {{ c.description }}
    {% endfor %}
{% endif %}

```

Trong đó <mark style="color:red;">`BANNER_HOME`</mark> là mã vị trí của banner (có thể thay đổi tên tùy theo vị trí cũng\
như chức năng của từng banner) sẽ được tạo trong trang quản trị website.

<figure><img src="/files/iQCi5KSxnaIYL6w1LlfK" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/30OPxXRiYGHjJ2kGgwea" alt=""><figcaption><p>Banner trang chủ</p></figcaption></figure>

### Banner danh mục sản phẩm

Để người dùng có thể chuyển hướng đến các danh mục sản phẩm mình thích được nhanh chóng hơn.

Dưới đây là cách thức lấy banner danh mục sản phẩm của website:

```
{% set category = getCategories() %}
{% if category is not empty %}
    {% for c in category %}
        {{ c.viewLink }}
        {{ c.name }}
        {{ c.imageUri }}
    {% endfor %}
{% endif%}

```

<figure><img src="/files/mffuEcKpUBqiQnuEBvTq" alt=""><figcaption><p>Ảnh đại diện danh mục sản phẩm</p></figcaption></figure>

### Sản phẩm mới

```
{% set newProduct = searchProducts({'limit':8,'showNew':1}) %}
{% if newProduct is not empty %}
      {% for np in newProduct %}
         {{ np.thumbnailUri }}
         {{ np.viewLink }}
         {{ np.name}}
         // Lấy thuộc tính cho sản phẩm
         {% set values = np.options.attrValues %}
         {% if(values is not empty) %}
           {% for v in values %}
                {% set color = v.options.attrContent %}
                {{ v.thumbnailUri }}
                {{ v.name }}
           {% endfor %}
         {% endif %}
         
         {% if(np.calcDiscountPercent > 0) %}
                {{ h.calcDiscountPercent }}%
         {% endif %}   
         {% if np.priceAfterDiscount > 0 %}
              {{ np.priceAfterDiscount | number_format(0) }}₫
              {{ np.price | number_format(0) }}₫
         {% elseif (np.oldPrice > 0) %}
                {{ np.price | number_format(0) }}₫
                {{ np.oldPrice | number_format(0) }}₫
         {% else %}
                 {{ np.price | number_format(0) }}₫
         {% endif %}
      {% endfor %}
    {% endif %}

```

Những sản phẩm được tích sản phẩm mới sẽ hiển thị tại đây

<figure><img src="/files/ImQJB3lV2E4yF0oFsegb" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/zVcYCxvMFL3eCKxVYpe6" alt=""><figcaption><p>Sản phẩm mới</p></figcaption></figure>

### Sản phẩm hot

```
{% set hotProduct = searchProducts({'limit':8,'showHot':1}) %}
{% if hotProduct is not empty %}
      {% for hp in hotProduct %}
         {{ hp.thumbnailUri }}
         {{ hp.viewLink }}
         {{ hp.name}}
         // Lấy thuộc tính cho sản phẩm
         {% set values = hp.options.attrValues %}
         {% if(values is not empty) %}
           {% for v in values %}
                {% set color = v.options.attrContent %}
                {{ v.thumbnailUri }}
                {{ v.name }}
           {% endfor %}
         {% endif %}
         
         {% if(hp.calcDiscountPercent > 0) %}
                {{ hp.calcDiscountPercent }}%
         {% endif %}   
         {% if hp.priceAfterDiscount > 0 %}
              {{ hp.priceAfterDiscount | number_format(0) }}₫
              {{ hp.price | number_format(0) }}₫
         {% elseif (hp.oldPrice > 0) %}
                {{ hp.price | number_format(0) }}₫
                {{ hp.oldPrice | number_format(0) }}₫
         {% else %}
                 {{ hp.price | number_format(0) }}₫
         {% endif %}
      {% endfor %}
    {% endif %}

```

Những sản phẩm được tích sản phẩm hot sẽ hiển thị tại đây

<figure><img src="/files/TFphA5yiISkeJvoDcE4U" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/LzckfVPE8ipL357JzjMA" alt=""><figcaption><p>Sản phẩm hot</p></figcaption></figure>

### Sản phẩm trang chủ

```
{% set homeProduct = searchProducts({'limit':8,'showHome':1}) %}
{% if homeProduct is not empty %}
      {% for n in homeProduct %}
         {{ n.thumbnailUri }}
         {{ n.viewLink }}
         {{ n.name}}
         // Lấy thuộc tính cho sản phẩm
         {% set values = n.options.attrValues %}
         {% if(values is not empty) %}
           {% for v in values %}
                {% set color = v.options.attrContent %}
                {{ v.thumbnailUri }}
                {{ v.name }}
           {% endfor %}
         {% endif %}
         
         {% if(n.calcDiscountPercent > 0) %}
                {{ n.calcDiscountPercent }}%
         {% endif %}   
         {% if n.priceAfterDiscount > 0 %}
              {{ n.priceAfterDiscount | number_format(0) }}₫
              {{ n.price | number_format(0) }}₫
         {% elseif (n.oldPrice > 0) %}
                {{ n.price | number_format(0) }}₫
                {{ n.oldPrice | number_format(0) }}₫
         {% else %}
                 {{ n.price | number_format(0) }}₫
         {% endif %}
      {% endfor %}
    {% endif %}

```

Những sản phẩm được tích trang chủ sẽ hiển thị tại đây

<figure><img src="/files/xAxvIrVdY3avsTYZe31Z" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/G1b04DWZPa05GqOAQz9f" alt=""><figcaption><p>Sản phẩm được tick trang chủ</p></figcaption></figure>

### Sản phẩm giảm giá

```
{% set discountProduct = searchProducts({'limit':8,'discount':1}) %}
{% if discountProduct is not empty %}
      {% for ds in discountProduct %}
         {{ ds.thumbnailUri }}
         {{ ds.viewLink }}
         {{ ds.name}}
         // Lấy thuộc tính cho sản phẩm
         {% set values = ds.options.attrValues %}
         {% if(values is not empty) %}
           {% for v in values %}
                {% set color = v.options.attrContent %}
                {{ v.thumbnailUri }}
                {{ v.name }}
           {% endfor %}
         {% endif %}
         
         {% if(ds.calcDiscountPercent > 0) %}
                {{ ds.calcDiscountPercent }}%
         {% endif %}   
         {% if ds.priceAfterDiscount > 0 %}
              {{ ds.priceAfterDiscount | number_format(0) }}₫
              {{ ds.price | number_format(0) }}₫
         {% elseif (ds.oldPrice > 0) %}
                {{ ds.price | number_format(0) }}₫
                {{ ds.oldPrice | number_format(0) }}₫
         {% else %}
                 {{ ds.price | number_format(0) }}₫
         {% endif %}
      {% endfor %}
    {% endif %}

```

Những sản phẩm được nhập giá mới và giá cũ sẽ hiển thị tại đây

<figure><img src="/files/DDOKv1hWfDHLW24P82Jl" alt=""><figcaption></figcaption></figure>

Ví dụ một block hoàn chỉnh lấy sản phẩm:

```
{% set newProduct = searchProducts({'limit':8,'showNew':1}) %}
{% if newProduct is not empty %}
      {% for nw in newProduct %}
         {{ nw.thumbnailUri }}
         {{ nw.viewLink }}
         {{ nw.name}}
         // Lấy thuộc tính cho sản phẩm
         {% set values = nw.options.attrValues %}
         {% if(values is not empty) %}
           {% for v in values %}
                {% set color = v.options.attrContent %}
                {{ v.thumbnailUri }}
                {{ v.name }}
           {% endfor %}
         {% endif %}
         
         {% if(nw.calcDiscountPercent > 0) %}
                {{ nw.calcDiscountPercent }}%
         {% endif %}   
         {% if nw.priceAfterDiscount > 0 %}
              {{ nw.priceAfterDiscount | number_format(0) }}₫
              {{ nw.price | number_format(0) }}₫
         {% elseif (nw.oldPrice > 0) %}
                {{ nw.price | number_format(0) }}₫
                {{ nw.oldPrice | number_format(0) }}₫
         {% else %}
                 {{ nw.price | number_format(0) }}₫
         {% endif %}
      {% endfor %}
    {% endif %}

```

### Tạo nút yêu thích cho sản phẩm

```
<div class="_addWishList" data-id="{{ productId }}">
    <i class="fa-thin fa-heart"></i>
</div>
```

<figure><img src="/files/2y7bKW6m5Q2H1Q6AvISu" alt=""><figcaption><p>Nút yêu thích và thuộc tính màu sắc của sản phẩm</p></figcaption></figure>

### Banner bộ sưu tập

Là nơi để chuyển hướng nhanh đến bộ sưu tập sản phẩm mà người dùng yêu thích

Dưới đây là cách thức lấy banner bộ sưu tập của website:

```
{% set albumHome = searchAlbum({'limit': 1}) %}
    {% if(albumHome is not null or albumHome is not empty) %}
        {% for a in albumHome %}
           {{ a.name }}
           {{ a.description |raw }}   
           {{ a.viewLink }}
           {{ a.thumbnailUri }}   
           {% set albumItems = getAlbumItems(a.id,{'limit': 4}) %}
           {% if(albumItems is not null or albumItems is not empty) %}
                {% for b in albumItems %}
                    {{ a.viewLink }}
                    {{ b.imageUri }} 
                    {{ b.description | striptags }}
                {% endfor %}
           {% endif %}
        {% endfor %}
    {% endif %}

```

<figure><img src="/files/EgSAlMGGKjekbaV8Mnwy" alt=""><figcaption><p>Bộ sưu tập</p></figcaption></figure>

### Tin tức

Luôn cập nhật những tin tức mới nhất lên trang web của bạn

Dưới đây là cách thức lấy tin tức của website:

```
{% set lastestNews= getHotNews({'limit':5}) %}
{% if(lastestNews is not empty) %}
    {% for i in lastestNews %}
        {{ i.viewLink }}
        {{ i.imageUri }}
        {{ i.title  | striptags }}
        {{ i.intro | striptags  }}
        {{ i.createdDateTime }}
    {% endfor %}
{% endif %}
```

<figure><img src="/files/GWxpeRtjS7n0Llva1O6o" alt=""><figcaption><p>Tin tức</p></figcaption></figure>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://webdocs.nhanh.vn/page/trang-chu.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
