# Cài đặt section

## Hướng dẫn hiệu chỉnh & thiết lập cài đặt của section

{% hint style="info" %}
Cài đặt section cho phép bạn thiết lập chi tiết các thông số. Lưu ý cần nắm vững kiến thức trước khi thực hiện các thay đổi. Nền tảng cho phép bạn back-up. Tùy vào loại section bạn chọn sẽ có các thiết lập khác nhau.
{% endhint %}

### Các thành phần của section tiêu chuẩn bao gồm:

{% tabs %}
{% tab title="Section" %}

* Section dimension là kích thước.&#x20;
* Có thể điều chỉnh độ cao của section
* Độ rộng section được điều chỉnh tự động hoặc cố định, nhưng không chỉnh được thông số vì nền tảng sẽ tự động điều chỉnh độ rộng với các kích thước & độ phân giải màn hình

{% hint style="info" %}
Bạn có thể thêm các ảnh để tạo thành một slide show
{% endhint %}

![Section](https://235659313-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LxNXY8nDLFYd_XkkQrL%2F-LxOCsbqUnXNE0PZVvi5%2F-LxODZ2TMdWdAyhq_DmZ%2Fimage.png?alt=media\&token=c215861e-0ca8-4693-a35b-601ad60fe220)

{% hint style="info" %}
Các cài đặt của&#x20;

* Effect: các hiệu ứng slide
* Text fx: hiệu ứng chữ&#x20;
* ​Arrows: hiệu ứng mũi tên
* Slide mode: chế độ chạy của slide&#x20;
* Duration between: thời gian chuyển slide
  {% endhint %}

![Slideshow Settings](https://235659313-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LxNXY8nDLFYd_XkkQrL%2F-LxODcfgo1caf2__6Px6%2F-LxODj-Qc02MIJjkIe1N%2Fimage.png?alt=media\&token=0e2b7b5f-553b-49dc-8d23-93d414ac4c2a)
{% endtab %}

{% tab title="Item" %}

* Item là gom nhóm của các element nằm trong section
* Có thể thêm một element trong một khối item
* Có thể thay đổi layout của item&#x20;

{% hint style="info" %}
Item là một khối chứa nhiều element bên trong
{% endhint %}

![Item settings](https://235659313-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LxNXY8nDLFYd_XkkQrL%2F-LxODcfgo1caf2__6Px6%2F-LxOE66deO-_JgKPOcL8%2Fimage.png?alt=media\&token=9183e129-10f0-469b-8795-85a01f72fcbf)

{% hint style="info" %}
Item layout cho phép sắp xếp các lớp element&#x20;
{% endhint %}

![Item layout](https://235659313-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LxNXY8nDLFYd_XkkQrL%2F-LxODcfgo1caf2__6Px6%2F-LxOETIPLFIwCa5xJKel%2Fimage.png?alt=media\&token=287c5cf7-cac1-464d-9ba9-f52d54ed913d)

{% hint style="info" %}
Item align triệu tập và căn lề các element
{% endhint %}

![Item Align](https://235659313-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LxNXY8nDLFYd_XkkQrL%2F-LxODcfgo1caf2__6Px6%2F-LxOEdXCI3-0hQ4LoRh_%2Fimage.png?alt=media\&token=12e272c6-3bd0-446d-bfce-8b9a085a12be)

{% hint style="info" %}
Width & Margin cho phép chỉnh kích thước độ rộng & khoảng cách lề content
{% endhint %}

&#x20;

![Item width & margin](https://235659313-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LxNXY8nDLFYd_XkkQrL%2F-LxODcfgo1caf2__6Px6%2F-LxOF9vLepRyIIKwlQzi%2Fimage.png?alt=media\&token=c1559478-5b44-4bf0-b071-66a831d45235)
{% endtab %}

{% tab title="Effects" %}

* Hiệu ứng cho phép điều chỉnh toàn bộ animation trên trang
* Hiệu ứng cuộn chuột
* Hiệu ứng click enter

{% hint style="info" %}
Các hiệu ứng có thể làm giảm tốc độ load trang nên cân nhắc khi sử dụng nhiều hiệu ứng trong một trang.
{% endhint %}

![Effects](https://235659313-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LxNXY8nDLFYd_XkkQrL%2F-LxOFIJbuQSmA87ptF_q%2F-LxOHZO6OXVJe_3MbsH_%2Fimage.png?alt=media\&token=ba50ff37-1834-4ca8-a80a-16e7d9edc0be)

{% hint style="info" %}
Lưu ý thiết lập bộ lọc màu sắc của image, độ trong của ảnh và màu sắc
{% endhint %}

![Image filters & Opacity & Color](https://235659313-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LxNXY8nDLFYd_XkkQrL%2F-LxOHkK5LyuwAYSArGgu%2F-LxOLLl0b_BhqStGmRDA%2Fimage.png?alt=media\&token=a4b18346-690f-4939-bcb4-b1a29d436345)
{% endtab %}

{% tab title="PRO" %}

* Chức năng cho phép bạn điều chỉnh section chuyên nghiệp
* Thay đổi kích thước, căn lề, và tùy chỉnh khoảng cách giữa các element

{% hint style="info" %}
Bạn có thể tùy chọn các kiểu section tại đây hoặc thực hiện hard reset trong trường hợp muốn đưa về mặc định
{% endhint %}

![Section setting PRO](https://235659313-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LxNXY8nDLFYd_XkkQrL%2F-LxOHkK5LyuwAYSArGgu%2F-LxOMgBDQ2YQJGeo2uVL%2Fimage.png?alt=media\&token=b40c788f-d777-4bf0-9ad4-fe72cb8a069d)

{% hint style="info" %}
Lưu ý: để đồng bộ giữa các thiết kế nên ghi chú lại kích thước để điều chỉnh các section khác. Chức năng này nâng cao bạn cần hiểu về thiết kế, bố cục, tỷ lệ trước khi thực hiện thay đổi tại đây.
{% endhint %}
{% endtab %}
{% endtabs %}
