Phương pháp này là không chính thức và liên quan đến đào bới xung quanh trong các tập tin nguồn cho Slack. Nó khá dễ dàng để làm, nhưng vì nó sẽ được ghi đè mỗi khi bạn cập nhật, bạn sẽ phải làm điều này nhiều lần.
Tải xuống một chủ đề
Vì Slack chạy trên Electron, một khuôn khổ để phát triển các ứng dụng Node.js trên máy tính để bàn, bạn có thể chỉnh sửa các kiểu cho ứng dụng như bạn muốn chỉnh sửa CSS của trang web. Nhưng các tệp CSS cho Slack được chôn trong nguồn, vì vậy bạn sẽ phải tải các chủ đề của riêng mình.
Chủ đề chế độ tối thực sự phổ biến nhất là Widget đen. Và kể từ khi mã cổ phiếu Electron trên nền tảng, chủ đề này cũng sẽ hoạt động trên Windows và Linux. Chúng tôi thấy có một số vấn đề với chủ đề trên macOS Mojave, vì vậy nếu nó không hoạt động thì bạn có thể thử cái nĩa này, nó chỉ hoạt động trên macOS nhưng cũng có thể hoạt động với người dùng Windows.
Patching Slack
~AppDataLocalslack
Sau đó, điều hướng một vài thư mục xuống
resources/app.asar.unpacked/src/static/
. Bạn sẽ muốn tìm
ssb-interop.js
tệp, nơi bạn sẽ chỉnh sửa mã. Đảm bảo Slack đã đóng, mở tệp đó trong trình chỉnh sửa văn bản yêu thích của bạn và cuộn xuống dưới cùng:
ssb-interop.js
tập tin:
// First make sure the wrapper app is loaded document.addEventListener('DOMContentLoaded', function() { // Then get its webviews let webviews = document.querySelectorAll('.TeamView webview'); // Fetch our CSS in parallel ahead of time const cssPath = 'https://cdn.rawgit.com/widget-/slack-black-theme/master/custom.css'; let cssPromise = fetch(cssPath).then(response => response.text()); let customCustomCSS = `:root { /* Modify these to change your theme colors: */ --primary: #09F; --text: #CCC; --background: #080808; --background-elevated: #222; } ` // Insert a style tag into the wrapper view cssPromise.then(css => { let s = document.createElement('style'); s.type = 'text/css'; s.innerHTML = css + customCustomCSS; document.head.appendChild(s); }); // Wait for each webview to load webviews.forEach(webview => { webview.addEventListener('ipc-message', message => { if (message.channel == 'didFinishLoading') // Finally add the CSS into the webview cssPromise.then(css => { let script = ` let s = document.createElement('style'); s.type = 'text/css'; s.id = 'slack-custom-css'; s.innerHTML = `${css + customCustomCSS}`; document.head.appendChild(s); ` webview.executeJavaScript(script); }) }); }); });
Có thể bạn sẽ muốn sao chép tệp này và lưu tệp ở một vị trí khác, do đó bạn không phải chỉnh sửa mã mỗi lần. Bằng cách này, bạn chỉ có thể kéo nó vào thư mục để ghi đè lên phiên bản mới nhất:
Thêm chủ đề của riêng bạn
Nếu bạn không thích giao diện của nó, bạn có thể chỉnh sửa CSS với bất kỳ kiểu nào bạn muốn. Tất cả mã này đều tải các kiểu tùy chỉnh từ https://cdn.rawgit.com/widget-/slack-black-theme/master/custom.css; bạn có thể tải xuống tệp đó, chỉnh sửa tệp đó bằng các thay đổi của mình và thay thế URL bằng mã của riêng bạn. Lưu, khởi chạy lại Slack và các thay đổi của bạn sẽ hiển thị. Nếu bạn không biết CSS hoặc chỉ muốn thực hiện thay đổi nhỏ, có bốn biến màu được xác định trước khi tải CSS, vì vậy bạn chỉ có thể chỉnh sửa các biến đó bằng màu của riêng mình.
