Tùy chỉnh thuộc tính CSS cho Blog bằng cách sử dụng Stylebot

Ở bài trước, tôi đã giới thiệu với bạn phần mềm thiết kế template cho blogger một cách nhanh chóng và chuyên nghiệp, tiếp tục hôm nay tôi sẽ giới thiệu cho bạn một Chrome Extension giúp tùy chỉnh kiểu dáng cho blog của bạn dễ dàng bằng tiện ích Stylebot.

Stylebot là gì? là một tiện ích mở rộng trên Google Chrome, với Stylebot nó sẽ giúp bạn stylizing blog/web của bạn theo cách bạn muốn bằng cách tùy biến css của blog/web cho dù bạn không biết gì về CSS mà vẫn có thể tạo ra những style đẹp. Trong hướng dẫn này tôi sẽ hướng dẫn bạn làm thế nào để tùy chỉnh blog của bạn bằng cách sử dụng tiện ích Stylebot.

Tùy chỉnh Blog/Web sử dụng Stylebot

Stylebot là một tiện ích trên Google Chrome, vì vậy để sử dụng tất nhiên là bạn phải sử dụng trình duyệt Google Chrome. Đầu tiên tải Stylebot từ Cửa hàng Google trực tuyến hoặc bấm vào đây để tải và cài đặt. Sau đó mở blog của bạn bằng cách gõ URL vào thanh địa chỉ. Sau khi cài đặt tiện ích Stylebot sẻ thấy một biểu tượng CSS được tích hợp trên trình duyệt Google Chrome bên cạnh thanh địa chỉ của bạn như hình dưới. Click vào nó và sau đó bấm Open Stylebot

Một bảng điều khiển sẽ mở ra để bạn tùy chỉnh blog của bạn. Chỉ cần di chuyển chuột qua blog/web, bạn sẽ thấy một đường viền màu xanh được bao quanh phần tử mà bạn chọn, Click để chọn đối tượng mà bạn muốn tùy chỉnh. Ngoài ra bạn có thể chọn đối tượng cần chỉnh sửa bằng cách nhấn chuột phải vào đối tượng, chọn Stylebot >> Style Element

Ở ví dụ này, tôi sẽ tùy chỉnh style cho tiêu đề của bài viết. ngoài ra bạn cũng có thể tùy chỉnh bất kỳ đối tượng nào trên blog/web mà bạn muốn.

Tùy chỉnh tiêu đề bài viết bằng Stylebot

Sau khi chọn phần tử cần tùy biến, các tùy chỉnh bên cửa sổ của Stylebot được kích hoạt. Ở đây bạn có thể tùy chỉnh tiêu đề bài viết của bạn bằng cách thay đổi của font chữ , tăng kích thước font chữ, thêm gạch dưới,... Bạn cũng có thể thiết lập lại các tùy chỉnh nếu style mà bạn thiết lập không đúng với ý đồ của bạn bằng cách nhấn vào nút Reset ở phía dưới của cửa sổ.

Khi bạn thực hiện và cảm thấy hài lòng với style mà bạn vừa tùy chỉnh, hãy nhấp vào nút Edit CSS nằm ở phía dưới của cửa sổ Stylebot (nó sẽ tự động sinh ra mã css) và sao chép mã CSS. Và bạn lấy mã CSS này chèn vào blog/web của bạn.

Chèn CSS vào blog của bạn

Đăng nhập blogger và đi đến Mẫu (template) >> Tùy chỉnh  (Customise) >> Nâng cao (Advance) và paste đoạn css vừa tùy chỉnh vào khung Thêm CSS tùy chỉnh (Add custom css), Sau đó nhấn Áp dụng cho Blog (Apply to Blog) 

Vậy là xong phần tùy chỉnh cho tiêu đề bài viết trên blog của bạn. Bạn có thể tùy chỉnh style cho bất kỳ phần tử nào trên blog/web của mình bằng cách làm tương tự các bước như trên.

Một khi bạn đã tùy chỉnh blog của bạn trong Stylebot nhưng bạn không áp dụng những thay đổi đó cho blog, nó sẽ vẫn hiển thị những thay đổi này thậm chí bạn thoát khỏi trình duyệt và tải lại blog của bạn, để loại bỏ điều này, mở blog của bạn và bấm nút Reset Page trên cửa sổ của nó.

Hy vọng với thủ thuật nhỏ này, sẽ giúp bạn trong việc tùy biến style cho blog/web của bạn một cách dễ dàng mà không cần phải biết gì về CSS.