Chủ đề chung

Odoo cung cấp nhiều tùy chọn để định hình chủ đề trang web của bạn, bao gồm màu sắc, phông chữbố cục.

Khi thiết lập trang web lần đầu tiên, bạn sẽ được nhắc chọn một chủ đề. Di chuyển chuột qua các chủ đề để xem bản xem trước mở rộng của từng chủ đề. Nhấp vào một chủ đề để chọn nó.

Ghi chú

  • Nếu bạn thoát mà không chọn chủ đề, trang web của bạn sẽ được tạo bằng chủ đề mặc định.

  • Bạn có thể chuyển đổi chủ đề sau nếu cần.

Trong trình xây dựng trang web, tab Chủ đề cung cấp nhiều tùy chọn để tùy chỉnh chủ đề chung cho trang web của bạn. Để truy cập, nhấp vào Chỉnh sửa và đi đến tab Chủ đề.

Sau khi thực hiện các thay đổi mong muốn, nhấp vào Lưu để xác nhận và áp dụng chúng cho trang web của bạn.

Chủ đề

Trong phần Trang web, nhấp vào Chuyển đổi chủ đề để mở trình chọn chủ đề. Di chuyển chuột qua các chủ đề để xem bản xem trước mở rộng của từng chủ đề. Nhấp vào một chủ đề để áp dụng nó cho trang web của bạn.

Màu sắc

Trình soạn thảo trang web của Odoo có hai loại màu chính: màu chủ đềmàu trạng thái.

Mà sắc Theme

Màu chủ đề đề cập đến bộ màu được hiển thị trên tất cả các trang của trang web. Chúng bao gồm 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 trang web, đi đến phần Màu sắc trong trình soạn thảo trang web, sau đó:

  • Nhấp vào chấm màu bạn muốn thay đổi, sau đó chọn màu Đặc hoặc nhấp vào Tùy chỉnh để chọn một tông màu cụ thể theo cách thủ công (hoặc thêm mã #HEX hoặc RGBA của nó).

  • Nhấp 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 sẽ được đặt lại; nhấp vào một chấm màu để thay đổi một 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.

Màu đặt sẵn

Để áp dụng màu đặt sẵn cho một khối xây dựng trên trang web, chọn khối xây dựng, đi đến tab Tùy chỉnh, nhấp vào chấm màu nằm bên cạnh Nền và chọn một Chủ đề.

Ghi chú

Thay đổi màu đặt sẵn sẽ tự động cập nhật màu sắc của cả màu đặt sẵn mặc định và các khối xây dựng nơi màu đặt sẵn được sử dụng.

Màu trạng thái

Màu trạng thái được sử dụng để chỉ ra trạng thái của các hành động nhất định (ví dụ: Thành công, Cảnh báo, v.v.). Chúng được sử dụng trong các thông báo bật lên xuất hiện để cung cấp phản hồi cho người dùng và khách truy cập trang web. Để tùy chỉnh Màu trạng thái của trang web, cuộn xuống phần Nâng cao và nhấp vào các chấm để thay đổi màu sắc của chúng.

Example

Lựa chọn màu trạng thái Cửa sổ bật lên thành công

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 bạn, bao gồm đoạn văn, tiêu đề, nút bấm và trường nhập liệu.

  • Font Family: Trong các phần Paragraph, HeadingsButton, chọn một phông chữ từ menu thả xuống.

  • Font Size: Trong các phần Paragraph, Headings, ButtonInput Fields, sử dụng trường Font Size để đặt kích thước mặc định. Nhấp vào 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 cấp độ tiêu đề, kích thước nút, v.v.).

Ngoài ra, mỗi phần dành riêng cho từng thành phần còn cung cấp các tùy chọn kiểu bổ sung, chẳng hạn như Line HeightMargins, để tùy chỉnh thêm.

Phông chữ tùy chỉnh

Bạn có thể sử dụng các phông chữ trên trang web của mình mà Odoo không cung cấp mặc định. Để 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ổ bật lên:

  • Để 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 tất, nhấp vào Save and Reload.

Kiểu nút bấm

Để tùy chỉnh kiểu của các nút chính và nút phụ trên trang web, điều hướng đến phần Button trong trình chỉnh sửa trang web 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 trường Primary Style hoặc Secondary Style và chọn một trong các kiểu có sẵn cho từng 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 đường viền nút.

  • Sửa đổi phông chữ.

  • Điều chỉnh Padding để thay đổi kích thước khoảng cách (tính bằng pixel) xung 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 hiệu ứng động khi nhấp vào nút trong menu thả xuống On Click Effect.

Nút chính và nút phụ

Mẹo

Bạn có thể xác định kích thước tùy chỉnh SmallLarge cho Padding, Font SizeRound 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.

Cài đặt khoảng đệm nút, kích thước phông chữ và góc bo tròn