Chủ đề chung¶
Odoo cung cấp nhiều tùy chọn để định dạng giao diện trang web của bạn, bao gồm colors, fonts, và layout
Khi thiết lập website lần đầu tiên, bạn sẽ được nhắc chọn một giao diện. Di chuột lên các giao diện để xem bản xem trước mở rộng của mỗi giao diện. Nhấp vào một giao diện để chọn nó.
Ghi chú
Nếu bạn rời khỏi mà không chọn giao diện, trang web của bạn sẽ được tạo bằng giao diện mặc định.
Bạn có thể switch themes later nếu cần.
In the website builder, the Theme tab offers various options to customize your website's general theme. To access it, click Edit and go to the Theme tab.
Sau khi bạn đã thực hiện các thay đổi mong muốn, nhấn vào Save để xác nhận và áp dụng chúng vào trang web của bạn.
Chủ đề¶
Trong phần Website, nhấp vào Switch Theme để mở bộ chọn giao diện. Di chuột lên các giao diện để xem bản xem trước mở rộng của từng giao diện. Nhấp vào một giao diện để áp dụng nó vào website của bạn.
Màu sắc¶
Trình chỉnh sửa trang web của Odoo có hai loại màu chính: theme colors và status colors
Mà sắc Theme¶
Màu chủ đề đề cập đến bộ màu hiển thị trên tất cả các trang của trang web của bạn. Chúng được tạo thành năm màu: ba màu chính và hai màu sáng và tối.
Để chỉnh sửa màu sắc của website của bạn, hãy vào phần Colors trong trình chỉnh sửa website, sau đó:
Nhấp vào chấm màu bạn muốn thay đổi, sau đó chọn màu Solid hoặc nhấp vào Custom để tự chọn một tông màu cụ thể (hoặc thêm mã #HEX hoặc RGBA của nó).
Nhấn vào biểu tượng bảng màu và chọn một bảng màu. Kết quả là, tất cả các tùy chỉnh màu sẽ được đặt lại; nhấn vào một điểm màu để thay đổi màu cụ thể.
Odoo tự động tạo các Mẫu màu dựa trên bảng màu mà bạn chọn. Đây là các tổ hợp màu định sẵn, được áp dụng cho nhiều thành phần khác nhau trên trang web nhằm tạo nên một thiết kế hài hòa và thu hút. Khi bạn chọn một bảng màu, các mẫu màu sẽ xác định cách phân bổ màu sắc trên các thành phần của khối dựng, như nút bấm, nền và văn bản. Nếu muốn chỉnh sửa, bạn chỉ cần nhấp vào Mẫu màu và chọn mẫu màu để tùy chỉnh thêm. Mỗi mẫu màu bao gồm màu nền, màu chữ, tiêu đề, liên kết, nút chính và nút phụ cho các khối dựng của bạn.
Để áp dụng một bộ màu cho một khối xây dựng trên trang của bạn, chọn khối xây dựng, chuyển đến tab Customize, nhấp vào chấm màu nằm bên cạnh Background, và chọn một Theme.
Ghi chú
Thay đổi một bộ màu sẽ tự động cập nhật màu sắc cho cả bộ mặc định và các khối xây dựng nơi bộ màu được sử dụng.
Màu trạng thái¶
Màu trạng thái được dùng để chỉ thị trạng thái của một số hành động (ví dụ: Success, Warning, v.v.). Chúng được sử dụng trong các thông báo pop‑up xuất hiện để cung cấp phản hồi cho người dùng và khách truy cập website. Để tùy chỉnh Status Colors của website, cuộn xuống phần Advanced và nhấp vào các chấm để thay đổi màu.
Example
Bố cục trang¶
Tùy chọn Bố cục trang trong phần Trang web cho phép thay đổi cách hiển thị tổng thể và khoảng cách giữa các khối dựng cũng như thành phần trang web. Nhấp menu thả xuống và chọn bố cục mong muốn. Dưới Bố cục trang, tùy chỉnh Nền bằng cách chọn Hình ảnh, sử dụng hình ảnh đã chọn dưới dạng Họa tiết, hoặc để trống.
Phông chữ¶
Odoo cho phép bạn tùy chỉnh họ phông chữ và kích thước cho các thành phần cụ thể trên trang web của mình, bao gồm đoạn văn, tiêu đề, nút và trường nhập liệu.
Font Family: Trong các phần Paragraph, Headings và Button, chọn một phông chữ từ menu thả xuống.
Font Size: Trong các phần Paragraph, Headings, Button và Input Fields, sử dụng trường Font Size để đặt kích thước mặc định. Nhấn biểu tượng (mũi tên) để mở rộng phần và xác định kích thước tùy chỉnh (ví dụ, dựa trên mức tiêu đề, kích thước nút, v.v.).
Thêm vào đó, mỗi phần dành riêng cho phần tử cung cấp các tùy chọn kiểu dáng bổ sung, chẳng hạn như Line Height và Margins, để tùy chỉnh thêm.
Phông chữ tùy chỉnh¶
Có thể sử dụng các phông chữ trên website của bạn mà không có sẵn trong Odoo. Để thêm phông chữ tùy chỉnh, nhấp vào menu thả xuống liên quan đến trường Font Family và chọn Add a Custom Font ở cuối menu thả xuống. Trong cửa sổ pop-up:
Để thêm phông chữ Google, nhấp vào Chọn phông chữ Google và chọn phông chữ mong muốn trong danh sách. Nếu trang web của bạn hoạt động tại khu vực có quy định pháp lý nghiêm ngặt, chẳng hạn như GDPR của Liên minh Châu Âu, hãy tắt tùy chọn Cung cấp phông chữ từ máy chủ của Google. Việc này đảm bảo phông chữ sẽ được lưu trữ trên máy chủ của trang web thay vì từ máy chủ của Google.
Để tải lên phông chữ tùy chỉnh từ máy tính của bạn, nhấp vào Choose File
Sau khi hoàn thành, nhấn vào Save and Reload.
Kiểu nút¶
Để tùy chỉnh kiểu dáng của các nút chính và phụ trên website của bạn, hãy chuyển đến phần Button trong trình chỉnh sửa website và chỉnh sửa các tùy chọn liên quan:
Nhấp vào mũi tên bên cạnh các trường Primary Style hoặc Secondary Style và chọn một trong các kiểu có sẵn cho mỗi loại nút: Fill, Outline, hoặc Flat. Khi chọn Outline, tùy chọn Border Width sẽ xuất hiện bên dưới, cho phép bạn điều chỉnh độ rộng của viền nút.
Điều chỉnh Padding để thay đổi kích thước khoảng cách (tính bằng pixel) quanh nhãn của các nút.
Tùy chỉnh bán kính viền của các nút bằng tùy chọn Round Corners
Thêm hoạt ảnh khi nhấn nút trong menu thả xuống On Click Effect
Mẹo
Bạn có thể định nghĩa kích thước tùy chỉnh Small và Large cho Padding, Font Size và Round Corners của các nút: Nhấp vào biểu tượng (mũi tên) và sử dụng các trường liên quan.
Kiểu liên kết¶
Trong phần Link, nhấp vào Link Style để chọn cách hiển thị của các liên kết trên trang web của bạn. Chọn No Underline, Underline On Hover hoặc Always Underline trong menu thả xuống.