Jekyll：在本地使用不同的 CSS 与 Github答案

【问题标题】：Jekyll: Use Different CSS Locally vs GithubJekyll：在本地使用不同的 CSS 与 Github
【发布时间】：2018-05-01 18:27:17
【问题描述】：

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

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

我想添加诸如“编辑我”按钮之类的内容以加载带有http://localhost:4000/admin 的页面。

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

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

【问题讨论】：

标签： css jekyll

【解决方案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 文档。

【讨论】：