Obsidian, công cụ quản lý tri thức mạnh mẽ, đã trở thành lựa chọn hàng đầu của nhiều người dùng Việt Nam nhờ khả năng liên kết ghi chú linh hoạt và hệ sinh thái plugin phong phú. Tuy nhiên, giao diện mặc định của Obsidian đôi khi có thể cảm giác khá đơn điệu. Là chuyên gia tại 123thuthuat.com, chúng tôi hiểu rằng một không gian làm việc không chỉ cần chức năng mà còn phải truyền cảm hứng. Đó là lý do tại sao chúng tôi muốn chia sẻ bộ sưu tập các CSS snippet tùy chỉnh mà chúng tôi yêu thích. Đây không chỉ là những chỉnh sửa về mặt thẩm mỹ; chúng còn thay đổi cơ bản cách bạn tương tác với các ghi chú trong Obsidian, biến trải nghiệm sử dụng trở nên hấp dẫn và hiệu quả hơn đáng kể.
Để sử dụng CSS tùy chỉnh trong Obsidian, bạn chỉ cần vào Cài đặt (Settings) > Giao diện (Appearance), cuộn xuống phần CSS snippets, bật tính năng này lên, và sau đó đặt các tệp .css
của bạn vào thư mục snippets
vừa xuất hiện. Obsidian sẽ tự động áp dụng các kiểu được định nghĩa trong các tệp này.
1. Pretty Tables: Nâng Cấp Bảng Biểu Trực Quan Hơn
Bảng là một cách vô cùng hữu ích để tổ chức dữ liệu trong Obsidian. Chúng tôi thường xuyên sử dụng bảng để so sánh, tóm tắt thông tin, hiển thị số liệu thống kê và thậm chí là theo dõi các bài viết blog. Nhưng các bảng cơ bản của Obsidian trông khá đơn điệu. Đó là lý do chúng tôi sử dụng CSS snippet Pretty Tables để làm cho chúng trông đẹp mắt hơn nhiều. Snippet này cho phép bạn thực hiện những điều thú vị như bo tròn các góc bảng, tạo cảm giác mềm mại hơn, hoặc mở rộng chiều rộng bảng để chứa được nhiều nội dung hơn trên trang. Nó cung cấp năm giao diện khác nhau: Purple Red, Flat Blue, Latex, White Red và White Red Rounded.
Ngoài các kiểu chính này, CSS còn cung cấp các lớp (hack classes) để tùy chỉnh sâu hơn. Chúng cho phép bạn căn chỉnh văn bản sang trái, đặt chiều rộng cố định cho cột đầu tiên để sắp xếp tốt hơn, và thay đổi khoảng cách xung quanh bảng của bạn. Để áp dụng các kiểu này, bạn chỉ cần đặt tệp CSS được cung cấp vào thư mục snippets của vault Obsidian. Sau đó, thêm một cssclass
cụ thể vào phần frontmatter của các ghi chú. Điều này sẽ ngay lập tức làm cho bảng của bạn trông hấp dẫn và trực quan hơn.
2. Daily Notes: Điều Hướng Ghi Chú Hàng Ngày Thông Minh
Giao diện CSS snippet Daily Notes trong Obsidian, hiển thị các liên kết điều hướng nhanh đến ghi chú ngày hôm qua, ngày mai và cùng ngày năm trước.
Chúng tôi sử dụng Obsidian như một nền tảng nhật ký kỹ thuật số vì nó cung cấp một trung tâm tập trung, dễ tìm kiếm để ghi lại suy nghĩ, nhiệm vụ và quan sát hàng ngày. Từ việc ghi lại các cuộc họp, ghi chú ý tưởng, đến những sự cố nhỏ nhất trong ngày, chúng tôi đều ghi lại tất cả vào ghi chú hàng ngày. Để nâng cao trải nghiệm ghi chú, chúng tôi sử dụng CSS snippet Daily Notes trong vault Obsidian của mình. Snippet này tạo ra một tiêu đề động tự động liên kết đến ghi chú của ngày hôm qua, ngày mai và cùng ngày của năm trước. Điều này cải thiện đáng kể khả năng điều hướng và ngữ cảnh khi chúng tôi xem lại ghi chú hàng ngày của mình. Nó biến ghi chú hàng ngày tiêu chuẩn thành một nhật ký cá nhân mạnh mẽ, liên kết chặt chẽ hơn và hợp lý hóa cách chúng tôi nhìn lại hoặc lập kế hoạch cho tương lai.
3. Extended Typography: Biến Lời Văn Đẹp Hơn & Dễ Đọc
Các tùy chỉnh typography mở rộng trong Obsidian bằng CSS snippet, hiển thị các tùy chọn font chữ, kích thước, độ đậm, khoảng cách dòng và các hiệu ứng văn bản khác.
Obsidian cung cấp khả năng kiểm soát trực tiếp hạn chế đối với giao diện văn bản. Đó là lý do tại sao chúng tôi sử dụng CSS snippet Extended Typography, và nó mang lại quyền kiểm soát tốt đối với giao diện văn bản của chúng tôi. Nó hoạt động với plugin Style Settings, cho phép bạn cải thiện đáng kể trải nghiệm đọc và viết của mình trong Obsidian.
CSS snippet này cho phép bạn chọn các phông chữ khác nhau cho văn bản chính, tiêu đề và đề mục. Bạn có thể phóng to hoặc thu nhỏ văn bản so với mặc định của Obsidian và kiểm soát chính xác kích thước phông chữ. Nó cũng cho phép bạn làm cho văn bản đậm hơn hoặc siêu đậm. Ngoài việc điều chỉnh kích thước cơ bản, snippet còn cho phép bạn tinh chỉnh khoảng cách giữa các từ, ký tự và dòng, thậm chí điều chỉnh vị trí văn bản theo chiều dọc. Bạn có thể truy cập các tính năng OpenType nâng cao để tạo các kiểu độc đáo như kiểu số đa dạng hoặc chữ hoa nhỏ. Để làm nổi bật văn bản, bạn có thể thêm màu sắc vào các từ in đậm và in nghiêng, bật hoặc tắt gạch chân liên kết, hoặc thay đổi cách hiển thị các đoạn highlight. Snippet này biến đổi cơ bản cách bạn trải nghiệm ghi chú của mình.
4. Kanban Background: Hình Nền Độc Đáo Cho Bảng Kanban
Bảng Kanban trong Obsidian với hình nền tùy chỉnh được áp dụng bằng CSS snippet, thể hiện sự cá nhân hóa và làm sinh động giao diện quản lý tác vụ.
Plugin Kanban của Obsidian tích hợp thông minh tính năng quản lý tác vụ trực quan với cơ sở tri thức liên kết. Chúng tôi theo dõi các nhiệm vụ và quản lý lịch nội dung hàng tháng của mình bằng cách sử dụng Kanban trong Obsidian. Khả năng liên kết các nhiệm vụ trực tiếp với ghi chú chi tiết, nghiên cứu và các thông tin liên quan khác trong vault làm cho nó trở thành một công cụ quản lý tác vụ mạnh mẽ. Tuy nhiên, giao diện Kanban mặc định khá đơn giản. Để tăng thêm tính hấp dẫn trực quan, chúng tôi sử dụng CSS snippet Kanban Background.
Snippet này cho phép bạn thêm hình nền tùy chỉnh vào các bảng Kanban của mình. Nó hoạt động hoàn hảo trong cả chế độ sáng và tối của Obsidian. Bạn có thể sử dụng bất kỳ hình ảnh nào bằng cách chỉ cần chèn URL hình ảnh vào tùy chọn background-image: url();
. Bạn cũng có thể kiểm soát cách hình ảnh lặp lại bằng tùy chọn background-repeat
và điều chỉnh kích thước của nó trên bảng Kanban bằng background-size
. Việc tùy chỉnh đơn giản này cải thiện đáng kể trải nghiệm trực quan của các bảng Kanban.
5. Canvas Image: Thêm Ảnh Tiêu Đề Ấn Tượng Cho Thẻ Canvas
Ví dụ về CSS snippet Canvas Image trong Obsidian, minh họa cách thêm hình ảnh tiêu đề tùy chỉnh vào các thẻ trên bảng Canvas để tăng cường tính trực quan.
CSS snippet Canvas Image mang đến một cách tuyệt vời để nâng cao tính trực quan cho các bảng Canvas trong Obsidian của bạn. Nó cho phép bạn thêm các hình ảnh tiêu đề phong cách vào từng thẻ riêng lẻ. Bạn có thể linh hoạt trong việc lấy nguồn hình ảnh. Bạn có thể sử dụng hình ảnh được lưu trữ dưới dạng tệp đính kèm trong Obsidian hoặc thêm từ các liên kết bên ngoài. CSS snippet này cho phép bạn nhúng trực tiếp một hình ảnh vào đầu thẻ Canvas. Bạn có thể kéo giãn hình ảnh để lấp đầy chiều rộng của thẻ và chỉ định chiều cao của nó. Snippet này vô cùng hữu ích để tổ chức dự án một cách trực quan, phân biệt rõ ràng các phần, hoặc tăng cường tính thẩm mỹ cho các bản đồ tư duy, các phiên động não, hoặc luồng dự án của bạn trong Canvas. Nó biến các thẻ đơn giản thành các yếu tố hấp dẫn và giàu thông tin hơn nhiều.
6. Media Grid: Sắp Xếp Ảnh & Video Dạng Lưới Ấn Tượng
Giao diện Media Grid trong Obsidian, hiển thị các hình ảnh được sắp xếp gọn gàng theo bố cục dạng lưới, giúp tổ chức trực quan các nội dung đa phương tiện.
CSS snippet Media Grid dành cho Obsidian thay đổi cách tổ chức trực quan các ghi chú. Nó cho phép bạn sắp xếp các tập tin media thành các bố cục dạng lưới đẹp mắt. Điều này bao gồm cả hình ảnh, video và tệp âm thanh. Khả năng tùy chỉnh này tăng cường đáng kể tính hấp dẫn trực quan của tài liệu của bạn.
Việc tạo một lưới media mới rất đơn giản: chỉ cần đặt hai hoặc nhiều liên kết media (hình ảnh, video hoặc âm thanh) liền kề nhau trong tài liệu Markdown của bạn. Thêm một dòng trống giữa các liên kết để bắt đầu một hàng mới trong lưới. Dòng trống này đóng vai trò là dấu phân cách và cho phép bạn sắp xếp bố cục linh hoạt. Media Grid cũng có thể được cấu hình và tùy chỉnh thêm thông qua Plugin Style Settings của Obsidian. Tuy nhiên, đây không phải là yêu cầu bắt buộc đối với các chức năng cơ bản.
Tối Ưu Giao Diện Obsidian: Nâng Cao Năng Suất Từ Những Chi Tiết Nhỏ
Với những CSS snippet tùy chỉnh này, bạn không chỉ thay đổi màu sắc; bạn đang chủ động biến Obsidian của mình thành một trung tâm thực sự cá nhân hóa và mạnh mẽ. Từ những bảng biểu trực quan tuyệt đẹp và ghi chú hàng ngày động, đến các lưới media được tổ chức gọn gàng và bảng Kanban biểu cảm, những snippet này thực sự là một “chất xúc tác năng suất” giúp định hình không gian làm việc kỹ thuật số của bạn để hoàn toàn phù hợp với quy trình làm việc và sở thích thẩm mỹ cá nhân. Hãy thử áp dụng chúng ngay hôm nay để thấy sự khác biệt! Đừng quên chia sẻ những CSS snippet Obsidian yêu thích của bạn hoặc bất kỳ thủ thuật công nghệ nào khác trong phần bình luận bên dưới. Tiếp tục theo dõi 123thuthuat.com để cập nhật thêm nhiều mẹo và hướng dẫn hữu ích khác nhé!