css - Jekyll:在本地使用不同的 CSS 与 Github

Question

对于我在 github 上托管的 Jekyll 创建的网站，我想在本地使用与发布的不同的 CSS。

具体来说，当我通过 http://localhost:4000/blah-blah 访问它时, 我希望一些额外的页面元素可见，当我通过 http://mysite.github.io 访问它时我希望那些额外的元素不可见。

我想添加“编辑我”按钮之类的东西来加载带有 http://localhost:4000/admin 的页面.

我不认为我可以用 liquid 做到这一点，因为变量是在构建时处理的，而我在查看时需要不同的值。

如何让我的 Jekyll 构建的网站根据基本 URL 加载不同的 CSS(或根据基本 URL 隐藏/显示页面元素)？

Answer 1

您可以使用 JavaScript 执行此操作。您可以使用 document.domain 获取您所在的域。

var localsite = "localhost:4000/blah-blah";
var livesite = "mysite.github.io";

var domain = document.domain;

if(domain == localsite){
  // display edit button
}

类似的东西可能会起作用。我还不是 Jekyll 的专家(还)。 jekyll 中可能有一些代码可以帮助您以不同的方式更好地完成此操作。您可能想先花一些时间阅读 Jekyll 文档。