Thay đổi giao diện website bất kì đơn giản với Stylish

Chào các bạn, nếu bạn đang cảm thấy chán nản với giao diện của các website ví dụ như youtube, facebook hay website nào đó (bạn không quản lý) nhưng bạn lại muốn đổi giao diện trang đó, thường thì các bạn thường tải các extension có sẳn rồi chọn theme thôi đúng không ? Cách này khá là nhanh gọn, nhưng sẽ hơi bị gò bó, với lại cái này hầu như chỉ cho những trang lớn như facebook, youtube,.. còn những trang khác hầu như là không có. Trong hôm nay mình sẽ hướng dẩn các bạn cách thay đổi giao diện website khác đơn giản. Cái này cần đòi hỏi 1 tý kiến thức về CSS, nếu bạn không biết 1 chút gì về CSS thì cũng có thể chọn theme sẳn.

Hình Minh Họa

Các Bước Thực Hiện

Bước 1: Cài Extension Stylish tại đây
Bước 2: Vào trang bạn cần chỉnh sửa, trên thanh các công cụ bạn click chọn biểu tượng logo của Stylish → Ba chấm → Create New Style
Bước 3: Bước này là bước quan trọng nhất, các bạn chỉ cần nhập CSS cần sửa của các bạn vào trong ô Code 1, sau khi sửa xong các bạn ấn Save để lưu lại giao diện.

Hình minh họa

Thay đổi độ lớn khung sửa code của Blogger

Nếu bạn là một người thường xuyên chỉnh sửa template bằng khung sửa code live trên Blogspot một thời gian lâu thì thấy sẽ hơi khó chịu, gò bó vì khung không được hiển thị hết vì bị các phần tử khác chiếm diện tích. Nên mình đã vận dụng thủ thuật thay đổi giao diện trên để ẩn đi các phần tử không đáng hiển thị, và kéo dài khung code ra. Nếu các bạn cần thì có thể lấy đoạn code bên dưới.

header.gb_Xa{display:none}
#blogger-app{background: #fff;}
.rb .K3JSBVB-i-m{padding-top:0}
.K3JSBVB-lb-f{display:none}
.K3JSBVB-lb-e{top:25px!important}
.K3JSBVB-lb-l, .K3JSBVB-lb-e{right: 18px;}
.K3JSBVB-j-a{bottom: -38px;}
.CodeMirror{border: 1px solid #c3c3c3;}
.editor .composeBox{max-width:90%}
#postingComposeBox{width:80%; }

Trước khi chỉnh sửa

Sau khi chỉnh sửa

Lời Kết

Sau khi xem xong bài viết này thì chắc hẳn trong đầu các bạn nảy ra nhiều ý tưởng mới lắm nhỉ :)) Ngoài ra Extension còn rất nhiều ứng dụng hay nữa, nhưng mình sẽ để cho các bạn tự mày mò :)) Mày mò thế chắc sẽ thú vị hơn đấy. Như vậy là mình vừa hướng dẫn xong các bạn cách thay đổi giao diện website bất kì đơn giản với Stylish. Nếu các bạn có theme nào hay thì đừng quên share cho anh em cùng sử dụng nhé!
Chúc các bạn thành công!