Hướng dẫn tùy chỉnh trong Styles Layout

Trong bài này sieutocviet sẽ giới thiệu cơ bản các chức năng trong phần styles, layout, của flatsome để bạn có thể chỉnh sửa trang wordpress của bạn dễ dàng hơn.

Để một trang của bạn trở nên đẹp hơn nên tủy chỉnh thêm tại styles, layout của Flatsome

Tùy chỉnh Style, layout – 1.Cơ bản trong Style trong Flatsome:

  1. Color
    • Main Color: tùy chỉnh màu sắc của website, bao gồm 4 loại màu ( Primary Color : màu chủ đạo của website, Secondary Color : màu nhấn của website , Success Color : màu chữ thông báo thành công , Alert Color : màu chữ thông báo
    • Type : tùy chỉnh màu chữ website
      • Base Color : Tùy chỉnh màu chữ toàn bộ website
      • Headline Color : Tùy chỉnh màu chữ tiêu đề website
      • Devider Color : Tùy chỉnh màu đường kẻ website
    • Link : tùy chỉnh màu của link
      • Link colors : tùy chỉnh màu của link
      • Link colors:hover : tùy chỉnh màu của link khi đưa chuột vào link đó
    • Shop Color :
      • Add to cart / Checkout buttons : màu của nút thêm vào giỏ và thanh toán
      • Sale bubble : màu của nhãn dán Khuyến mãi
      • New bubble : màu của nhãn dán Sản phẩm mới
      • Review Stars : màu của các ngôi sao khi nhận xét
  2. Typography : tùy chỉnh Font Chữ của Website
    • Headlines : tùy chỉnh Font Chữ của các tiêu đề trên website ( Thẻ H1, H2, H3 , … )
    • Base : tùy chỉnh Font Chữ, cỡ chữ,  cho toàn bộ văn bản trên website
    • Navigation : tùy chỉnh Font Chữ cho thanh menu
    • Text Transforms : tùy chỉnh kiểu chữ in hoa
  3. Global Styles: trong này chỉ có một tùy chọn cho Border buttom, Bạn có thể chọn học là tùy chọn trong cách thành phần khác
  4. Custom CSS: Nơi bạn có thể thêm nhanh code css để trang trí cho trong web của mình. Hơn thế nữa ở trong này Flatsome đa phân chia thành 3 loại màn hình cho chúng ta code vào. Chúng sẽ được áp dụng vào từng loại màn hình khi responsive về độ phân giải tương ứng với màn hình đó.

  5. Images Lightbox:Ở đây bạn có thể bật hoặc tắt nó + với việc chọn được màu background cho lightbox hiển thị.

    Nếu bạn không biết Lightbox  là gì thì nói được định nói như:

    Về bàn chất nó là một thông điệp tương tác xuất hiện để thu hút sự chú ý nhất định nơi khách hàng, người xem.  Thực tế, nó hoàn hảo cho việc quảng cáo bán hàng, thu thập địa chỉ liên lạc mới và khách hàng tiềm năng, hoặc chỉ là một cách hay để chào hỏi.  Các lightbox đi kèm với các thiết kế ấn tượng, bạn có thể cá nhân hoá theo phong cách độc đáo của trang web của bạn. Thiết kế lightbox cần chú ý một mục cụ thể hoặc nhận thêm nhiều mục đăng ký? Không phải là một vấn đề, với Lightbox bạn có thể làm nổi bật những gì quan trọng của bạn với một thông điệp đẹp được bật lên.

Ở mức độ cơ bản, ở phần này các bạn chỉ cần quan tâm tới 3 phần chính cho mình, đó là Colors, Typography và Custom CSS

Color: Bao gồm các tùy chỉnh về màu sắc của website, có 5 chế độ màu cho một website, các bạn có thể tùy chỉnh theo ý thích.

Typography: Bao gồm các tùy chỉnh về font chữ của website, tại đây các bạn có thể tùy chỉnh các font của Google.

Custom CSS: Phần này là nơi các bạn thêm vào một số tùy chỉnh Css cho website. Tuy nhiên, mình không khuyến khích các bạn thêm CSS vào phần này, vì sẽ khó để kiểm tra sau này.

 

Tùy chỉnh Style, layout – 2.Cơ bản trong Layout trong Flatsome:

Trong phần này chúng ta có thể cấu hình một số thành phần cơ bản sau: Layout Mode Bạn có thể chọn Full Width

Site Content Width Chọn chiều rộng tối đa cho trang web của mình

Background color  Chọn màu nền cho trang web.

Background Image Hình nền cho trang web là gì.

Background Repeat Hình nền có repeat hay không.

Content color Màu chữ

Content Background Màu nền của khối nội dung.

Các bạn có thể dựa trên những cơ bản trên để tùy biến cho mình một website thật đẹp thật dễ dàng tiếp cận nhé.

[devwp_posts_related]